如何解决React Native:如何在 geojson 点上显示标记信息?
我尝试从 geojson 点获取信息,但找不到任何解决方案。
我的 geojson 中的点:
{
"type": "Feature","properties": {
"name": "bridge","sym": "Waypoint"
},"geometry": {
"type": "Point","coordinates": [
35.1480779,31.6900743,933
]
}
}
标记和航点完美无缺,我只需要显示点击事件的信息。
解决方法
如果您想在每次单击标记时显示来自 geojson 数据的信息,您可以从 geojson 数据设置标题或描述的值。下面是一个 sample code 和代码片段:
import React,{ Component } from 'react';
import { Text,View,StyleSheet,Dimensions } from 'react-native';
import MapView,{ Marker,Geojson } from 'react-native-maps';
const styles = StyleSheet.create({
container: {
flex: 1,backgroundColor: '#fff',alignItems: 'center',justifyContent: 'center',},map: {
width: Dimensions.get('window').width,height: Dimensions.get('window').height,});
const myPlace = {
type: 'FeatureCollection',features: [
{
type: 'Feature',properties: {
name: 'bridge',sym: 'Waypoint',geometry: {
type: 'Point',coordinates: [64.165329,48.844287],],};
class MapApp extends Component {
render() {
return (
<View style={styles.container}>
<MapView
style={styles.map}
initialRegion={{
latitude: 64.165329,longitude: 48.844287,latitudeDelta: 0.0922,longitudeDelta: 0.0421,}}>
<Marker
coordinate={{
latitude: myPlace.features[0].geometry.coordinates[0],longitude: myPlace.features[0].geometry.coordinates[1],}}
title={myPlace.features[0].geometry.type}
description={myPlace.features[0].properties.name}
/>
<Geojson
geojson={myPlace}
strokeColor="red"
fillColor="green"
strokeWidth={2}
/>
</MapView>
</View>
);
}
}
export default MapApp;
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。