加载 GeoJson Google API - CORS 政策

Question

I am trying to load some JSON with Google maps API.

https://developers.google.com/maps/documentation/javascript/datalayer

This is my code on fiddle:

https://jsfiddle.net/simonrenauld/3z7peqdv/6/

<script src="https://storage.cloud.google.com/jsontestdemp/testdata.jsonp"></script>

I have tried to load as geojsonp like in the documentation

I am still not able to load into my map. What's the easy solution here to avoid the CORS policy?

Answer 1

As per Google's documentation :

Note: In order to load a json file from another domain, that domain must have enabled Cross-origin resource sharing .

Otherwise, load it from the same domain. Eg check out this working codesandbox that loads Google's GeoJSON sample from a file ( myjson.json ) located at the same root-level as index.html .

var map;
function initMap() {
    map = new google.maps.Map(document.getElementById("map"), {
        zoom: 4,
        center: { lat: -28, lng: 137 }
    });

    map.data.loadGeoJson("myjson.json");
}

Hope this helps!