Opacity Issue on Objects with mapView.updateState

Mappedin JS
1

Hi everyone,

I’m using objects (MapObject) to represent exhibition booths on my map, and I want to apply transparency using the opacity property.

:dart: Context

  • Mappedin SDK version: v6.0.1-beta.24
  • I’m adding a background image to the map:
mapView.Images.add(mapData.mapCenter, 'https://BG-URL', { 
  width: 30, 
  height: 20, 
  rotation: 0, 
  verticalOffset: 0.1,
});
  • I’m trying to make my booths semi-transparent:
mapView.updateState(element, {
  interactive: true,
  color: 'pink', 
  opacity: 0.5,
});

:mag: Issue

  • The opacity is applied, but the background remains invisible through the objects.
  • It looks like the object is still fully opaque even with an opacity value < 1.

:question: Questions

  1. Is opacity supposed to affect the actual transparency of MapObject elements?
  2. Is there a way to make the background image visible through the objects?
  3. Should I enable a specific setting or use another type of element (Space instead of Object)?

Thanks for your help! :raised_hands:

2

Hi Romain!

I’ve recreated this scenario with images and opacity on MapObjects. I’ve noticed the same behavior and have raised this issue with the SDK Team. Functionality should be actual transparent so hopefully we can get a resolve soon. :bug::mag:

Thanks for raising this! :partying_face:

Will keep you posted!