安装
首先，openlayers库已经废弃，开始改用ol库了
cnpm install ol
添加地图
在methods中添加地图初始化initMap()方法
import Map from "ol/Map";
import View from "ol/View";
import TileLayer from "ol/layer/Tile";
import XYZ from "ol/source/XYZ";
import 'ol/ol.css'
...
methods:{
...
initMap() {
let center = proj.transformExtent([103.3, 35.5], "EPSG:4326", "EPSG:3857");
new Map({
target: "map",
layers: [
new TileLayer({
source: new XYZ({
url: "http://t2.tianditu.com/DataServer?T=vec_w&x={x}&y={y}&l={z}"
})
}),
new TileLayer({
source: new XYZ({
url: "http://t2.tianditu.com/DataServer?T=cva_w&x={x}&y={y}&l={z}"
}),
isGroup: true,
name: "天地图文字标注"
})
],
view: new View({
center: [103.3, 35.5],
zoom: 4
})
});
}
...
}
