我想在React Native中使用纬度和经度在谷歌地图内绘制多边形

时间:2018-10-17 08:44:48

标签: react-native react-native-android react-native-maps

如何使用react native在谷歌地图中绘制多边形。我有一个纬度和经度的数组列表,我想在谷歌地图中使用纬度和经度绘制多边形。

2 个答案:

答案 0 :(得分:0)

请检查该包装的文档,Polygon组件接受一个坐标数组来绘制它。

应该围绕这些行,其中您的状态是坐标数组。

<Polygon coordinates={this.state.coordinates}/>

https://github.com/react-community/react-native-maps/blob/master/docs/polygon.md

答案 1 :(得分:0)

这是答案

<MapView>
    <Polygon
        coordinates={[
            { latitude: 37.8025259, longitude: -122.4351431 },
            { latitude: 37.7896386, longitude: -122.421646 },
            { latitude: 37.7665248, longitude: -122.4161628 },
            { latitude: 37.7734153, longitude: -122.4577787 },
            { latitude: 37.7948605, longitude: -122.4596065 },
            { latitude: 37.8025259, longitude: -122.4351431 }
        ]}
        strokeColor="#000" // fallback for when `strokeColors` is not supported by the map-provider
        strokeColors={[
            '#7F0000',
            '#00000000', // no color, creates a "long" gradient between the previous and next coordinate
            '#B24112',
            '#E5845C',
            '#238C23',
            '#7F0000'
        ]}
        strokeWidth={6}
    />
</MapView>