在react-native-maps上显示自定义图像作为标记

Question

我要在react-native-maps中将我的自定义图片显示为标记，如下所示，但是在地图上什么都没有显示

<MapView
        style={{ flex: 1 }}
        region={this.state.region}
        ref={ref => { this.map = ref; }}
        zoomControlEnabled={true}
    >


        <MapView.Marker
            identifier="destination"
            coordinate={direction.destination}
            anchor={{ x: 0.5, y: 0.5 }}
        >
            <View style={{ width: 10, height: 10 }}>
                <Image source={require('../assets/images/destination-3.png')} style={{ width: 10, height: 10 }}/>
            </View>

        </MapView.Marker>
    </MapView>

我可以看到<MapView.Marker>内除<Image/>和<ImageBackground>之外的任何元素。麻烦了。

Answer 1

对我而言唯一有效的解决方案是使用sscanf意味着在svg内渲染图像，而不是通过直接反应本机Image来渲染

svg

如果我想第一次看到它，我会在页面中渲染此svg两次以上！（并给负的顶部和左侧绝对位置以隐藏该符号）

Answer 2

我已经使用GIMP（Linux的Photoshop替代品）将我的图像最小化为一个图标大小（在GIMP中打开图像->“图像”->“缩放”->提供您想要的大小。），我的代码就是这样

<MapView
      initialRegion={this.state.loc}
      region={this.state.loc}
      style={styles.map}     
      >
      <Marker coordinate={{
            latitude: 7.093546,
            longitude: 79.993703,}}
            image={require('./img/icon.png')} >
      </Marker>
</MapView>

希望这会有所帮助。