geojson-Datei einlesen und einer Variable zuweisen

Ich versuche mich per leaflet.Elevation und möchte Routen darstellen.

Hier weise ich der Variablen “route” die geojson zu. Das klappt.



var route = {
"type": "FeatureCollection",
"crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } },
                                                                                
"features": [
{ "type": "Feature", "properties": { }, "geometry": { "type": "LineString", "coordinates": [ [ 8.023832399999987, 49.270580399999965 ], [ 8.024321199999989, 49.270373399999976 ], [ 8.0244547, 49.2703166 ], [ 8.0245801, 49.270204 ], [ 8.0247885, 49.270086299999981 ], [ 8.025155899999987, 49.2699377 ], [ 8.0259489, 49.2695827 ], [ 8.0267242, 49.2691823 ], [ 8.0271222, 49.268825299999953 ], [ 8.0273064, 49.268358799999973 ], [ 8.0274012, 49.2679948] ] } }
]
}

;


var el = L.control.elevation();
		el.addTo(map);
		var gjl = L.geoJson(route,{
		    onEachFeature: el.addData.bind(el)
		}).addTo(map);


Wie kann ich nun eine geojson-Datei einlesen per: bspw. $.getJSON(“ordner1/route2.geojson”, function(json){};
und das der Variablen “route” zuweisen?

Gut möglich, dass die Zeile falsch ist. Einlesen möchte ich per jQuery $.getJSON.

Verständlich?

Hast du dir das leaflet.elevation Beispiel mal genauer angeschaut? Weiß gerade nicht, warum du es mit jQuery einlesen möchtest. Entweder würde ich den pure javascript Befehl require nehmen, oder da du ja leaflet nutzt den geojson Loader von leaflet, siehe leaflet Doku :wink:

Wenn du aus Gründen jQuery verwendest, sollte das so gehen:


var el = L.control.elevation();
el.addTo(map);

var route = {};
var gjl = {};

$.getJSON("ordner1/route2.geojson", function(json) {
  route = json;
  gjl = L.geoJson(route, {
    onEachFeature: el.addData.bind(el)
  }).addTo(map);
});

Wobei die Variable “route” in obigem Beispiel nicht benötigt würde, hier könnte man direkt “json” verwenden.

Gruß, Frank

(Wie immer: Ungetestet und ohne Gewehr)

An anderer Stelle nutz ich schon jquery, daher war es für mich der erste Schritt es auch damit zu versuchen.

Ich mach mal weiter (wird dauern :roll_eyes:), danke ich beiden.

Ok. Dann sei z.B. auf load json into variable verwiesen. Wichtig ist halt zu wissen, dass jQuery.getJSON standardmäßig asynchron arbeitet, aber wie man das umschifft, siehe Link.

Auch das von mir vorgeschlagene “require” hat so seine Vor- und Nachteile, z.B. lädt es die Datei pro Browser Instanz nur ein einziges mal und verfrachtet den Inhalt in den Cache.

Ohoh, anscheinend habe ich da jahrelang etwas falsch gemacht. Das

wusste ich nämlich nicht.

Im Ernst: Besser, man schaut sich die Doku http://api.jquery.com/jquery.ajax/ an (insbesondere den Abschnitt unter “async”) und versteht grundsätzlich, wann wo welche Javascript-Variablen sichtbar sind https://www.w3schools.com/js/js_scope.asp.

Gruß, Frank

PS: Falls nicht bekannt, .getJSON ist nur ein Wrapper für .ajax