Google maps 使用Google Maps和Resact Js ES6显示多个标记

我可以显示一个标记，但当我在循环中映射创建新的google.maps.marker时，不会返回任何内容。以前有人加密过吗？下面的代码和附加的代码笔

代码笔：

GMap类扩展了React.Component{
状态={zoom:10}；
静态类型（）{
initialCenter:React.PropTypes.objectOf（React.PropTypes.number）.isRequired
}
render（）{
回来
当前缩放：{this.state.Zoom}

}
componentDidMount（）{
//在组件完成后创建地图、标记和信息窗口
//因为我们需要为Google操作DOM，所以被渲染=(
this.map=this.createMap（）
this.marker=this.createMarker（）
this.infoWindow=this.createInfoWindow（）
//必须在这里定义谷歌地图事件监听器
//因为在创建侦听器之前，我们无法在映射上添加侦听器
google.maps.event.addListener（this.map，‘zoom_changed’，（）=>this.handleZoomChange（））
}
//组件卸载时清理事件侦听器
componentDidUnMount（）{
google.maps.event.clearListeners（映射“zoom\u changed”）
}
createMap（）{
让mapOptions={
zoom:this.state.zoom，
中心：this.mapCenter（）
}
返回新的google.maps.Map（this.refs.mapCanvas，mapOptions）
}
地图中心（）{
返回新的google.maps.LatLng(
this.props.initialCenter.lat，
this.props.initialCenter.lng
)
}
createMarker（）{
常量导航链接=[
{地点：拉脱维亚邦迪海滩：-33.890542，长：151.274856}，
{地点：'Coogee Beach'，拉脱维亚：-33.923036，长：151.259052}，
{地点：'Cronulla Beach'，拉脱维亚：-34.028249，长：151.157507}，
{地点：'曼利海滩'，拉特：-33.80010128657071，长：151.28747820854187}
];
navLinks.map（（b，i）=>{
返回新的google.maps.Marker({
位置：新google.maps.LatLng（b.lat，b.long），
地图：这是地图
})
console.log（b.long）
})
}
createInfoWindow（）{
let contentString=“我是一个包含信息的窗口”
返回新的google.maps.InfoWindow({
map:this.map，
主持人：这个，马克，
内容：contentString
})
}
handleZoomChange（）{
这是我的国家({
zoom:this.map.getZoom（）
})
}
}
var initialCenter={lng:-90.1056957，lat:29.9717272}
ReactDOM.render（，document.getElementById（'container'））；

在

createMarker

中，您实际上没有返回任何内容。您需要返回

navLinks.map

。您也没有看到console.log，因为它位于map中的return语句下方

return navLinks.map((b, i) => {
  console.log(b.long)
  return new google.maps.Marker({
    position: new google.maps.LatLng(b.lat, b.long),
    map: this.map
  })
})

---

谢谢，安德鲁。仍然没有骰子。codepen：你能澄清预期的行为是什么吗？根据阵列中的lat和长跳线显示多个标记。你在澳大利亚看过吗？那里有4个标记。你的坐标肯定在某个地方不正确。这个错误是：错误：设置位置：不是LatLng或LATLENTERAL:在属性lat:不是nu中mber.如果跳线正确，则不会

return navLinks.map((b, i) => {
  console.log(b.long)
  return new google.maps.Marker({
    position: new google.maps.LatLng(b.lat, b.long),
    map: this.map
  })
})