使用线连接两个数据图层中的地理标记

Question

我正在构建一个传单.js地图，其中包含两个保存为 js 文件的不同 JSON 数据层。

第一个数据文件包含一些新闻编辑室的地理位置和新闻编辑室

的ID，第二个数据文件包含一些文章的地理位置以及新闻编辑室的ID。

我想绘制这些位置，并通过线将所有带有 ID X 的文章连接到具有 ID X 的新闻编辑室。

两个数据图层都另存为变量。我知道如何绘制地理位置，但我无法弄清楚如何将第 2 层的地理点与第 1 层的匹配地理点与带有线条的匹配地理点连接起来。有什么建议吗？

这是我到目前为止所做的：

function myFunction() {
 var map = L.map('map').setView([51.101516, 10.313446], 6);
  // improve experience on mobile
  if (map.tap) map.tap.disable();
  L.tileLayer('http://server.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Light_Gray_Base/MapServer/tile/{z}/{y}/{x}', {
    attribution: 'Tiles © Esri — Esri, DeLorme, NAVTEQ',
    maxZoom: 16
}).addTo(map);
  map._layersMinZoom=5; 

for (var i in artikeldaten){
         data = artikeldaten[i];
         L.circleMarker([data.lat, data.long], {
          radius: 4,
          color: '#000',
          fillColor: '#000',
          fillOpacity: 1,
        }).addTo(map)
      } 
for (var i in blogdaten){
         data = blogdaten[i];
   L.circleMarker([data.lat, data.long], {
          radius: 5,
          color: '#000',
          fillColor: '#000',
          fillOpacity: 1,
        }).addTo(map)              
      }
}

这是数据的样子：

    var artikeldaten = [
 {
   "ID": 12,
   "long": 6.7667818,
   "lat": 51.2135308,
 },
 { ... and so on

Answer 1

如果我很好地理解了这个问题，您必须首先将其中一个列表放在关联数组中。

var newsroomsById = {}; // key: ID
for(i=0; i<newsrooms.length; i++) {
    newsroomsById[newsrooms[i].ID] = newsrooms[i];
}

然后，您可以在迭代文章时绘制折线

for(i=0; i<articles.length; i++) {
    // retrieve newsroom
    var newsroom = newsroomsById[articles[i].ID];
    // draw your polyline
    var latlngs = [
      [articles[i].lat, articles[i].lng],
      [newsroom .lat, newsroom.lng]
    ];
    var polyline = L.polyline(latlngs, {color: 'red'}).addTo(map);
}