如何突出显示这样的反应本机地图？

Question

我正在使用 react-native-maps 库来显示地图，但是如何像这张截图那样突出显示一个区域？

Answer 1

叫做Polygon。

1. 您需要提供要突出显示的区域的坐标。

2. 将所有坐标放在一个数组中。

3. 一个坐标将用一条直线连接到它之前的坐标。对于您发布的图片，您需要大量坐标。我个人不知道 public API 那个 returns 所需区域的坐标数组，但我确定有一个，只是 google 它。

在数组中获得坐标后，在 MapView:

中像这样使用它们

<MapView>
    <MapView.Polygon
        coordinates={[
            { latitude: 123, longitude: 123 },
            { latitude: 124, longitude: 124 },
            ...
        ]}
        strokeWidth={1}        // The width of the outline of the shape
        strokeColor='#4099FF'  // Color of the outline
        fillColor='rgba(...)'  // Shape color
    />
</MapView>