mapbox / mapbox/mapbox-gl-js

SetPaintProperty with icon-translate and match doesn't work?

Open
#12,014 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

auto-triaged bug :lady_beetle:
Dominant language
TypeScript
Stars
12.4k
Forks
2.4k
PR merge metrics
No merged PRs in 30d

Description

Hello!

I thank you in advance for the answer you will give me, regardless of the outcome.

mapbox-gl-js version: "^2.7.0"

Question

I use setPaintProperty with icon translate and match. I tried to use different syntaxes present in the documentation like :

 map.current.setPaintProperty(
          'unclustered-point',
          'icon-translate',
          ['match', ['id'], id,
          [0, -200],
          [0, 0]
          ]
        )

or

 map.current.setPaintProperty(
          'unclustered-point',
          'icon-translate',
          ['match', ['id'], id,
          ['literal', [0, -200]],
          ['literal', [0, 0]]
          ]	
        )

Neither syntax works.

I want to move a marker to the click because the image changes and takes more space, so the location is no longer accurate. I just want to move the marker up.

I get the id right because if I change the property, with the opacity for example, it works perfectly. I can't seem to get it to understand that I'm passing it an array

Can you explain to me why this doesn't work?

Links to related documentation

SetPaintProperty : https://docs.mapbox.com/mapbox-gl-js/api/map/#map#setpaintproperty
Icon-translate : https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#paint-symbol-icon-translate

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with Map#setPaintProperty and the icon-translate style-spec documentation linked in the issue, then reproduce both match-expression examples using the unclustered-point layer and a known feature id. Done means determining why the array-valued expression is rejected or ineffective and documenting or correcting behavior so the selected marker moves as intended.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend, web-dev
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.