kim young chan
kim young chan

Reputation: 300

how to Using svg in iconlayer of deck.gl

my test code

     const layer = 
    new IconLayer({
      id: 'icon-layer',
      data,
      getIcon: d=> ({data : 'data/test.svg', width:128, height:128}),
      getSize: d => Math.max(2, Math.min(d.contributions / 1000 * 25, 25)),
      pickable: true,
      sizeScale: 15,
      getPosition: d => [127.14467,31.39953]
    });

I got a error.

icon-manager.js:366 DOMException: The source image cannot be decoded.

how to Using svg in iconlayer of deck.gl?

Upvotes: 4

Views: 2127

Answers (4)

tipodice
tipodice

Reputation: 1

Replace the definition of the getIcon attribute with the following:

getIcon: d => ({url : 'ICON_URL', width:128, height:128})

Upvotes: 0

kim young chan
kim young chan

Reputation: 300

I checked svg file. All languages ​​except English and numbers in the svg file must not be included. ex : korean, Japanese... If it is in English only, it works.

Upvotes: 0

AdriSolid
AdriSolid

Reputation: 2825

You can upload your own svg to deck.gl, it doesn't have to be just a url.

Check this out: https://stackoverflow.com/a/69123265/14954503

Upvotes: 1

paul blackmore
paul blackmore

Reputation: 331

According to the API reference the returned object of the getIcon callback must contain a url property. From the documentation:

getIcon: d => ({
  url: d.avatar_url,
  width: 128,
  height: 128,
  anchorY: 128
}),

In your example you need to rename the url property to data.

Upvotes: 2

Related Questions