From c6d2dd3ea14e1603d898d70299f3aa6f2eb17649 Mon Sep 17 00:00:00 2001
From: jxdnsong <592566207@qq.com>
Date: Tue, 25 Oct 2022 16:14:57 +0800
Subject: [PATCH] 更换首页底图
---
src/pcviews/homepage/Map/index.vue | 97 ++++++++++++++-----
package-lock.json | 160 +++++++++++++++----------------
2 files changed, 150 insertions(+), 107 deletions(-)
diff --git a/package-lock.json b/package-lock.json
index 3cefdaf..9a0510b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1993,6 +1993,44 @@
"integrity": "sha1-/q7SVZc9LndVW4PbwIhRpsY1IPo=",
"dev": true
},
+ "ansi-styles": {
+ "version": "4.3.0",
+ "resolved": "https://registry.npmmirror.com/ansi-styles/-/ansi-styles-4.3.0.tgz",
+ "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+ "dev": true,
+ "optional": true,
+ "requires": {
+ "color-convert": "^2.0.1"
+ }
+ },
+ "chalk": {
+ "version": "4.1.2",
+ "resolved": "https://registry.npmmirror.com/chalk/-/chalk-4.1.2.tgz",
+ "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+ "dev": true,
+ "optional": true,
+ "requires": {
+ "ansi-styles": "^4.1.0",
+ "supports-color": "^7.1.0"
+ }
+ },
+ "color-convert": {
+ "version": "2.0.1",
+ "resolved": "https://registry.npmmirror.com/color-convert/-/color-convert-2.0.1.tgz",
+ "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+ "dev": true,
+ "optional": true,
+ "requires": {
+ "color-name": "~1.1.4"
+ }
+ },
+ "color-name": {
+ "version": "1.1.4",
+ "resolved": "https://registry.npmmirror.com/color-name/-/color-name-1.1.4.tgz",
+ "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+ "dev": true,
+ "optional": true
+ },
"gzip-size": {
"version": "5.1.1",
"resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-5.1.1.tgz",
@@ -2003,6 +2041,25 @@
"pify": "^4.0.1"
}
},
+ "has-flag": {
+ "version": "4.0.0",
+ "resolved": "https://registry.npmmirror.com/has-flag/-/has-flag-4.0.0.tgz",
+ "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+ "dev": true,
+ "optional": true
+ },
+ "loader-utils": {
+ "version": "2.0.3",
+ "resolved": "https://registry.npmmirror.com/loader-utils/-/loader-utils-2.0.3.tgz",
+ "integrity": "sha512-THWqIsn8QRnvLl0shHYVBN9syumU8pYWEHPTmkiVGd+7K5eFNVSY6AJhRvgGF70gg1Dz+l/k8WicvFCxdEs60A==",
+ "dev": true,
+ "optional": true,
+ "requires": {
+ "big.js": "^5.2.2",
+ "emojis-list": "^3.0.0",
+ "json5": "^2.1.2"
+ }
+ },
"ssri": {
"version": "8.0.1",
"resolved": "https://registry.nlark.com/ssri/download/ssri-8.0.1.tgz?cache=0&sync_timestamp=1621364647836&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fssri%2Fdownload%2Fssri-8.0.1.tgz",
@@ -2010,6 +2067,28 @@
"dev": true,
"requires": {
"minipass": "^3.1.1"
+ }
+ },
+ "supports-color": {
+ "version": "7.2.0",
+ "resolved": "https://registry.npmmirror.com/supports-color/-/supports-color-7.2.0.tgz",
+ "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+ "dev": true,
+ "optional": true,
+ "requires": {
+ "has-flag": "^4.0.0"
+ }
+ },
+ "vue-loader-v16": {
+ "version": "npm:vue-loader@16.8.3",
+ "resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-16.8.3.tgz",
+ "integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==",
+ "dev": true,
+ "optional": true,
+ "requires": {
+ "chalk": "^4.1.0",
+ "hash-sum": "^2.0.0",
+ "loader-utils": "^2.0.0"
}
},
"webpack-bundle-analyzer": {
@@ -15433,87 +15512,6 @@
"resolved": "https://registry.npm.taobao.org/hash-sum/download/hash-sum-1.0.2.tgz",
"integrity": "sha1-M7QHd3VMZDJXPBIMw4CLvRDUfwQ=",
"dev": true
- }
- }
- },
- "vue-loader-v16": {
- "version": "npm:vue-loader@16.8.3",
- "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.8.3.tgz",
- "integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==",
- "dev": true,
- "optional": true,
- "requires": {
- "chalk": "^4.1.0",
- "hash-sum": "^2.0.0",
- "loader-utils": "^2.0.0"
- },
- "dependencies": {
- "ansi-styles": {
- "version": "4.3.0",
- "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
- "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
- "dev": true,
- "optional": true,
- "requires": {
- "color-convert": "^2.0.1"
- }
- },
- "chalk": {
- "version": "4.1.2",
- "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
- "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
- "dev": true,
- "optional": true,
- "requires": {
- "ansi-styles": "^4.1.0",
- "supports-color": "^7.1.0"
- }
- },
- "color-convert": {
- "version": "2.0.1",
- "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
- "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
- "dev": true,
- "optional": true,
- "requires": {
- "color-name": "~1.1.4"
- }
- },
- "color-name": {
- "version": "1.1.4",
- "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
- "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
- "dev": true,
- "optional": true
- },
- "has-flag": {
- "version": "4.0.0",
- "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
- "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
- "dev": true,
- "optional": true
- },
- "loader-utils": {
- "version": "2.0.3",
- "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.3.tgz",
- "integrity": "sha512-THWqIsn8QRnvLl0shHYVBN9syumU8pYWEHPTmkiVGd+7K5eFNVSY6AJhRvgGF70gg1Dz+l/k8WicvFCxdEs60A==",
- "dev": true,
- "optional": true,
- "requires": {
- "big.js": "^5.2.2",
- "emojis-list": "^3.0.0",
- "json5": "^2.1.2"
- }
- },
- "supports-color": {
- "version": "7.2.0",
- "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
- "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
- "dev": true,
- "optional": true,
- "requires": {
- "has-flag": "^4.0.0"
- }
}
}
},
diff --git a/src/pcviews/homepage/Map/index.vue b/src/pcviews/homepage/Map/index.vue
index fd34025..47f5fbc 100644
--- a/src/pcviews/homepage/Map/index.vue
+++ b/src/pcviews/homepage/Map/index.vue
@@ -28,40 +28,85 @@
function initViewer () {
global.viewer = new DC.Viewer('viewer-container')
- // 天地图 影像
- global.viewer.imageryLayers.addImageryProvider(
- new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
- url: 'https://t{s}.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=789e558be762ff832392a0393fd8a4f1',
- subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
- format: 'image/jpeg',
- show: true,
- maximumLevel: 18
- })
- )
-
// 去除水印
const primitiveArr = global.viewer.scene.primitives._primitives
global.viewer.scene.primitives.remove(primitiveArr[0])
- global.viewer.camera.setView({
- // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
- // fromDegrees()方法，将经纬度和高程转换为世界坐标
- destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
- 116.027429, 28.681978, 800
- ),
- orientation: {
- // 指向
- heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
- // 视角
- pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
- roll: 0.0
+
+ global.viewer.setOptions({
+ globe:{
+ baseColor:DC.Color.BLACK
}
})
- // that.addBaseLayer()
+ let layer_build = new DC.TilesetLayer('layer_build').addTo(global.viewer)
+ let build = new DC.Tileset(
+ '//resource.dvgis.cn/data/3dtiles/ljz/tileset.json',
+ {skipLevels:true}
+ )
+ let fs = `
+ varying vec3 v_positionEC;
+ void main(void){
+ vec4 position = czm_inverseModelView * vec4(v_positionEC,1); // 位置
+ float glowRange = 100.0; // 光环的移动范围(高度)
+ gl_FragColor = vec4(0.2, 0.5, 1.0, 1.0); // 颜色
+ gl_FragColor *= vec4(vec3(position.z / 100.0), 1.0); // 渐变
+ // 动态光环
+ float time = fract(czm_frameNumber / 360.0);
+ time = abs(time - 0.5) * 2.0;
+ float diff = step(0.005, abs( clamp(position.z / glowRange, 0.0, 1.0) - time));
+ gl_FragColor.rgb += gl_FragColor.rgb * (1.0 - diff);
+ }
+ `
+ build.setCustomShader(fs)
+ layer_build.addOverlay(build)
+ let layer = new DC.PrimitiveLayer('layer').addTo(global.viewer)
+ let positions = generatePosition(50,true)
+ positions = positions.concat(generatePosition(50,))
+ positions.forEach(item=>{
+ let position = DC.Position.fromObject(item)
+ let end = position.copy()
+ end.alt = 5000 * Math.random()
+ let line = new DC.FlowLinePrimitive([position,end],0.5)
+ line.setStyle({
+ speed: 6 * Math.random(),
+ color: DC.Color.fromCssColorString("rgb(141,172,172)"),
+ percent:0.1,
+ gradient:0.01
+ })
+ layer.addOverlay(line)
+ })
+ global.viewer.flyToPosition("121.4941629,31.2091462,1859.56,0,-28.71")
- global.viewer.use(new global.DC.Measure())
+ // // 天地图 影像
+ // global.viewer.imageryLayers.addImageryProvider(
+ // new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
+ // url: 'https://t{s}.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=789e558be762ff832392a0393fd8a4f1',
+ // subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
+ // format: 'image/jpeg',
+ // show: true,
+ // maximumLevel: 18
+ // })
+ // )
+
+ // global.viewer.camera.setView({
+ // // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
+ // // fromDegrees()方法，将经纬度和高程转换为世界坐标
+ // destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
+ // 116.027429, 28.681978, 800
+ // ),
+ // orientation: {
+ // // 指向
+ // heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
+ // // 视角
+ // pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
+ // roll: 0.0
+ // }
+ // })
+ // // that.addBaseLayer()
- // that.addMxTileset()//师大需要使用
+ // global.viewer.use(new global.DC.Measure())
+
+ // // that.addMxTileset()//师大需要使用
}
global.DC.ready(initViewer)
--
Gitblit v1.9.3