Google map import geojson

Question

Я пытаюсь сделать карту google с маркерами на ней. Должно быть очень простой задачей. Тем не менее, он продолжает бросать мне ошибки: «не могу прочитать свойство addGeoJson« неопределенного »или« не может прочитать свойство loadGeoJson »неопределенного». Кто-нибудь может помочь мне понять, почему? Спасибо огромное!

Я пробовал много разных способов импортировать данные. (Данные ссылка на файл GeoJSON Файл GeoJSON проверяется Ниже использование map.json как spaceholder..):

var add_data = $.getJSON("map.json"); 
    add_data.then(function(data){ 
    cachedGeoJson = data; 
    console.log(cachedGeoJson); 
    map.data.addGeoJson(cachedGeoJson,{idPropertyName:"id"}); 
    }); 

or: 
map.data.loadGeoJson('map.json'); 

or: 
var script = document.createElement('script'); 
script.src = 'map.json'; 
document.getElementsByTagName('head')[0].appendChild(script); 
function eqfeed_callback(results) { 
map.data.addGeoJson(results); 
} 

Answer 1

The documentated метод:

map.data.loadGeoJson('https://storage.googleapis.com/maps-devrel/google.json'); 

Это работает для меня.

working fiddle

фрагмент кода:

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

 
    // NOTE: This uses cross-domain XHR, and may not work on older browsers. 
 
    map.data.loadGeoJson('https://storage.googleapis.com/maps-devrel/google.json'); 
 
} 
 

 
google.maps.event.addDomListener(window, 'load', initMap);

html, 
 
body, 
 
#map { 
 
    height: 100%; 
 
    margin: 0px; 
 
    padding: 0px; 
 
    width: 100%; 
 
}

<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<div id="map"></div>