我目前正试图仅在单击特定标记时才在反应本机地图上显示多边形。我已经尝试为列表中的每个事件绘制一个圆圈,但是最终显示了所有圆圈,overlapping - see attached picture
我也试图将Circle放入标记和标注中,但这似乎不起作用。类似于在点击标记时如何显示标注文字,我还希望在其周围显示一个圆圈/多边形。不同的标记将具有不同的关联半径。
感谢您的帮助,谢谢! PS:我在iOS上也有一个错误,有时多边形填充颜色只是决定什么都不是。
(this.state.frenzyEventsList).map(event => (
<View key={event.id} >
<Marker
pinColor={"purple"}
coordinate={{latitude: parseFloat(event.loc_lat), longitude: parseFloat(event.loc_long)}}
title={event.name}
description={event.description}>
<Callout
alphaHitTest
tooltip
onPress={e => {
if (
e.nativeEvent.action === 'marker-inside-overlay-press' ||
e.nativeEvent.action === 'callout-inside-press'
) {
return ;
}
this.props.navigation.navigate('EventDetails', {
title: event.title,
description: event.description,
frenzyMode: event.frenzyMode,
});
}}
style={styles.customView}>
<CustomCallout>
<Text> {event.name} {event.radius} </Text>
</CustomCallout>
</Callout>
</Marker>
<Circle
ref={ref => { this.invitationRadius = ref; }}
key = {(this.props.frenzyRadius).toString() }
center = {{
latitude: parseFloat(event.loc_lat),
longitude: parseFloat(event.loc_long), }
}
radius = {parseFloat(event.radius)}
fillColor = {'#ffb3b3'}
strokeColor= {'#e80c25'}
strokeWidth = { 2 }
/>
</View>