Plotten geojson Punkte in html

Ich erstelle eine Webkarte ähnlich dem Beispiel hier example, aber mit meinen Daten.Plotten geojson Punkte in html

Meine GeoJSON Punkte nicht wie die Beispiele zeigen werden, hier ist was wie meine GeoJSON Datei points.geojson aussieht:

{ 
"type": "FeatureCollection", 
"crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } }, 
"features": [ 
{ "type": "Feature", "properties": { "RENTAL_ID": 146057249, "CUSTOMER_I": 2256099, "LOCATION": "Boston", "VEHICLE_VI": "FHB 1675", "START_DATE": "2017\/03\/1 00:03:00", "END_DATE_L": "2017\/03\/1 00:10:00", "END_LATITU": 30.22478, "END_LONGIT": -97.72464, "DISTANCE": 5, "DURATION": 7, "DURATION_P": 0, "DURATION_D": 7, "SERVICE_DR": 0, "VEHICLE_TY": "HW 2.0" }, "geometry": { "type": "Point", "coordinates": [ 42.355672, -71.058712 ] } }, 
{ "type": "Feature", "properties": { "RENTAL_ID": 146057187, "CUSTOMER_I": 2435897, "LOCATION": "Boston", "VEHICLE_VI": "JHD 8492", "START_DATE": "2017\/03\/1 00:00:00", "END_DATE_L": "2017\/03\/1 00:19:00", "END_LATITU": 30.25766855, "END_LONGIT": -97.7383573, "DISTANCE": 13, "DURATION": 19, "DURATION_P": 0, "DURATION_D": 19, "SERVICE_DR": 0, "VEHICLE_TY": "B Class" }, "geometry": { "type": "Point", "coordinates": [ 42.361507, -71.090126 ] } } 
] 
}

Und hier ist mein Code, den ich geschrieben habe:

<html> 
<head> 
    <title>A Leaflet map!</title> 
    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css"/> 
    <script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script> 
    <script src="jquery-2.1.1.min.js"></script> 
    <style> 
     #map{ height: 100% } 
    </style> 
</head> 
<body> 

    <div id="map"></div> 

    <script> 

    // initialize the map 
    var map = L.map('map').setView([42.35, -71.09], 13); 

    // load a tile layer 
    L.tileLayer('http://tiles.mapc.org/basemap/{z}/{x}/{y}.png', 
    { 
     attribution: 'Tiles by <a href="http://mapc.org">MAPC</a>, Data by <a href="http://mass.gov/mgis">MassGIS</a>', 
     maxZoom: 100, 
     minZoom: 9 
    }).addTo(map); 

    // load GeoJSON from an external file 
    $.getJSON("point.geojson",function(data){ 
    // add GeoJSON layer to the map once the file is loaded 
     L.geoJson(data).addTo(map); 
    }); 

    </script> 
</body> 
</html>

Warum werden meine Punkte nicht angezeigt?

Quelle

2017-05-09 Michael McKeever

Ich würde sagen, dass Ihre Punkte erscheinen, aber nicht dort, wo Sie sie erwarten.

Das GeoJSON-Format erwartet Koordinaten in der Reihenfolge [longitude, latitude]. Leaflet kehrt diese Reihenfolge intern um, da [latitude, longitude] verwendet wird.

Sie müssen jedoch noch eine GeoJSON-konforme Daten einspeisen.

Quelle

2017-05-10 01:03:18 ghybs

danke für die koordinatenerklärung, also meinst du mit "GeoJSON compliant" daten durch umkehren der koordinaten oder was? –

ja, umkehren Sie Ihre Koordinaten. – ghybs

DANKE! Das war das Problem und lief es durch Chrome, also habe ich den Browser auf Foxfire umgestellt und die Koordinaten umgekehrt, danke nochmal! –

Plotten geojson Punkte in html

Antwort

Verwandte Themen