我也通过服务器和多边形渲染位置。
当用户不在多边形时,它会抛出一些信息。
<MapView
style={styles.map}
toolbarEnabled={true}
region={{
latitude:this.state.lat,
longitude: this.state.long,
latitudeDelta: 0.015,
longitudeDelta: 0.0121,
}}
rotateEnabled={true}
provider={this.props.provider}
onPress={e => this.onPress(e)}
{...mapOptions}
animateToCoordinate={[this.state.initialPosition, 500]}
>
{this.state.polygons.map(polygon => (
<Polygon
key={polygon.id}
coordinates={polygon.coordinates}
holes={polygon.holes}
strokeColor="#F00"
fillColor="rgba(255,0,0,0.5)"
strokeWidth={2}
/>
))}
{this.state.editing && (
<Polygon
key={this.state.editing.id}
coordinates={this.state.editing.coordinates}
holes={this.state.editing.holes}
strokeColor="#000"
fillColor="rgba(255,0,0,0.5)"
strokeWidth={2}
/>
)}
<Marker coordinate={{
latitude:this.state.lat,
longitude: this.state.long}} >
</Marker>
</MapView>
&#13;
我正在使用:
答案 0 :(得分:1)
使用https://github.com/surialabs/react-native-geo-fencing库进行检查 多边形点
componentDidMount() {
const polygon = [
{ lat: 3.1336599385978805, lng: 101.31866455078125 },
{ lat: 3.3091633559540123, lng: 101.66198730468757 },
{ lat: 3.091150714460597, lng: 101.92977905273438 },
{ lat: 3.1336599385978805, lng: 101.31866455078125 } // last point has to be same as first point
];
let point = {
lat: 2.951269758090068,
lng: 101.964111328125
};
GeoFencing.containsLocation(point, polygon)
.then(() => console.log('point is within polygon'))
.catch(() => console.log('point is NOT within polygon'))
}
&#13;
将多边形数据传递给多边形数组和标记点。 它会以多边形显示你的..或