vue引入mapbox

1.安装依赖
// 安装js插件
npm install --save mapbox-gl
// 安装语言包
npm install --save mapbox-gl @mapbox/mapbox-gl-language

2.引入依赖

//样式引入
import ‘mapbox-gl/dist/mapbox-gl.css’
// 引入语言包
import MapboxLanguage from “@mapbox/mapbox-gl-language”;
//定义变量使用
const mapboxgl = require(“mapbox-gl”);

3.使用

//设置token,token请自行前往mapbox官网获取
mapboxgl.accessToken =
“test”;

//初始化
map = new mapboxgl.Map({
container: “map”,//设置div容器的id
style: “mapbox://styles/mapbox/satellite-streets-v9”,
center: [80.93406310742923, 43.89852343165151],
zoom: 10,
});

//设置中文
map.addControl(
new MapboxLanguage({
defaultLanguage: “zh”,
})
);

4.结果