import * as mars3d from "mars3d"
|
|
export let map // mars3d.Map三维地图对象
|
|
// 需要覆盖config.json中地图属性参数（当前示例框架中自动处理合并）
|
export const mapOptions = {
|
scene: {
|
center: { lat: 31.841977, lng: 117.141788, alt: 1043, heading: 90, pitch: -51 },
|
fxaa: true,
|
baseLayerPicker: false,
|
sceneModePicker: false
|
},
|
layers: [
|
{
|
type: "geojson",
|
name: "示例数据",
|
url: "//data.mars3d.cn/file/geojson/mars3d-draw.json",
|
popup: "{type} {name}",
|
show: true
|
},
|
{
|
type: "3dtiles",
|
name: "测试模型",
|
url: "//data.mars3d.cn/3dtiles/bim-daxue/tileset.json",
|
position: { lng: 116.313536, lat: 31.217297, alt: 80 },
|
scale: 100,
|
show: true
|
}
|
]
|
}
|
|
/**
|
* 初始化地图业务，生命周期钩子函数（必须）
|
* 框架在地图初始化完成后自动调用该函数
|
* @param {mars3d.Map} mapInstance 地图对象
|
* @returns {void} 无
|
*/
|
export function onMounted(mapInstance) {
|
map = mapInstance // 记录map
|
|
// 修改3d地图的样式
|
const dom3d = document.getElementById("centerDiv3D")
|
dom3d.style.left = "50%"
|
dom3d.style.width = "50%"
|
|
// 创建2d地图
|
const mapDiv = mars3d.DomUtil.create("div", "", document.body)
|
mapDiv.setAttribute("id", "centerDiv2D")
|
mapDiv.style.width = "50%"
|
|
const map2ds = mars3d.DomUtil.create("div", "", mapDiv)
|
map2ds.setAttribute("id", "map2d")
|
map2ds.setAttribute("class", "mars2d-container")
|
|
const tileWorldImagery = new ol.layer.Tile({
|
source: new ol.source.XYZ({
|
url: "https://webrd01.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}",
|
crossOrigin: "Anonymous"
|
})
|
})
|
|
const map2d = new ol.Map({
|
target: "map2d",
|
projection: "EPSG:3857",
|
layers: [tileWorldImagery],
|
|
view: new ol.View({
|
center: ol.proj.fromLonLat([134.364805, 26.710497]),
|
zoom: 4,
|
minZoom: 2
|
})
|
})
|
|
// 联动控制器
|
const ol3d = new olcs.OLCesium({ map: map2d, viewer: map.viewer })
|
}
|
|
/**
|
* 释放当前地图业务的生命周期函数
|
* @returns {void} 无
|
*/
|
export function onUnmounted() {
|
map = null
|
}
|
