Question

我正在构建一个leaflet.js映射，其中两个不同的JSON数据层保存为js-files。

第一个数据文件包含一些新闻编辑室的地理位置和新闻编辑室的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 &copy; Esri &mdash; 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);
}

使用线连接两个数据层的geomarkers

1 个答案: