在反应原生地图上绘制多边形答案

【问题标题】：Drawing polygon on react native maps在反应原生地图上绘制多边形
【发布时间】：2020-07-31 07:50:36
【问题描述】：

我正在使用 react-native-maps。有什么方法可以在 react-native-maps 中绘制多边形并获取顶点坐标？

【问题讨论】：

【解决方案1】：

这是我的代码中的 sn-p


import MapView, { PROVIDER_GOOGLE, Marker } from "react-native-maps";


render: 

 {directions && (
            <MapView.Polyline coordinates={directions} strokeWidth={4} />
 )}

我正在使用这个函数来获取折线：

export const getDirections = async (pickup, dropoff) => {
    let response = await callMapsAPI(pickup, dropoff)
    // console.log("Cords of direction res: ", response);
    if (response) {
        // let respJson = await response.json();
        // console.log("Cords of direction res json: ", respJson);
        let points = Polyline.decode(response.data.routes[0].overview_polyline.points);
        // console.log("Cords of direction res points: ", points);
        let coords = points.map((point, index) => {
            return {
                latitude: point[0],
                longitude: point[1]
            }
        })
        return coords
    } else return null
}

在哪里

import Polyline from '@mapbox/polyline';

【讨论】：

我需要这个 jsfiddle.net/geocodezip/qe68usv3/1 的 react-native 版本

【解决方案2】：

对于 React Native，你可以使用使用 PanResponder 跟踪 x y 并转换为纬度和经度。你可以在这里查看：https://github.com/dev-event/react-native-maps-draw

【讨论】：