结合geojson和json为leaftlet [英] Combining geojson and json for leaftlet

问题描述

我有一张带有GeoJson图层的Leaflet地图

I have a Leaflet map with a GeoJson Layer on it

    var objJson = "https://raw.githubusercontent.com/salucci/Leaflet-Teste/master/BrasilNovo.json";
geojsonLayer = new L.GeoJSON.AJAX(objJson, { style: style, 
    onEachFeature: onEachFeature});
    geojsonLayer.addTo(map);
    info.addTo(map);

并且还有一个从本地PHP服务器接收Json数据的Ajax请求。

And also have a Ajax request that receives Json data from a local PHP server.

$.ajax({
    url: "http://127.0.0.1/projects/phpController.php",
    type: "POST",
    dataType: "json",
    data: {"Codigo": 1100023},
    success: function(data){
        console.log(data); //here is my data
    },
    error: function(error){
         console.log("Error:");
         console.log(error);
    }
});

GeoJson是一种沉重的，所以我不想在服务器上生成整个GeoJson每次，Idea都会在Ajax请求之后通过ID（类似SQL连接）合并静态 GeoJson和动态 Json，然后将合并对象放在Leaflet Layer

The GeoJson is a kind of heavy, so I don't want to generate de whole GeoJson on server everytime, the Idea is merge the static GeoJson and the dynamic Json by ID(something like SQL join) after the Ajax request and then put the merged object on the Leaflet Layer

GeoJson看起来像：

The GeoJson looks like:

{"type":"FeatureCollection","features":[
{"type":"Feature","geometry":{"type":"Polygon","coordinates":[[[-73,-7],[-73,-8]]]},"properties":{"field1":"value1","field2":"value2","ID":"1"}},
{"type":"Feature","geometry":{"type":"Polygon","coordinates":[[[-73,-7],[-73,-9]]]},"properties":{"field1":"value1","field2":"value2","ID":"2"}},
{"type":"Feature","geometry":{"type":"Polygon","coordinates":[[[-73,-7],[-73,-11]]]},"properties":{"field1":"value1","field2":"value2","ID":"3"}}]}

来自Ajax请求的Json看起来像：

And the Json from Ajax request looks like:

[{"id":"1","field3":"value3","field4":"value4"},{"id":"2","field3":"value3","field4":"value4"},{"id":"3","field3":"value3","field4":"value4"}]

所以基本上我想将字段field3和field4及其值放入由id连接的GeoJson属性中。使用javascript执行该操作的最佳/最快方法是什么？

So Basically I want to put the fields field3 and field4 with their values into GeoJson properties joining by id. What's the best/fastest way to perform that using javascript?

有没有办法在运行后合并另一个（第三个）Json？

Is there a way to merge another(third) Json later in runtime?

推荐答案

当Leaflet解析您的GeoJSON数据并构建GeoJSON图层组（您已存储在 geojsonLayer 中变量），它将特征数据记录到每个相应层的特征属性中。

When Leaflet parses your GeoJSON data and builds a GeoJSON Layer Group (that you have stored in your geojsonLayer variable) out of it, it records the features data into the featureproperty of each corresponding layer.

所以对于例如，在 geojsonLayer 中，您将获得（以及其他）多边形:(以下称为 layer ）

So for instance, in your geojsonLayer you will get (among others) a polygon with: (below referred to as "layer")

layer.feature.type // "Feature"
layer.feature.geometry // {"type":"Polygon","coordinates":[[[-73,-7],[-73,-8]]]}
layer.feature.properties // {"field1":"value1","field2":"value2","ID":"1"}

例如，您可以这样做：

geojsonLayer.eachLayer(function (layer) {
  if (layer.feature.properties.ID === jsonObj.id) {
    for (var key in jsonObj) {
      layer.feature.properties[key] = jsonObj[key];
    }
  }
});

当然，您可以改进算法以缓存对Leaflet图层的引用，而不是必须每次循环 geojsonLayer 。

Of course you could then improve your algorithm to cache the references to your Leaflet layers, instead of having to loop through geojsonLayer every time.

这篇关于结合geojson和json为leaftlet的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！