maps - 将传单数据收集或geojson.io map 嵌入到表单中

Question

我正在尝试找出最轻量级的方法来从非技术用户收集单个映射多边形的数据。最终愿景是这样的:用户填写一个网络表单，绘制一个形状，然后他们可以轻松地将格式化数据通过电子邮件发送给我或我的同事(我知道——电子邮件的想法可能会让读者感到恐惧，但我正在一个许多限制性参数超出了我的控制范围。电子邮件是已知数量。)。

有没有办法剥离像 geojson.io 这样的东西，甚至只是使用 leaflet.draw 的传单 map ，然后将结果坐标传递到可以通过电子邮件发送的文本中？

再说一次，我的需求是基本的。一次将映射一个形状。视觉选项和控件越少越好。我的观众大部分都是非技术人员。

看起来像this user was trying to ask the same question ，但并没有走远。

谢谢!

Answer 1

快速概念验证，改编自 Leaflet.draw 的代码示例:

var drawControl = new L.Control.Draw({
  edit: {
    featureGroup: drawnItems
  }
});
map.addControl(drawControl);

map.on('draw:created', function(e) {
  var layer = e.layer,
      popupContent = layer.toGeoJSON ?
        JSON.stringify(layer.toGeoJSON()) : "(no data)";

  drawnItems.addLayer(layer);

  layer.bindPopup(popupContent).openPopup();
});

这会将绘制的项目转换为 GeoJSON 字符串，并将其显示在绑定(bind)到该项目的弹出窗口中。

演示:https://jsfiddle.net/3v7hd2vx/75/