maps: iconImage does not work with ["get", "image"] expression if image attribute is the uri
Describe the bug
I need to load iconImage from uri that stored in feature properties.
It works fine If I pass an uri directly to iconImage attribute, like this
iconImage: 'http://my.server.com/images/image1.jpg'
But it does not work if I try to get uri from attribute:
iconImage: ['get', 'iconUri']
I also tried to use image expression but it seems not implemented
iconImage: ['image', ['get', 'iconUri']]
To Reproduce Create a ShapeSource with SymbollLayer
const markers = {
type: "FeatureCollection",
features: [{
geometry: {
type: "Point",
coordinates: [37.6090439796016, 55.7199091654129],
},
type: "Feature",
properties: {
iconUri: 'http://my.server.com/images/image1.jpg',
}
}]
};
const layerStyles = {
imageLevel1: {
iconImage: ['get', 'iconUri'],
iconSize: 0.8,
iconAllowOverlap: true,
iconIgnorePlacement: true,
},
};
<MapboxGL.ShapeSource
id='allMarkers'
onPress={this.onPressMarker}
shape={markers}
>
<MapboxGL.SymbolLayer
id="imagesInMarkersLevel1'
filter={['==', 'isRecommended', 1]}
style={layerStyles.imageLevel1}
/>
</MapboxGL.ShapeSource>
Expected behavior Image is visible
Versions (please complete the following information):
- Platform: Android
- Device: Mi 9 SE
- Emulator/ Simulator: yes
- OS: Android 9
- SDK Version: 28
- React Native Version: 0.61.5
About this issue
- Original URL
- State: closed
- Created 4 years ago
- Comments: 18 (9 by maintainers)
If I’m not mistaken fetching images from a url is also not available from the mapbox style spec of iconImage. The image has to come from the map sprite or added images.