如何在deck.gl的圖標層中使用svg

Question

我的測試代碼

     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]
    });

我有一個錯誤。

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

如何在deck.gl的圖標層中使用svg？

Answer 1

根據API 引用， getIcon回調返回的 object 必須包含url屬性。 從文檔中：

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

在您的示例中，您需要將url屬性重命名為data 。

Answer 2

您可以將自己的 svg 上傳到 deck.gl，它不必只是 url。

看看這個： https://stackoverflow.com/a/69123265/14954503

Answer 3

我檢查了 svg 文件。 svg 文件中除英語和數字外的所有語言不得包括在內。 例如：韓文、日文……如果只有英文，它可以工作。