内嵌传单数据采集或geojson.io地图形成

Embed leaflet data collection or geojson.io map to form

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

有没有办法去掉 geojson.io 之类的东西,甚至只是带有 leaflet.draw 的传单地图,然后将生成的坐标传递到可以通过电子邮件发送的文本中?

同样,我的需求是基本的。一次映射一个形状。视觉选项和控件越少越好。我的听众主要是非技术人员。

看起来像 this user was trying to ask the same question,但没走多远。

谢谢!

概念的快速证明,改编来自 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 字符串,并将其显示在绑定到该项目的弹出窗口中。

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

here所述,您不能直接发送您的geojson数据,但您可以让浏览器打开一个包含预设数据的邮件客户端。

  var text=JSON.stringify(drawnItems.toGeoJSON());
  window.open('mailto:test@example.com?subject=subject&body=' + text);

这里是完整的example