Я получаю сообщение об ошибке: marker. js: 226 Uncaught (в обещании) TypeError: t.getCanvasContainer не является функцией в o.addTo (marker. js: 226) на панели мониторинга? Search =: 133
Ниже приведен мой код для маркера и Mapbox
const searchInput = document.querySelector("#search");
const submit = document.getElementById("search-form");
const coordinates = document.getElementById("coordinates");
const mapDiv = document.getElementById("map");
//
const displayMap = (longitude, latitude) => {
mapboxgl.accessToken = 'pk.eyJ1Ijoiam9ubnlwZWluIiwiYSI6ImNrN2c3aDFjZjA4OG4zZW8yZ3ozcjF4bWQifQ.8PT8uVs7CsaJU5PNDLZdHw';
const map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/mapbox/streets-v9',
center: [latitude, longitude],
zoom: 12
});
new mapboxgl.Marker()
.setLngLat([latitude, longitude])
.addTo(map);
};
displayMap(51.5074, 0.1278);
const fetchMap = (query) => {
fetch(`https://api.mapbox.com/geocoding/v5/mapbox.places/${query}.json?access_token=pk.eyJ1Ijoiam9ubnlwZWluIiwiYSI6ImNrN2c3aDFjZjA4OG4zZW8yZ3ozcjF4bWQifQ.8PT8uVs7CsaJU5PNDLZdHw`)
.then(response => response.json())
.then((data) => {
const long = data.features[0].geometry.coordinates[0];
const lat = data.features[0].geometry.coordinates[1];
new mapboxgl.Marker().setLngLat([long, lat]).addTo(map);
});
};
// Event Trigger
submit.addEventListener("submit", (event) => {
event.preventDefault();
const input = document.querySelector('.form-control');
fetchMap(input.value);
});
Любая помощь будет принята с благодарностью!