如何使用javascript动态地将json数组传递给数据表
Posted
技术标签:
【中文标题】如何使用javascript动态地将json数组传递给数据表【英文标题】：How to Pass geojson array to datatable dyanamically using javascript 【发布时间】：2016-10-09 20:17:11 【问题描述】：我想将一个 geojson 文件传递给使用 javascript 动态创建的数据表，我无法识别文件中的列名.. 这个我试过了。。
代码
<body>
<table id="example" class="display" cellspacing="0" >
<thead>
<tr>
<th>fC.type</th>
<th>f.type</th>
<th>f.prop</th>
<th>f.geom.type</th>
<th>geometry.coordinates.0</th>
<th>geometry.coordinates.1</th>
</tr>
</thead>
</table>
</body>
$(document).ready(function ()
$('#example').dataTable(
"ajax": "data/json_file.json",
"processing": true,
"columns": [
"mData": "type" ,
"mData": "features.type" ,
"mData": "features.properties" ,
"mData": "geometry.type" ,
"mData": "geometry.coordinates.0" ,
"mData": "geometry.coordinates.1"
]
);
);
geojson 文件
"type": "FeatureCollection",
"features": [
"type": "Feature",
"properties": ,
"geometry":
"type": "LineString",
"coordinates": [
[
40.078125,
57.136239319177434
],
[
91.7578125,
58.99531118795094
]
]
]
My output is as shown in image
【问题讨论】：
【参考方案1】：问题实际上是数据文件，它是有效的 JSON，但不是数据表所需的结构。
解决方案 1：将文件更改为预期的结构。
"data": [
"type": "FeatureCollection",
"features": [
"type": "Feature",
"properties": ,
"geometry":
"type": "LineString",
"coordinates": [
[
40.078125,
57.136239319177434
],
[
91.7578125,
58.99531118795094
]
]
]
]
解决方案2：使用dataSrc可以在datatable使用之前修改ajax响应。
$('#example').dataTable(
"ajax":
"url": "json1.json",
"dataSrc": function (json)
var obj = [];
obj.data = [];
obj.data[0] = json;
return obj.data;
,
,
"processing": "true",
"columns": [
"data": "type" ,
"data": "features.0.type" ,
"data": "features.0.properties" ,
"data": "features.0.geometry.type" ,
"data": "features.0.geometry.coordinates.0" ,
"data": "features.0.geometry.coordinates.1"
]
);
这里我所做的是创建了一个新对象 obj。 在这里工作小提琴：https://jsfiddle.net/ourqh9ts/
【讨论】：
【参考方案2】：问题可能在于 GeoJSON 不是一个数组而是一个对象。
尝试使用这些更改列定义：
"columns": [
"data": "type" ,
"data": "features.0.type" ,
"data": "features.0.properties" ,
"data": "features.0.geometry.type" ,
"data": "features.0.geometry.coordinates.0" ,
"data": "features.0.geometry.coordinates.1"
]
【讨论】：
我试过这个，我得到一个错误，“未捕获的类型错误：无法读取未定义的属性'长度'”。以上是关于如何使用javascript动态地将json数组传递给数据表的主要内容，如果未能解决你的问题，请参考以下文章
iOS Swift 如何从 UIWebView 将 JSON 字符串和数组或字典传递给 Javascript？
javascript中如何传个数组到后台String [ ] 接收？