Google Maps - addGeoJson is not working for my file

Question

addGeoJson is not working in google map for my file

please check below code that I am using in javascript

//create the map
map = new google.maps.Map(document.getElementById('map-canvas'), {
   zoom: 6,
   center: {lat:49.79, lng: -8.82}
});

// Load GeoJSON.
var promise = $.getJSON("Sensitive_Areas_Nitrates_Rivers.json"); //same as map.data.loadGeoJson();
promise.then(function(data){
    cachedGeoJson = data; //save the geojson in case we want to update its values
    console.log(cachedGeoJson);
    map.data.addGeoJson(cachedGeoJson,{idPropertyName:"id"});  
});

I have downloaded this file from here

you can check my JSON file Sensitive_Areas_Nitrates_Rivers.json

also, you can check this link with polygon

I have used below JSON format so you can check it

{ "type": "FeatureCollection", "crs": { "type": "name", "properties": { "name": "EPSG:27700" } }, "features": [ { "type": "Feature", "id": 1, "geometry": { "type": "MultiLineString", "coordinates": [ [ [ 500051.6875, 224280.03130000085 ], [ 500047.2812999999, 224277.6875 ], [ 499977.5937999999, 224242.625 ], [ 499976.6875, 224242.21880000085 ] ] ] }, "properties": { "OBJECTID": 8, "type_of_sa": "SA_N", "datedesign": 1025136000000, "name": "Rivers Itchen", "length_km": 12, "uwwtd_code": "UKENRI134", "shape_Length": 12172.080443901654 } } ] }

[500051.6875, 224280.03130000085] - [X, Y] coordinates may be in EPSG: 27700 to EPSG:4326, Now we need to display these coordinates on google map, Is there any solution for this?

Vadim Gremyachev Vadim Gremyachev · Accepted Answer · 2020-01-02T16:02:00

Since Google Maps expects GeoJSON to be in EPSG:4326, Sensitive_Areas_Nitrates_Rivers.json needs to be reprojected. QGIS, for instance, could be utilized for that matter (refer docs for a details)

Reprojected Sensitive_Areas_Nitrates_Rivers.json layer will be displayed like this:

Google Maps - addGeoJson is not working for my file

2 Answers