Geek Answers Handbook

How to pass geojson array to datamable dyanamically using javascript

I want to transfer a single geojson file for a dynamically created datatable using javascript, I cannot identify the column names in the file. I have tried this.

My code is

<body> <table id="example" class="display" cellspacing="0" width="100%"> <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" } ] }); });

and geojson file

  { "type": "FeatureCollection", "features": [ { "type": "Feature", "properties": {}, "geometry": { "type": "LineString", "coordinates": [ [ 40.078125, 57.136239319177434 ], [ 91.7578125, 58.99531118795094 ] ] } } ] }

My conclusion is shown in the figure.

+8
javascript jquery html datatable geojson
source share
1 answer

The problem may be that GeoJSON is not an array, but an object.

Try changing the column definitions in the following ways:

 "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" } ]
0
source share

More articles:


All Articles