0

I'm trying to read a .geoJson file that will add some points to a map. my data file lookes like this: 

{
"type": "FeatureCollection",
"crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } },
"features": [
{ "type": "Feature", "properties": { "start": "1970", "end": "1972" },"geometry": { "type": "Point", "coordinates": [ 11.924550479340329, 55.94619451008279 ] } },
{ "type": "Feature", "properties": { "start": "1975", "end": "1976" }, "geometry": { "type": "Point", "coordinates": [ 12.06219628503271, 55.909617190392566 ] } }, { "type": "Feature", "properties": { "start": "1979", "end": "1980" }, "geometry": { "type": "Point", "coordinates": [ 12.06219628503271, 55.909617190392566 ] } },
{ "type": "Feature", "properties": { "start": "1980", "end": "1985" }, "geometry": { "type": "Point", "coordinates": [ 12.284822339303718, 55.639778377234506 ] } }
]
};

so this is the data.geojson.

as you can see there are start date and end date and i need to use this to put it in a timeline else i would just have used addTo(map) and all the points will be there.

but my code to call my file is: 

var points = null;
$.getJSON("data.geojson", function(data) {
points = L.geoJson(data);
});

to try and test if the code works I did a "points.addTo(map);" and it all went blank on my screen, I'm sure my data works because when i write the code like this: 

$.getJSON("data.geojson", function(data) {
points = L.geoJson(data).addTo(map);
});

I can see all the points. But by doing this I can't use my data for the right purpose. Hope some one can help me with this problem.

JessieQuick
  • 51
  • 8
  • In your first example, how and when are you calling `addTo(map)`? This feels like an async issue. – Jason P Dec 06 '16 at 19:17
  • in the first one i need the points for something later where i add it to map like `var pointsToTimeline = L.timeline(points);` `pointsToTimeline.addTo(map) ;` but this do not work – JessieQuick Dec 06 '16 at 19:21
  • This might be the issue.. can't tell without an MVCE: http://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call/14220323#14220323 – Jason P Dec 06 '16 at 19:22

1 Answers1

0

I fixed this by using d3.json to import my data and use it for the purpose i wanted, and it turned out to be the async problem. By inporting the d3 loading option:

d3.select(window).on("load", init)

And then use this code to load the file:

d3.json("data.geojson", function(data) { console.log(data); console.log(data[0]); points = data;

And then all my coordinats got linked to the timeline.

JessieQuick
  • 51
  • 8