mapbox 初始化、切换语言

初始化项目

npm install --save mapbox-gl

import mapboxGl from 'mapbox-gl'
mapboxGl.accessToken = 'your accessToken'

const map = new mapboxgl.Map({
    container: '<your HTML element id>',
    zoom: 14,
    style: 'mapbox://styles/mapbox/streets-v11'
});

经过以上步骤就可以看到地图了，前提是要去官网申请accessToken：点击去申请页面。

切换语言

npm i --save @mapbox/mapbox-gl-language

import MapboxLanguage from '@mapbox/mapbox-gl-language'
mapboxGl.setRTLTextPlugin('https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js')


// 设置语言
map.addControl(new MapboxLanguage({
   defaultLanguage: 'zh-Hans' // 这里是要设置的语言
}))

经过测试：

可以支持进行切换得样式：

街道地图：mapbox://styles/mapbox/streets-v11

卫星地图：mapbox://styles/mapbox/satellite-streets-v11

完成就可以切换语言了，点击查看语言插件文档。

记录进步！！！

__EOF__

本文作者：沧澜野兽迈特丶凯
本文链接：https://www.cnblogs.com/sxdjy/p/15923882.html
关于博主：评论和私信会在第一时间回复。或者直接私信我。
版权声明：本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！
声援博主：如果您觉得文章对您有帮助，可以点击文章右下角【推荐】一下。您的鼓励是博主的最大动力！