| | |
| | | butbut: null, |
| | | heights: 0, |
| | | heights1: 0, |
| | | DC: '', |
| | | bigPopup: { |
| | | width: 0, |
| | | height: 0 |
| | |
| | | }, |
| | | mounted () { |
| | | // return; |
| | | var DC = global.DC |
| | | this.DC = DC |
| | | |
| | | var that = this |
| | | |
| | | let viewer |
| | |
| | | } |
| | | |
| | | function initViewer () { |
| | | viewer = new DC.Viewer('mobile-viewer-container', { |
| | | viewer = new global.DC.Viewer('mobile-viewer-container', { |
| | | contextOptions: { |
| | | webgl: { |
| | | stencil: true, |
| | |
| | | // const baselayer = DC.ImageryLayerFactory.createArcGisImageryLayer({ |
| | | // url: "http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer", |
| | | // }); |
| | | const baselayer = that.DC.ImageryLayerFactory.createImageryLayer( |
| | | that.DC.ImageryType.XYZ, |
| | | const baselayer = global.DC.ImageryLayerFactory.createImageryLayer( |
| | | global.DC.ImageryType.XYZ, |
| | | { |
| | | // url: 'https://webmap-tile.sf-express.com/MapTileService/rt?x={col}&y={row}&z={level}' |
| | | |
| | |
| | | // }); |
| | | |
| | | // 地图移动事件 |
| | | viewer.on(DC.MouseEventType.MOUSE_MOVE, (e) => { |
| | | viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => { |
| | | if (!that.iconHide) { |
| | | that.$store.commit('MSET_ICONHIDE', true) |
| | | } |
| | |
| | | // console.log(height); |
| | | }) |
| | | |
| | | // viewer.on(that.DC.SceneEventType.CAMERA_MOVE_END, (e) => { |
| | | viewer.on(that.DC.SceneEventType.CAMERA_CHANGED, (e) => { |
| | | // viewer.on(global.DC.SceneEventType.CAMERA_MOVE_END, (e) => { |
| | | viewer.on(global.DC.SceneEventType.CAMERA_CHANGED, (e) => { |
| | | // 相机移动最后参数 |
| | | // 控制高度 |
| | | const isSet = that.dimension != '3D' |
| | | const height = Math.ceil(viewer.camera.positionCartographic.height) |
| | | const conBack = (height) => { |
| | | viewer.camera.setView({ |
| | | destination: that.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | viewer.camera.positionCartographic.longitude, |
| | | viewer.camera.positionCartographic.latitude, |
| | | height |
| | | ), |
| | | orientation: { |
| | | heading: that.DC.Namespace.Cesium.Math.toRadians( |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians( |
| | | that.dimensionData.heading |
| | | ), // 方向 |
| | | pitch: that.DC.Namespace.Cesium.Math.toRadians( |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians( |
| | | that.dimensionData.pitch |
| | | ), // 倾斜角度 |
| | | roll: that.dimensionData.roll |
| | |
| | | // 按钮事件 |
| | | const butSetViews = (num) => { |
| | | viewer.camera.flyTo({ |
| | | destination: that.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | viewer.camera.positionCartographic.longitude, |
| | | viewer.camera.positionCartographic.latitude, |
| | | num |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: that.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | }, |
| | | duration: 0.5 // 定位的时间间隔 |
| | |
| | | } |
| | | var setViews = (num) => { |
| | | viewer.camera.flyTo({ |
| | | destination: that.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | viewer.camera.positionCartographic.longitude, |
| | | viewer.camera.positionCartographic.latitude, |
| | | num |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: that.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | }, |
| | | duration: 0.5 // 定位的时间间隔 |
| | |
| | | overii() |
| | | } |
| | | var isCameraTime = null |
| | | viewer.on(that.DC.SceneEventType.CAMERA_CHANGED, (e) => { |
| | | viewer.on(global.DC.SceneEventType.CAMERA_CHANGED, (e) => { |
| | | if (that.dimension == '2.5D') { |
| | | // console.log(e); |
| | | const height = Math.ceil(viewer.camera.positionCartographic.height) |
| | |
| | | // 白模型↑ |
| | | |
| | | // 精细模型↓ |
| | | const tilesetLayer = new that.DC.TilesetLayer('tilesetLayer') |
| | | const tilesetLayer = new global.DC.TilesetLayer('tilesetLayer') |
| | | viewer.addLayer(tilesetLayer) |
| | | const tileset = new that.DC.Tileset('/mx/tileset.json', { |
| | | const tileset = new global.DC.Tileset('/mx/tileset.json', { |
| | | luminanceAtZenith: 0.5 |
| | | }) |
| | | |
| | |
| | | // tilesetLayer.show = false; |
| | | |
| | | const silhouetteBlue = |
| | | that.DC.Namespace.Cesium.PostProcessStageLibrary.createEdgeDetectionStage() |
| | | silhouetteBlue.uniforms.color = that.DC.Namespace.Cesium.Color.fromBytes( |
| | | global.DC.Namespace.Cesium.PostProcessStageLibrary.createEdgeDetectionStage() |
| | | silhouetteBlue.uniforms.color = global.DC.Namespace.Cesium.Color.fromBytes( |
| | | 9, |
| | | 162, |
| | | 40 |
| | |
| | | silhouetteBlue.selected = [] |
| | | |
| | | viewer.scene.postProcessStages.add( |
| | | that.DC.Namespace.Cesium.PostProcessStageLibrary.createSilhouetteStage([ |
| | | global.DC.Namespace.Cesium.PostProcessStageLibrary.createSilhouetteStage([ |
| | | silhouetteBlue |
| | | ]) |
| | | ) |
| | | |
| | | var highlighted = { |
| | | feature: undefined, |
| | | originalColor: new that.DC.Namespace.Cesium.Color() |
| | | originalColor: new global.DC.Namespace.Cesium.Color() |
| | | } |
| | | |
| | | var selected = { |
| | | feature: undefined, |
| | | originalColor: new that.DC.Namespace.Cesium.Color() |
| | | originalColor: new global.DC.Namespace.Cesium.Color() |
| | | } |
| | | // 点击事件 |
| | | tileset.on(DC.MouseEventType.CLICK, (e) => { |
| | | tileset.on(global.DC.MouseEventType.CLICK, (e) => { |
| | | viewer.scene.globe.depthTestAgainstTerrain = false |
| | | // console.log(e); |
| | | |
| | | viewer.flyToPosition( |
| | | new that.DC.Position(115.87186406, 28.74449337, 1800, 0, 45, 0) |
| | | new global.DC.Position(115.87186406, 28.74449337, 1800, 0, 45, 0) |
| | | ) |
| | | |
| | | // 定制化窗体 |
| | |
| | | // 高亮 |
| | | silhouetteBlue.selected = [] |
| | | |
| | | if (that.DC.Namespace.Cesium.defined(highlighted.feature)) { |
| | | if (global.DC.Namespace.Cesium.defined(highlighted.feature)) { |
| | | highlighted.feature.color = highlighted.originalColor |
| | | highlighted.feature = undefined |
| | | } |
| | |
| | | |
| | | highlighted.feature = e.feature |
| | | |
| | | that.DC.Namespace.Cesium.Color.clone( |
| | | global.DC.Namespace.Cesium.Color.clone( |
| | | e.feature.color, |
| | | highlighted.originalColor |
| | | ) |
| | | e.feature.color = that.DC.Namespace.Cesium.Color.fromBytes( |
| | | e.feature.color = global.DC.Namespace.Cesium.Color.fromBytes( |
| | | 155, |
| | | 255, |
| | | 175 |
| | |
| | | } |
| | | }) |
| | | // 移动事件 |
| | | // tileset.on(that.DC.MouseEventType.MOUSE_MOVE, (e) => { |
| | | // tileset.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => { |
| | | // silhouetteBlue.selected = []; |
| | | |
| | | // if (that.DC.Namespace.Cesium.defined(highlighted.feature)) { |
| | | // if (global.DC.Namespace.Cesium.defined(highlighted.feature)) { |
| | | // highlighted.feature.color = highlighted.originalColor; |
| | | // highlighted.feature = undefined; |
| | | // } |
| | |
| | | |
| | | // highlighted.feature = e.feature; |
| | | |
| | | // that.DC.Namespace.Cesium.Color.clone( |
| | | // global.DC.Namespace.Cesium.Color.clone( |
| | | // e.feature.color, |
| | | // highlighted.originalColor |
| | | // ); |
| | | // e.feature.color = that.DC.Namespace.Cesium.Color.fromBytes( |
| | | // e.feature.color = global.DC.Namespace.Cesium.Color.fromBytes( |
| | | // 155, |
| | | // 255, |
| | | // 175 |
| | |
| | | // 2.5D贴图↓ |
| | | const usetowpointfive = () => { |
| | | var provider = |
| | | // new that.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({ |
| | | // new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({ |
| | | // url: "http://www.tdtfz.com/OneMapServer/rest/services/fzsw2019/MapServer/WMTS/tile/1.0.0/fzsw2019/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}", |
| | | // layer: "fzsw2019", |
| | | // style: "default", |
| | | // tileMatrixSetID: "default028mm", |
| | | // format: "image/jpgpng", |
| | | // tilingScheme: new that.DC.Namespace.Cesium.GeographicTilingScheme(), |
| | | // tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(), |
| | | // maximumLevel: 19, |
| | | // tileMatrixLabels: [ |
| | | // "0", |
| | |
| | | // "19", |
| | | // ], |
| | | // }); |
| | | // new that.DC.Namespace.Cesium.ArcGisMapServerImageryProvider({ |
| | | // new global.DC.Namespace.Cesium.ArcGisMapServerImageryProvider({ |
| | | // url: "http://arcgis.jxpskj.com:6080/arcgis/rest/services/PingXiang25DMapDN/MapServer", |
| | | // }); |
| | | new that.DC.Namespace.Cesium.UrlTemplateImageryProvider({ |
| | | new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({ |
| | | url: '/wp/{z}/{x}/{y}.png', |
| | | fileExtension: 'png' |
| | | }) |
| | |
| | | |
| | | const newLayer = usetowpointfive() |
| | | // 2.5d贴图事件 |
| | | const layerGroup = new that.DC.LayerGroup('modelBox') |
| | | const layerGroup = new global.DC.LayerGroup('modelBox') |
| | | viewer.addLayerGroup(layerGroup) |
| | | |
| | | const areaLayer = new that.DC.VectorLayer('areaLayer') |
| | | const areaLayer = new global.DC.VectorLayer('areaLayer') |
| | | layerGroup.addLayer(areaLayer) |
| | | axios |
| | | .get( |
| | |
| | | |
| | | item.geometry.rings[0] = item.geometry.rings[0].join(';') |
| | | |
| | | const polygon = new that.DC.Polygon(item.geometry.rings[0]) |
| | | const polygon = new global.DC.Polygon(item.geometry.rings[0]) |
| | | polygon.attr = item.attributes |
| | | |
| | | polygon.setStyle({ |
| | | material: that.DC.Namespace.Cesium.Color.fromBytes( |
| | | material: global.DC.Namespace.Cesium.Color.fromBytes( |
| | | 255, |
| | | 255, |
| | | 255, |
| | |
| | | // overlay: undefined, |
| | | // color: undefined, |
| | | // }; |
| | | viewer.on(that.DC.MouseEventType.CLICK, (e) => { |
| | | viewer.on(global.DC.MouseEventType.CLICK, (e) => { |
| | | // console.log(e); |
| | | if (e.overlay != undefined && e.layer.id == 'areaLayer') { |
| | | if (that.areaLayerSelect.overlay != undefined) { |
| | |
| | | that.areaLayerSelect.color = e.overlay._style.material |
| | | that.areaLayerSelect.overlay.setStyle({ |
| | | outline: true, |
| | | outlineColor: that.DC.Namespace.Cesium.Color.fromBytes( |
| | | outlineColor: global.DC.Namespace.Cesium.Color.fromBytes( |
| | | 3, |
| | | 255, |
| | | 13, |
| | |
| | | ), // 边框颜色 |
| | | outlineWidth: 10, // 边框大小, |
| | | height: 0.01, |
| | | material: that.DC.Namespace.Cesium.Color.fromBytes( |
| | | material: global.DC.Namespace.Cesium.Color.fromBytes( |
| | | 108, |
| | | 245, |
| | | 113, |
| | |
| | | viewer.camera.setView({ |
| | | // Cesium的坐标是以地心为原点,一向指向南美洲,一向指向亚洲,一向指向北极州 |
| | | // fromDegrees()方法,将经纬度和高程转换为世界坐标 |
| | | destination: that.DC.Namespace.Cesium.Cartesian3.fromDegrees( |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees( |
| | | // 114.0351, |
| | | // 27.6314, |
| | | // 200.0 |
| | |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: that.DC.Namespace.Cesium.Math.toRadians(h[0]), |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(h[0]), |
| | | // 视角 |
| | | pitch: that.DC.Namespace.Cesium.Math.toRadians(h[1]), |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(h[1]), |
| | | roll: h[2] |
| | | } |
| | | }) |
| | |
| | | // console.log(currentViewRect, 78); |
| | | |
| | | // 瀑布流↓ |
| | | const wallLayer = new that.DC.VectorLayer('wallLayer') |
| | | const wallLayer = new global.DC.VectorLayer('wallLayer') |
| | | // viewer.addLayer(wallLayer); |
| | | // var arr = that.wallArr; |
| | | // arr.forEach((item) => { |
| | | // item = item.join(","); |
| | | // }); |
| | | // arr = arr.join(";"); |
| | | // const wall = new that.DC.Wall(arr); |
| | | // const wall = new global.DC.Wall(arr); |
| | | // wall.setStyle({ |
| | | // material: new that.DC.WallTrailMaterialProperty({ |
| | | // color: that.DC.Namespace.Cesium.Color.fromBytes(0, 142, 255, 150), |
| | | // // color: that.DC.Color.DEEPSKYBLUE, |
| | | // material: new global.DC.WallTrailMaterialProperty({ |
| | | // color: global.DC.Namespace.Cesium.Color.fromBytes(0, 142, 255, 150), |
| | | // // color: global.DC.Color.DEEPSKYBLUE, |
| | | // speed: 4, |
| | | // }), |
| | | // }); |
| | | // wallLayer.addOverlay(wall); |
| | | |
| | | // viewer.use(new that.DC.Measure()); |
| | | // viewer.use(new global.DC.Measure()); |
| | | // 瀑布流↑ |
| | | |
| | | // 传入store |
| | |
| | | viewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000 |
| | | } |
| | | |
| | | DC.ready(initViewer) |
| | | global.DC.ready(initViewer) |
| | | setTimeout(() => { |
| | | that.butbut() |
| | | |