<template>
|
<div class="viewer-box" id="viewer-container">
|
<slot ref="mainContent" name="mainContent"></slot>
|
</div>
|
</template>
|
|
<script>
|
var siteEntitylayers = null
|
let layersObjcect = {
|
housingEstateLayer: null,
|
}
|
export default {
|
name: 'mapBox',
|
|
data() {
|
return {}
|
},
|
|
mounted() {
|
if (global.viewer != null) {
|
global.viewer = null
|
}
|
|
const that = this
|
|
// 初始化地图
|
function initViewer() {
|
global.DC.Namespace.Cesium.Ion.defaultAccessToken =
|
'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIyZWQyZWYwNC02OGI2LTQ1MGUtYTQ2MC01OTExYTcwOThkNDIiLCJpZCI6NjgzMzgsImlhdCI6MTYzMjQ2Nzc3OX0.zwUn5xW9KMVQrTmWNUlf5TMztNIAJkStN3eCnaJGj4w'
|
global.viewer = new global.DC.Viewer('viewer-container')
|
let baseLayer = new DC.ImageryLayerFactory.createAmapImageryLayer({
|
animation: false, //动画
|
baseLayerPicker: false, //图层选择控件
|
timeline: false, //时间轴
|
sceneModePicker: false,
|
fullscreenButton: false, //全屏显示
|
infoBox: true, //点击要素之后浮窗
|
navigationInstructionsInitiallyVisible: true, //导航指令
|
navigationHelpButton: false, //帮助信息
|
selectionIndicator: true, // 选择
|
terrainProvider: new global.DC.Namespace.Cesium.CesiumTerrainProvider({
|
url: global.DC.Namespace.Cesium.IonResource.fromAssetId(3956),
|
}),
|
})
|
global.viewer.addBaseLayer(baseLayer)
|
global.DC.Namespace.Cesium.Camera.DEFAULT_VIEW_RECTANGLE = global.DC.Namespace.Cesium.Rectangle.fromDegrees(100.15, 31.54, 112.25, 43.56)
|
// global.viewer.setPitchRange(-90, -45)
|
|
// global.viewer.scene.globe.depthTestAgainstTerrain = false
|
|
|
// var cesiumAsset = 'jw1WHkf6s0LAwkAYL1nELtO1pKNcaVQSpHISib9geQI6c1ACcc0gEnEkcsc5a5I5'
|
// var tiandituTk = 'bfedb24d63d0cfa0db00fcd2d379abe7'
|
// // // 服务负载子域
|
// var subdomains = ['0', '1', '2', '3', '4', '5', '6', '7']
|
// global.DC.Namespace.Cesium.Ion.defaultAccessToken = cesiumAsset
|
//
|
// global.viewer.imageryLayers.addImageryProvider(new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
|
// //影像注记
|
// url:'http://t{s}.tianditu.com/cia_w/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=cia&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&style=default.jpg&tk=' +
|
// tiandituTk,
|
// subdomains: subdomains,
|
// layer: 'tdtCiaLayer',
|
// style: 'default',
|
// format: 'image/jpeg',
|
// tileMatrixSetID: 'GoogleMapsCompatible',
|
// show: true,
|
// transparent: true,
|
// }))
|
//
|
global.viewer.imageryLayers.addImageryProvider(new global.DC.Namespace.Cesium.WebMapServiceImageryProvider({
|
//影像注记
|
url: 'http://39.107.109.193:8105/geoserver/Map/wms',
|
layers: 'yanmo',
|
parameters: {
|
version: "1.1.1",
|
layers: 'yanmo1',
|
service: 'WMS',
|
format: 'image/png',
|
opacity: '0.2',
|
transparent: true,
|
},
|
}))
|
|
// 去除logo
|
let primitiveArr = global.viewer.scene.primitives._primitives
|
global.viewer.scene.primitives.remove(primitiveArr[0])
|
|
// 已声明的图层添加到地图上
|
siteEntitylayers = new global.DC.VectorLayer('siteEntitylayers')
|
global.viewer.addLayer(siteEntitylayers)
|
|
// 图层加入地图
|
layersObjcect.housingEstateLayer = new global.DC.VectorLayer('housingEstateLayer')
|
global.viewer.addLayer(layersObjcect.housingEstateLayer)
|
|
|
// 判断是否支持图像渲染像素化处理
|
if (global.DC.Namespace.Cesium.FeatureDetection.supportsImageRenderingPixelated()) {
|
global.viewer.setOptions({
|
resolutionScale: window.devicePixelRatio
|
})
|
}
|
|
// 设置地图初始位置，角度等
|
global.viewer.camera.setView({
|
// Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
|
// fromDegrees()方法，将经纬度和高程转换为世界坐标
|
destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
|
108.55125, 38.3227, 5500000
|
),
|
orientation: {
|
// 指向
|
heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
|
// 视角
|
pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
|
roll: 0.0
|
}
|
})
|
|
global.viewer.use(new global.DC.Measure())
|
global.viewer.zoomController.enable = true
|
}
|
|
global.DC.ready(initViewer)
|
},
|
|
methods: {}
|
|
}
|
</script>
|
|
<style lang="scss" scope>
|
.viewer-box {
|
position: relative;
|
width: 100%;
|
height: 100%;
|
}
|
</style>
|
