Question

我使用MapTiler和Leafletjs创建了一个虚构的地图，其中包含了我想从我的代码中引用的数百个点。我在Leafletjs中创建了一个参考标记，我可以将其拖动到地图上的特定位置并获取像素坐标。

我现在需要为所有这几百个点做同样的事情，以便生成[location_name as key, coordinates as value]的键/值对。如果我手动执行此操作，可能需要数周时间。

我是否可以在Leaflet中遵循自动化方法，以便更轻松地检索坐标？地图最初是一个矢量图像，我将其转换为png，然后使用MapTiler来满足所有不同尺寸Leafletjs的需求。

以下代码显示了参考标记的工作原理：

var map = L.map('map').setView([60, 0], 0);

    L.tileLayer('{z}/{x}/{y}.png', {
      maxZoom: 5,
      minZoom: 1,
      continuousWorld: false,
      noWrap: true,
      crs: L.CRS.Simple
    }).addTo(map);

    var marker = L.marker([70, 0], {
      draggable: true,  
    }).addTo(map);
    marker.bindPopup('<b>Test</b>').openPopup();

    marker.on('dragend', function(e) {
      alert(marker.getLatLng().toString()); 
    });

Answer 1

更好的工作流程如下：

在地图中添加click事件处理程序，以便可以创建新标记
将新创建的标记添加到全局可访问的数组
使所有标记可拖动
在地图外添加一个按钮，可以一次console.log()所有标记（然后复制粘贴）

在不知道数据的原始格式的情况下，很难看出数据是否可以自动转换，但是制作一个快速工具来减轻定位几百点的痛苦是可行的。

在Leafletjs中自动获取多个点的坐标

1 个答案: