React-Native-Maps 如何绘制折线

Posted 2023-02-23

【中文标题】React-Native-Maps 如何绘制折线

【英文标题】：React-Native-Maps how to draw polylines

【发布时间】：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 数组的？？？ [ [经纬度，经纬度]，[经纬度，经纬度]]。 .??\

【参考方案1】：

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

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

希望对你有帮助， 马吕斯

【讨论】：

你是对的，MapView.Polyline 组件需要一个 prop 坐标，它应该是一个 lat/lng 坐标对对象的数组。

感谢您的帮助！

不客气。很高兴听到这可以解决您的问题:)

如果您使用自己的地图图块，将“zIndex=1”添加到折线道具以使线条可见可能会有所帮助。我注意到这个 b/c 我在研究一个没有显示多边形的类似问题时发现了这个页面。