React-Native-Maps 如何绘制折线答案

【问题标题】：React-Native-Maps how to draw polylinesReact-Native-Maps 如何绘制折线
【发布时间】：2016-10-13 11:57:18
【问题描述】：

我已经开始使用https://github.com/airbnb/react-native-maps 并且没有运气从地图上的数组坐标数组中绘制折线。

我不确定我是否正确传递了坐标数组。

这就是我渲染折线的方式：

      {this.state.polylines.map(polyline => (
        <MapView.Polyline
          key={polyline.id}
          coordinates={polyline.coordinates}
          strokeColor="#000"
          fillColor="rgba(255,0,0,0.5)"
          strokeWidth={1}/>
      ))}

polyline.coordinates 看起来像：

      [[lat,lng],[lat,lng],[lat,lng]]

感谢您的任何帮助/建议：D

【问题讨论】：

你是如何得到 Lat 和 Lng 数组的？？？ [ [经纬度，经纬度]，[经纬度，经纬度]]。 .??\

标签： javascript reactjs react-native apple-maps

【解决方案1】：

我认为坐标必须是LatLng 类型的数组，因为它记录在API 中。

LatLng 对象是如何创建的，例如可以在组件MapMarker 中找到。在这里您可以找到source code（链接到相关行）和component API。

希望对你有帮助，
马吕斯

【讨论】：

你是对的，MapView.Polyline 组件需要一个 prop 坐标，它应该是一个 lat/lng 坐标对对象的数组。
感谢您的帮助！
不客气。很高兴听到这可以解决您的问题:)
如果您使用自己的地图图块，将“zIndex={1}”添加到折线道具以使线条可见可能会有所帮助。我注意到这个 b/c 我在研究一个没有显示多边形的类似问题时发现了这个页面。