Карты Google, AdvancedMarkerElement не работаетJavascript

Форум по Javascript
Ответить
Anonymous
 Карты Google, AdvancedMarkerElement не работает

Сообщение Anonymous »

Довольно простой код. У меня есть новый облачный ключ Google. Я загружаю JavaScript асинхронно и жду его, но когда я пытаюсь создать один маркер, я получаю сообщение: «Эта страница не может правильно загрузить Карты Google.
HTML
»

Код: Выделить всё


Add junk Map







(g => { var h, a, k, p = "The Google Maps JavaScript API", c = "google", l = "importLibrary", q = "__ib__", m = document, b = window; b = b[c] || (b[c] = {}); var d = b.maps || (b.maps = {}), r = new Set, e = new URLSearchParams, u = () => h || (h = new Promise(async (f, n) => { await (a = m.createElement("script")); e.set("libraries", [...r] + ""); for (k in g) e.set(k.replace(/[A-Z]/g, t => "_" + t[0].toLowerCase()), g[k]); e.set("callback", c + ".maps." + q); a.src = `https://maps.${c}apis.com/maps/api/js?` + e; d[q] = f; a.onerror = () => h = n(Error(p + " could not load.")); a.nonce = m.querySelector("script[nonce]")?.nonce || ""; m.head.append(a) })); d[l] ? console.warn(p + " only loads once. Ignoring:", g) : d[l] = (f, ...n) => r.add(f) && u().then(() => d[l](f, ...n)) })({
key: "myKey",
});





JavaScript (через Typescript)

Код: Выделить всё

var gMap;
let center = { lat:29.134787, lng: -90.19385 };

window.onload = () => {
loadlibraries().then(function () { Dostuff(); });
};

async function loadlibraries(): Promise {
await google.maps.importLibrary("maps") as google.maps.MapsLibrary;
await google.maps.importLibrary("core") as google.maps.CoreLibrary;
await google.maps.importLibrary("marker") as google.maps.MarkerLibrary;
}

function Dostuff() {

gMap = new google.maps.Map(document.getElementById("map_canvas"));
gMapOptions = {
panControl: true,
zoomControl: false,
scaleControl: true,
scrollwheel: true,
streetViewControl: false,
minZoom: 2,
center: center,
zoom:8,
mapTypeControlOptions: {
mapTypeIds: [google.maps.MapTypeId.ROADMAP.toString(), google.maps.MapTypeId.SATELLITE.toString()],
position: google.maps.ControlPosition.BOTTOM_RIGHT
},
mapTypeId: google.maps.MapTypeId.ROADMAP

}
gMap.mapId = "DEMO_MAP_ID";
gMap.setOptions(gMapOptions);

// add a marker.
const marker = new google.maps.marker.AdvancedMarkerElement({
map: gMap,
position: center,
title: 'Center'
});
}
Настройка облака Google:
Изображение

отображение ошибки в консоли:
Изображение

Что отображается на сайте
Изображение


Подробнее здесь: https://stackoverflow.com/questions/798 ... ot-working
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Javascript»