Попытка изменить положение моего маркера на Mapbox GL js - PullRequest
Новая
       64

Попытка изменить положение моего маркера на Mapbox GL js

0 голосов
/ 11 марта 2020

Я получаю сообщение об ошибке: 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);
    });

Любая помощь будет принята с благодарностью!

...