Быстрое предварительное примечание: я не веб-разработчик, но я работаю над веб-сайтом для проверки концепции, в то время как я разыскиваю гранты, чтобы платить кому-то еще за то, что я правильно сделал свою работу, так что обходные пути в порядке. Это никогда не будет общедоступной версией сайта.
Сайт построен на WordPress и должен вызвать API Google Maps для отображения файлов кмл для некоторых страниц. Пример страницы здесь: http://35.189.56.28/index.php/project-details/?project=ERF101548. Я использовал код отсюда: https://developers.google.com/maps/documentation/javascript/examples/layer-kml
Раньше я тратил около трех дней, чтобы заставить это работать. Я обнаружил, что мне нужно поместить половину javascript внутри тегов head (сценарий для вызова файла KML) и часть в теле (часть для рисования карты). работал отлично.
Сегодня, не задумываясь, я обновил тему, которую использует сайт, и (конечно) при этом переписал свой собственный header.php. Это означает, что рабочий код API Google Maps теперь потерян. И я не могу вспомнить, как у меня это получилось в итоге.
Мне удалось правильно сформулировать свой php, потому что в голову входит следующее:
<style>
#map {
height: 100%;
}
</style>
<script>
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 11,
center: {lat: 41.876, lng: -87.624}
});
var ctaLayer = new google.maps.KmlLayer({
url: 'https://storage.googleapis.com/erfmonitor/erf_kml/ERF101548.kml',
map: map
});
}
</script>
Сценарий в теле не изменился по сравнению с тем, что было раньше, но для справки:
<div id="map"></div>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB-zp5Xlxyc3BIUxoR7zejWG1z5WpnaLQ8&callback=initMap"></script>
Может ли кто-нибудь помочь мне с возможными решениями? Кажется, правильный javascript есть, но он не выполняется. Это та же проблема, что и у меня в прошлый раз, но я не могу вспомнить, как я ее исправил.
Та.