很多时候，我们在使用地图的时候，用的并不是mapbox提供的底图，而是我们自己的数据。
这里以Geojson（json）数据为例。
STEP 1 （数据定义）
将自己的数据加载，同时赋予名称。
import CHINAMAP from '@/assets/mapdata/china.json'
STEP 2 （创建空地图容器）
既然是使用mapbox，那么首先需要创建一个地图容器，但是由于我们不使用mapbox底图，因此，与普通创建mapbox地图的区别在于style，这一参数的定义。
（其余配置参考系列文章一）
var map = new this.$mapboxgl.Map({container: "map",style: {version: 8,sources: {},layers: [{id: "background",type: "background",layout: {},paint: {"background-color": ["interpolate",["linear"],["zoom"],5,"hsl(38, 43%, 89%)",7,"hsl(38, 48%, 86%)",],},},],},zoom: 5,center: [109, 38],});
STEP 3 （加载数据）
mapbox中加载资源所使用，map.on(){'load',}函数。
首先加载资源，再加载图层，即可。
map.on('load',function(){map.addSource('states', {'type': 'geojson','data': CHINAMAP});map.addLayer({'id': 'china_map','type': 'fill','source': 'states','paint': {'fill-color':'#0080ff','fill-outline-color': '#4f4f4f','fill-opacity':['case',['boolean', ['feature-state', 'hover'], false],1,0.8]}});})
结果展示：
