0

我的问题

大家好，

我正在尝试在 Vue 应用程序中使用 Mapbox-gl Draw。我已经使用了 Mapbox-gl，它运行良好。

当我尝试使用 Mapbox-gl Draw 时，会显示控件容器，但不显示控件图标。

我正在以建议的方式导入 Draw：

import MapboxDraw from "@mapbox/mapbox-gl-draw";

let draw = new MapboxDraw();
map.addControl(draw)

触发地图事件map-load时调用此代码。放大/缩小和北重置控件正常显示，但绘图控件不显示。

我在寻找什么

我猜这与 Mapbox-gl 与 Vue 不兼容有关，但我可能弄错了。我在 StackOverflow 或 Mapbox-gl Draw 问题中没有发现类似的问题，但我不能是唯一遇到这种情况的人。或者也许我是？

如果有人可以帮助我使这些图标出现，或者甚至用非 mapbox 图标替换它们，那就太好了！

谢谢你，祝你有美好的一天

4

1 回答 1

0

现在，我在创建控件容器后直接对其进行修改：

 document.querySelectorAll(".mapboxgl-ctrl-group").forEach(a => {
        let children = a.children;
        children.forEach(e => {
          let title = e.getAttribute("title");
          if (title == "LineString tool (l)") {
            e.innerText = "L";
          }
          if (title == "Polygon tool (p)") {
            e.innerText = "P";
          }
          if (title == "Marker tool (m)") {
            e.innerText = "M";
          }
          if (title == "Delete") {
            e.innerText = "️";
          }
          if (title == "Combine") {
            e.innerText = " ";
          }
          if (title == "Uncombine") {
            e.innerText = " ";
          }
        });
      });

但这真的很残酷，所以我仍然对不那么暴力的解决方案感兴趣。

于 2021-10-08T14:09:13.660 回答