如何标注在阵营本地地图的固定位置的位置？

如何解决如何标注在阵营本地地图的固定位置的位置？

我试图定位在屏幕的底部的标注，并将它固定到即使在地图上移动该位置？有没有人在阵营本地地图实现这一点任何运气？

我所有的尝试都没有将标注固定到屏幕底部。 我发现的唯一方法是避免使用所提供的标注组分反应天然-地图。

下面是标注的代码：

<Callout 
    tooltip
    style={styles.itemContainer}
>
    <CalloutSubview 
        style={styles.button} 
        onPress={closeCallout}
    >
        <Ionicons name="ios-close-circle" size={30} style={styles.icon} />
    </CalloutSubview>
    <SemiBoldHeadline 
        fontSize={18}
        text={title}
        marginTop={0}
        marginBottom={4}
        marginRight={30}
    />
    <BodyText 
        fontSize={14}
        lineHeight={18}
        marginRight={30}
    >
        {editedString}
    </BodyText>
    <View style={styles.inlineContainer}>
        <CalloutSubview onPress={() => RouteService.openMaps(coordinates.latitude,coordinates.longitude,title)}>
            <SmallDirectionsButton />
        </CalloutSubview>
        <CalloutSubview onPress={readMoreFunction}>
            <ReadMoreButton 
                text={'Read More'}
            />
        </CalloutSubview>
    </View>
</Callout>

下面是标注的样式：

const styles = StyleSheet.create({
itemContainer: {
    borderRadius: 5,borderWidth: 1,borderColor: Colors.borderColor,width: Layout.window.width - 100,backgroundColor: Colors.white,padding: 20,paddingRight: 25
},inlineContainer: {
    flexDirection: 'row',flexWrap: 'wrap',},button: {
    position: 'absolute',top: 0,right: 0,paddingLeft: 10,paddingRight: 10,paddingTop: 10,paddingBottom: 30,zIndex: 10,icon: {
    color: Colors.almostBlack,opacity: 0.5
}
});

解决方法

如果您需要在地图上方“静态地”渲染自定义反应组件，则不应使用地图的标注组件来构建它。相反，创建一个视图并将其放置在地图组件的绝对上方：

<>
  <Map .../>
  <View style={{ position: "absolute",bottom: "20"}}>
    {/* Your custom view content goes here*/}
  </View>
</>

标注组件只是为了直接在地图上下文中使用而构建的，并且预计会在地图移动时移动。