mapbox在vue中的应用

1.在vue中加入mapbox

cnpm install mapbox-gl

2.如何使用自定义的style、字体及精灵图片

将字体及精灵图片放到public文件夹下

在src下定义style.js

//精灵图片地址
let url = location.host,

    basepath = 'http://' + url;

let sprite = basepath + (process.env.NODE_ENV == 'development' ? '/mapbox-gl/sprite/sprite' : '/dist/mapbox-gl/sprite/sprite'),
    // 字体资源地址
glyphs = basepath + (process.env.NODE_ENV == 'development' ? '/mapbox-gl/font/{fontstack}/{range}.pbf' : '/dist/mapbox-gl/font/{fontstack}/{range}.pbf');

NODE_ENV不是process.env对象上原有的属性，它是我们自己添加上去的一个环境变量，用来确定当前所处的开发阶段。一般生产阶段设为production，开发阶段设为develop，然后在脚本中读取process.env.NODE_ENV。

3.在mapbox.vue中引入自定义的style文件