循环遍历JSON对象和将它们转换为数组

我试图建立使用leaflet.js和leaflet.heat从数据热图我在JSON格式。到目前为止，我已经能够使用jQuery的getJSON获取并解析我的JSON文件，但是我被卡在了循环遍历文件并返回数组leaflet.heat需要在传单顶部构建heatmap图层的部分。循环遍历JSON对象和将它们转换为数组

根据leaflet.heat的文档，我需要传递给库是像这样构成的阵列：

[latitude, longitude, intensity]

我的JSON是这样的：

[{"Lat":"39.51","Long":"-76.164","Intensity":"0.0017980221756068300"}, 
{"Lat":"39.463","Long":"-76.12","Intensity":"0.0332634102487264000"}, 
...more data...]

这里是我的代码：

$.getJSON('data.json', 
    function(data){ 
     var heat = L.heatLayer(data, {radius: 25}).addTo(map); 
    }); 
});

当我运行这个，我得到以下错误：

TypeError: null is not an object (evaluating 't.lat')

我假定这是从传递JSON 对象所得当库需要阵列无钥匙。我已经看了this similar SO question，但是当我记录输出到控制台使用此代码，

var arr = $.map(data, function(el) { return el }); 
console.log(arr);

...它仍带有按键的对象输出。不知道我做错了什么。

来源

2017-08-08 Andrew Carnes

' “纬度” == “LAT”'。 –

你试图构建的数组当然必须是2d以包含多个经纬度的热量数据？ –

，因为你没有改变它....你只是在你的地图中返回相同的东西。 – epascarello

我觉得应该做的伎俩：

var arr = data.map(function(el) { 
    return [+el.Lat, +el.Long, +el.Intensity]; 
});

map为您提供了一个阵列中的每个元素在一个时间，让你改变它。

每个元素看起来像{"Lat":"39.51","Long":"-76.164","Intensity":"0.0017980221756068300"}，并且您想要将它转换为类似[39.51, -76.164, 0.0017980221756068300]的东西。您可以使用.Lat，.Long和.Intensity让每个这些值，和前面+值从字符串到数字转换。

来源

2017-08-08 14:04:38 smarx

可能需要从字符串中强制编号也 – charlietfl

啊，好点。编辑。 – smarx

注意，'$ .MAP（）'将会把所有的值与该代码的单个阵列：https://jsfiddle.net/h1pf4dwf/。如果你想要一个二维数组，你需要双重包装输出，例如。 '[[+ el.Lat ...]]'：https://jsfiddle.net/h1pf4dwf/1/。另外，您可以使用原生'图（）'功能，完全避免了问题：https://jsfiddle.net/h1pf4dwf/2/ –

-1

你其实并不需要手动解析它。现代浏览器支持JSON反序列化：

var json_string = file.read("filename"); 
var json_to_array = JSON.parse(json_string);

来源

2017-08-08 14:12:12

循环遍历JSON对象和将它们转换为数组

回答

相关问题