使用Geocoder时收到错误this._mapboxgl.Marker不是构造函数

时间:2019-08-12 20:28:28

标签: mapbox-gl-js mapbox-marker

我已经有了一个相当基本的设置来测试Geocode搜索功能,但是只要搜索完成,我都会收到此错误。

我已经检查了我的版本号,据我所知它们是最新的。我已经将它们捆绑在一起以测试不同的版本。

https://api.mapbox.com/mapbox-gl-js/v1.2.0/mapbox-gl.js

https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-geocoder/v4.4.1/mapbox-gl-geocoder.min.js

import Mapbox from 'mapbox-gl';
import Geocoder from 'mapbox-gl-geocoder';

Mapbox.accessToken = 'pk.mytokenishere';
  let map = new Mapbox.Map({
  container: 'map',
  style: 'mapbox://styles/mapbox/streets-v11',
  center: {lon: -113.8116, lat: 52.26682},
  zoom: 4
  });

  var geocoder = new Geocoder({
    accessToken: Mapbox.accessToken,
    mapboxgl: map,
    marker: {
      color: 'orange'
      },
    }); 
  document.getElementById('geocoder').appendChild(geocoder.onAdd(map));

我得到的不是橙色标记,而是_mapboxgl。标记不是构造函数

1 个答案:

答案 0 :(得分:1)

我能够自己弄清楚。地理编码器期望Mapbox类本身而不是实例。上面的代码应更改为:

var geocoder = new Geocoder({
  accessToken: Mapbox.accessToken,
  mapboxgl: Mapbox,
  marker: {
    color: 'orange'
    },
});