没有地图的 Mapbox 地理编码器

Question

如何在没有地图的情况下使用 Mapbox Geocoder？

当我删除地图代码时，自动完成文本字段消失了。

我试过的是（对我不起作用）：

    <div id="geocoder"></div>

    mapboxgl.accessToken = 'pk.eyJ1IjoiaGFzc2Fuc2FyZGFyYmFuZ2FzaCIsImEiOiJjazg3MHNldWowbGllM2hvMGloMGY0MXd0In0.baO5lzQ8q4al4T0rDAloQA';

    var geocoder = new MapboxGeocoder({
        accessToken: mapboxgl.accessToken,
        mapboxgl: mapboxgl
    });

    geocoder.on('select', function (data) {

        geocoder._toggle()
    })

    geocoder.on('result', function(result) {
       console.log(result);
    })

    document.getElementById('geocoder');

如何在不显示地图的情况下仅使用 Geocoder 自动完成功能？

这是我的作品fiddle:

https://jsfiddle.net/rv085oL1/

Answer 1

mapbox/mapbox-gl-geocoder here 的文档解释了如何在没有地图的情况下添加地理编码器。也就是说，你的 JSFiddle 中的 JavaScript 应该更新为：

var geocoder = new MapboxGeocoder({ accessToken: mapboxgl.accessToken });
geocoder.addTo('#geocoder');

此外，您需要将 mapbox-gl-geocoder 版本至少更新到 v4.5.0。这是集成了 addTo 方法的版本，如更新日志 here.

中所述