diff --git a/config/index.js b/config/index.js index 5db6bbf..358b560 100644 --- a/config/index.js +++ b/config/index.js @@ -18,9 +18,8 @@ } } }, - // Various Dev Server settings - host: '0.0.0.0', // can be overwritten by process.env.HOST + // host: '0.0.0.0', // can be overwritten by process.env.HOST port: 8081, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: true, errorOverlay: true, diff --git a/config/index.js b/config/index.js index 5db6bbf..358b560 100644 --- a/config/index.js +++ b/config/index.js @@ -18,9 +18,8 @@ } } }, - // Various Dev Server settings - host: '0.0.0.0', // can be overwritten by process.env.HOST + // host: '0.0.0.0', // can be overwritten by process.env.HOST port: 8081, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: true, errorOverlay: true, diff --git a/package.json b/package.json index 038a72e..9d5c107 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,7 @@ "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", "lodash": "^4.17.15", - "mars3d": "^3.0.16", + "mars3d": "^3.0.19", "mars3d-echarts": "^3.0.2", "mars3d-heatmap": "^3.0.2", "mars3d-mapv": "^3.0.2", diff --git a/config/index.js b/config/index.js index 5db6bbf..358b560 100644 --- a/config/index.js +++ b/config/index.js @@ -18,9 +18,8 @@ } } }, - // Various Dev Server settings - host: '0.0.0.0', // can be overwritten by process.env.HOST + // host: '0.0.0.0', // can be overwritten by process.env.HOST port: 8081, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: true, errorOverlay: true, diff --git a/package.json b/package.json index 038a72e..9d5c107 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,7 @@ "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", "lodash": "^4.17.15", - "mars3d": "^3.0.16", + "mars3d": "^3.0.19", "mars3d-echarts": "^3.0.2", "mars3d-heatmap": "^3.0.2", "mars3d-mapv": "^3.0.2", diff --git a/src/api/needSupply.js b/src/api/needSupply.js new file mode 100644 index 0000000..751d397 --- /dev/null +++ b/src/api/needSupply.js @@ -0,0 +1,20 @@ +/** + * 供需接口 + */ +import request from '@/utils/request' +// 各地区供需数据 +export function getAreaNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/areaNeedSupply', + method: 'get', + params + }) +} +// 各用户供需数据 +export function getUserNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/userNeedSupply', + method: 'get', + params + }) +} diff --git a/config/index.js b/config/index.js index 5db6bbf..358b560 100644 --- a/config/index.js +++ b/config/index.js @@ -18,9 +18,8 @@ } } }, - // Various Dev Server settings - host: '0.0.0.0', // can be overwritten by process.env.HOST + // host: '0.0.0.0', // can be overwritten by process.env.HOST port: 8081, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: true, errorOverlay: true, diff --git a/package.json b/package.json index 038a72e..9d5c107 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,7 @@ "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", "lodash": "^4.17.15", - "mars3d": "^3.0.16", + "mars3d": "^3.0.19", "mars3d-echarts": "^3.0.2", "mars3d-heatmap": "^3.0.2", "mars3d-mapv": "^3.0.2", diff --git a/src/api/needSupply.js b/src/api/needSupply.js new file mode 100644 index 0000000..751d397 --- /dev/null +++ b/src/api/needSupply.js @@ -0,0 +1,20 @@ +/** + * 供需接口 + */ +import request from '@/utils/request' +// 各地区供需数据 +export function getAreaNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/areaNeedSupply', + method: 'get', + params + }) +} +// 各用户供需数据 +export function getUserNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/userNeedSupply', + method: 'get', + params + }) +} diff --git a/src/assets/button_images/button_blue.png b/src/assets/button_images/button_blue.png new file mode 100644 index 0000000..afa28ba --- /dev/null +++ b/src/assets/button_images/button_blue.png Binary files differ diff --git a/config/index.js b/config/index.js index 5db6bbf..358b560 100644 --- a/config/index.js +++ b/config/index.js @@ -18,9 +18,8 @@ } } }, - // Various Dev Server settings - host: '0.0.0.0', // can be overwritten by process.env.HOST + // host: '0.0.0.0', // can be overwritten by process.env.HOST port: 8081, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: true, errorOverlay: true, diff --git a/package.json b/package.json index 038a72e..9d5c107 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,7 @@ "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", "lodash": "^4.17.15", - "mars3d": "^3.0.16", + "mars3d": "^3.0.19", "mars3d-echarts": "^3.0.2", "mars3d-heatmap": "^3.0.2", "mars3d-mapv": "^3.0.2", diff --git a/src/api/needSupply.js b/src/api/needSupply.js new file mode 100644 index 0000000..751d397 --- /dev/null +++ b/src/api/needSupply.js @@ -0,0 +1,20 @@ +/** + * 供需接口 + */ +import request from '@/utils/request' +// 各地区供需数据 +export function getAreaNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/areaNeedSupply', + method: 'get', + params + }) +} +// 各用户供需数据 +export function getUserNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/userNeedSupply', + method: 'get', + params + }) +} diff --git a/src/assets/button_images/button_blue.png b/src/assets/button_images/button_blue.png new file mode 100644 index 0000000..afa28ba --- /dev/null +++ b/src/assets/button_images/button_blue.png Binary files differ diff --git a/src/assets/button_images/button_yellow.png b/src/assets/button_images/button_yellow.png new file mode 100644 index 0000000..a305030 --- /dev/null +++ b/src/assets/button_images/button_yellow.png Binary files differ diff --git a/config/index.js b/config/index.js index 5db6bbf..358b560 100644 --- a/config/index.js +++ b/config/index.js @@ -18,9 +18,8 @@ } } }, - // Various Dev Server settings - host: '0.0.0.0', // can be overwritten by process.env.HOST + // host: '0.0.0.0', // can be overwritten by process.env.HOST port: 8081, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: true, errorOverlay: true, diff --git a/package.json b/package.json index 038a72e..9d5c107 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,7 @@ "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", "lodash": "^4.17.15", - "mars3d": "^3.0.16", + "mars3d": "^3.0.19", "mars3d-echarts": "^3.0.2", "mars3d-heatmap": "^3.0.2", "mars3d-mapv": "^3.0.2", diff --git a/src/api/needSupply.js b/src/api/needSupply.js new file mode 100644 index 0000000..751d397 --- /dev/null +++ b/src/api/needSupply.js @@ -0,0 +1,20 @@ +/** + * 供需接口 + */ +import request from '@/utils/request' +// 各地区供需数据 +export function getAreaNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/areaNeedSupply', + method: 'get', + params + }) +} +// 各用户供需数据 +export function getUserNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/userNeedSupply', + method: 'get', + params + }) +} diff --git a/src/assets/button_images/button_blue.png b/src/assets/button_images/button_blue.png new file mode 100644 index 0000000..afa28ba --- /dev/null +++ b/src/assets/button_images/button_blue.png Binary files differ diff --git a/src/assets/button_images/button_yellow.png b/src/assets/button_images/button_yellow.png new file mode 100644 index 0000000..a305030 --- /dev/null +++ b/src/assets/button_images/button_yellow.png Binary files differ diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue index e6c3b12..85748f0 100644 --- a/src/components/Map/MarsMap.vue +++ b/src/components/Map/MarsMap.vue @@ -6,6 +6,8 @@ - - diff --git a/config/index.js b/config/index.js index 5db6bbf..358b560 100644 --- a/config/index.js +++ b/config/index.js @@ -18,9 +18,8 @@ } } }, - // Various Dev Server settings - host: '0.0.0.0', // can be overwritten by process.env.HOST + // host: '0.0.0.0', // can be overwritten by process.env.HOST port: 8081, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: true, errorOverlay: true, diff --git a/package.json b/package.json index 038a72e..9d5c107 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,7 @@ "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", "lodash": "^4.17.15", - "mars3d": "^3.0.16", + "mars3d": "^3.0.19", "mars3d-echarts": "^3.0.2", "mars3d-heatmap": "^3.0.2", "mars3d-mapv": "^3.0.2", diff --git a/src/api/needSupply.js b/src/api/needSupply.js new file mode 100644 index 0000000..751d397 --- /dev/null +++ b/src/api/needSupply.js @@ -0,0 +1,20 @@ +/** + * 供需接口 + */ +import request from '@/utils/request' +// 各地区供需数据 +export function getAreaNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/areaNeedSupply', + method: 'get', + params + }) +} +// 各用户供需数据 +export function getUserNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/userNeedSupply', + method: 'get', + params + }) +} diff --git a/src/assets/button_images/button_blue.png b/src/assets/button_images/button_blue.png new file mode 100644 index 0000000..afa28ba --- /dev/null +++ b/src/assets/button_images/button_blue.png Binary files differ diff --git a/src/assets/button_images/button_yellow.png b/src/assets/button_images/button_yellow.png new file mode 100644 index 0000000..a305030 --- /dev/null +++ b/src/assets/button_images/button_yellow.png Binary files differ diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue index e6c3b12..85748f0 100644 --- a/src/components/Map/MarsMap.vue +++ b/src/components/Map/MarsMap.vue @@ -6,6 +6,8 @@ - - diff --git a/src/views/maps/needTopic.vue b/src/views/maps/needTopic.vue new file mode 100644 index 0000000..2a8db54 --- /dev/null +++ b/src/views/maps/needTopic.vue @@ -0,0 +1,319 @@ + + + + + + + + diff --git a/config/index.js b/config/index.js index 5db6bbf..358b560 100644 --- a/config/index.js +++ b/config/index.js @@ -18,9 +18,8 @@ } } }, - // Various Dev Server settings - host: '0.0.0.0', // can be overwritten by process.env.HOST + // host: '0.0.0.0', // can be overwritten by process.env.HOST port: 8081, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: true, errorOverlay: true, diff --git a/package.json b/package.json index 038a72e..9d5c107 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,7 @@ "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", "lodash": "^4.17.15", - "mars3d": "^3.0.16", + "mars3d": "^3.0.19", "mars3d-echarts": "^3.0.2", "mars3d-heatmap": "^3.0.2", "mars3d-mapv": "^3.0.2", diff --git a/src/api/needSupply.js b/src/api/needSupply.js new file mode 100644 index 0000000..751d397 --- /dev/null +++ b/src/api/needSupply.js @@ -0,0 +1,20 @@ +/** + * 供需接口 + */ +import request from '@/utils/request' +// 各地区供需数据 +export function getAreaNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/areaNeedSupply', + method: 'get', + params + }) +} +// 各用户供需数据 +export function getUserNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/userNeedSupply', + method: 'get', + params + }) +} diff --git a/src/assets/button_images/button_blue.png b/src/assets/button_images/button_blue.png new file mode 100644 index 0000000..afa28ba --- /dev/null +++ b/src/assets/button_images/button_blue.png Binary files differ diff --git a/src/assets/button_images/button_yellow.png b/src/assets/button_images/button_yellow.png new file mode 100644 index 0000000..a305030 --- /dev/null +++ b/src/assets/button_images/button_yellow.png Binary files differ diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue index e6c3b12..85748f0 100644 --- a/src/components/Map/MarsMap.vue +++ b/src/components/Map/MarsMap.vue @@ -6,6 +6,8 @@ - - diff --git a/src/views/maps/needTopic.vue b/src/views/maps/needTopic.vue new file mode 100644 index 0000000..2a8db54 --- /dev/null +++ b/src/views/maps/needTopic.vue @@ -0,0 +1,319 @@ + + + + + + + + diff --git a/src/views/maps/pipeOverview.vue b/src/views/maps/pipeOverview.vue index 5706e58..877b0d2 100644 --- a/src/views/maps/pipeOverview.vue +++ b/src/views/maps/pipeOverview.vue @@ -19,7 +19,7 @@ - + @@ -35,6 +35,7 @@ import ThreatDialog from './components/threatDialog' import HighConsequenceDialog from './components/highConsequenceDialog' import { getDisasterList, getEarthquakeList } from '@/api/weather' + export default { name: 'PipeOverview', components: { @@ -88,16 +89,7 @@ '橙色': '03', '红色': '04' }, // 灾害等级与数字对应表 - manageStations: [ - { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' }, - { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' }, - { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' }, - { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' }, - { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' }, - { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' }, - { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' }, - { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' } - ], + manageStations: [], station2: [], // 站场列表 valveChambers: [], // 阀室 liquidFactory: [], // 液化工厂 @@ -292,20 +284,26 @@ var graphicLayer = new mars3d.layer.GraphicLayer() this.stationLayer = graphicLayer this.map.addLayer(graphicLayer) - for (const station of this.manageStations) { - const graphic = new mars3d.graphic.ModelEntity({ - name: station.name, - position: [station.x, station.y, 0], - style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 - }, - tooltip: station.name - }) - graphicLayer.addGraphic(graphic) - } + axios.get('static/config/manageStation.json').then((res) => { + res = res.data + if (res.code === 200) { + this.manageStations = res.data + for (const station of this.manageStations) { + const graphic = new mars3d.graphic.ModelEntity({ + name: station.name, + position: [station.x, station.y, 0], + style: { + url: 'static/gltf/output/guanlizhan.gltf', + scale: 5, + heading: 90, + minimumPixelSize: 30 + }, + tooltip: station.name + }) + graphicLayer.addGraphic(graphic) + } + } + }) }, // 站场 addStation2() { @@ -322,8 +320,8 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/zhanchang.gltf', - scale: 20, + url: 'static/gltf/output/zhanchang.gltf', + scale: 5, heading: 90, minimumPixelSize: 30 }, @@ -349,10 +347,10 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/fashi.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 + url: 'static/gltf/output/fashi.gltf', + scale: 4, + heading: 0, + minimumPixelSize: 15 }, tooltip: station.name }) @@ -371,9 +369,9 @@ this.liquidFactory = res.data[0].data const factoryModelLayer = new mars3d.layer.ModelLayer({ name: '液化工厂', - url: './static/gltf/output/yehuagongchang.gltf', + url: 'static/gltf/output/yehuagongchang.gltf', style: { - scale: 20, + scale: 3, heading: 0, minimumPixelSize: 30, clampToGround: true @@ -396,7 +394,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' + const img = 'static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '气象灾害', position: [item.lng, item.lat, 10000], @@ -427,7 +425,7 @@ getEarthquakeList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/earthquake.png' + const img = 'static/images/map/earthquake.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '地震', position: [item.lng, item.lat, 0], @@ -460,7 +458,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/camera.png' + const img = 'static/images/map/camera.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '监控点', position: new mars3d.LatLngPoint(item.lng, item.lat, 0), @@ -600,7 +598,7 @@ }, // 显示摄像头 showCamera(show) { - console.log('func showCamera:'+show) + console.log('func showCamera:' + show) if (show) { // 移除 this.cameraShow = false this.map.removeLayer(this.cameraLayer, true) @@ -608,7 +606,7 @@ this.cameraShow = true this.addCamera() } - console.log('func showCamera over:'+this.cameraShow) + console.log('func showCamera over:' + this.cameraShow) } } } diff --git a/config/index.js b/config/index.js index 5db6bbf..358b560 100644 --- a/config/index.js +++ b/config/index.js @@ -18,9 +18,8 @@ } } }, - // Various Dev Server settings - host: '0.0.0.0', // can be overwritten by process.env.HOST + // host: '0.0.0.0', // can be overwritten by process.env.HOST port: 8081, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: true, errorOverlay: true, diff --git a/package.json b/package.json index 038a72e..9d5c107 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,7 @@ "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", "lodash": "^4.17.15", - "mars3d": "^3.0.16", + "mars3d": "^3.0.19", "mars3d-echarts": "^3.0.2", "mars3d-heatmap": "^3.0.2", "mars3d-mapv": "^3.0.2", diff --git a/src/api/needSupply.js b/src/api/needSupply.js new file mode 100644 index 0000000..751d397 --- /dev/null +++ b/src/api/needSupply.js @@ -0,0 +1,20 @@ +/** + * 供需接口 + */ +import request from '@/utils/request' +// 各地区供需数据 +export function getAreaNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/areaNeedSupply', + method: 'get', + params + }) +} +// 各用户供需数据 +export function getUserNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/userNeedSupply', + method: 'get', + params + }) +} diff --git a/src/assets/button_images/button_blue.png b/src/assets/button_images/button_blue.png new file mode 100644 index 0000000..afa28ba --- /dev/null +++ b/src/assets/button_images/button_blue.png Binary files differ diff --git a/src/assets/button_images/button_yellow.png b/src/assets/button_images/button_yellow.png new file mode 100644 index 0000000..a305030 --- /dev/null +++ b/src/assets/button_images/button_yellow.png Binary files differ diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue index e6c3b12..85748f0 100644 --- a/src/components/Map/MarsMap.vue +++ b/src/components/Map/MarsMap.vue @@ -6,6 +6,8 @@ - - diff --git a/src/views/maps/needTopic.vue b/src/views/maps/needTopic.vue new file mode 100644 index 0000000..2a8db54 --- /dev/null +++ b/src/views/maps/needTopic.vue @@ -0,0 +1,319 @@ + + + + + + + + diff --git a/src/views/maps/pipeOverview.vue b/src/views/maps/pipeOverview.vue index 5706e58..877b0d2 100644 --- a/src/views/maps/pipeOverview.vue +++ b/src/views/maps/pipeOverview.vue @@ -19,7 +19,7 @@ - + @@ -35,6 +35,7 @@ import ThreatDialog from './components/threatDialog' import HighConsequenceDialog from './components/highConsequenceDialog' import { getDisasterList, getEarthquakeList } from '@/api/weather' + export default { name: 'PipeOverview', components: { @@ -88,16 +89,7 @@ '橙色': '03', '红色': '04' }, // 灾害等级与数字对应表 - manageStations: [ - { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' }, - { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' }, - { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' }, - { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' }, - { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' }, - { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' }, - { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' }, - { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' } - ], + manageStations: [], station2: [], // 站场列表 valveChambers: [], // 阀室 liquidFactory: [], // 液化工厂 @@ -292,20 +284,26 @@ var graphicLayer = new mars3d.layer.GraphicLayer() this.stationLayer = graphicLayer this.map.addLayer(graphicLayer) - for (const station of this.manageStations) { - const graphic = new mars3d.graphic.ModelEntity({ - name: station.name, - position: [station.x, station.y, 0], - style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 - }, - tooltip: station.name - }) - graphicLayer.addGraphic(graphic) - } + axios.get('static/config/manageStation.json').then((res) => { + res = res.data + if (res.code === 200) { + this.manageStations = res.data + for (const station of this.manageStations) { + const graphic = new mars3d.graphic.ModelEntity({ + name: station.name, + position: [station.x, station.y, 0], + style: { + url: 'static/gltf/output/guanlizhan.gltf', + scale: 5, + heading: 90, + minimumPixelSize: 30 + }, + tooltip: station.name + }) + graphicLayer.addGraphic(graphic) + } + } + }) }, // 站场 addStation2() { @@ -322,8 +320,8 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/zhanchang.gltf', - scale: 20, + url: 'static/gltf/output/zhanchang.gltf', + scale: 5, heading: 90, minimumPixelSize: 30 }, @@ -349,10 +347,10 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/fashi.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 + url: 'static/gltf/output/fashi.gltf', + scale: 4, + heading: 0, + minimumPixelSize: 15 }, tooltip: station.name }) @@ -371,9 +369,9 @@ this.liquidFactory = res.data[0].data const factoryModelLayer = new mars3d.layer.ModelLayer({ name: '液化工厂', - url: './static/gltf/output/yehuagongchang.gltf', + url: 'static/gltf/output/yehuagongchang.gltf', style: { - scale: 20, + scale: 3, heading: 0, minimumPixelSize: 30, clampToGround: true @@ -396,7 +394,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' + const img = 'static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '气象灾害', position: [item.lng, item.lat, 10000], @@ -427,7 +425,7 @@ getEarthquakeList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/earthquake.png' + const img = 'static/images/map/earthquake.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '地震', position: [item.lng, item.lat, 0], @@ -460,7 +458,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/camera.png' + const img = 'static/images/map/camera.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '监控点', position: new mars3d.LatLngPoint(item.lng, item.lat, 0), @@ -600,7 +598,7 @@ }, // 显示摄像头 showCamera(show) { - console.log('func showCamera:'+show) + console.log('func showCamera:' + show) if (show) { // 移除 this.cameraShow = false this.map.removeLayer(this.cameraLayer, true) @@ -608,7 +606,7 @@ this.cameraShow = true this.addCamera() } - console.log('func showCamera over:'+this.cameraShow) + console.log('func showCamera over:' + this.cameraShow) } } } diff --git a/src/views/maps/routeTopic.vue b/src/views/maps/routeTopic.vue index 0c774ac..4fdc979 100644 --- a/src/views/maps/routeTopic.vue +++ b/src/views/maps/routeTopic.vue @@ -271,8 +271,8 @@ name: station.name, position: [station.x, station.y, 10000], style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, + url: 'static/gltf/output/guanlizhan.gltf', + scale: 10, heading: 90, minimumPixelSize: 30 }, diff --git a/config/index.js b/config/index.js index 5db6bbf..358b560 100644 --- a/config/index.js +++ b/config/index.js @@ -18,9 +18,8 @@ } } }, - // Various Dev Server settings - host: '0.0.0.0', // can be overwritten by process.env.HOST + // host: '0.0.0.0', // can be overwritten by process.env.HOST port: 8081, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: true, errorOverlay: true, diff --git a/package.json b/package.json index 038a72e..9d5c107 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,7 @@ "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", "lodash": "^4.17.15", - "mars3d": "^3.0.16", + "mars3d": "^3.0.19", "mars3d-echarts": "^3.0.2", "mars3d-heatmap": "^3.0.2", "mars3d-mapv": "^3.0.2", diff --git a/src/api/needSupply.js b/src/api/needSupply.js new file mode 100644 index 0000000..751d397 --- /dev/null +++ b/src/api/needSupply.js @@ -0,0 +1,20 @@ +/** + * 供需接口 + */ +import request from '@/utils/request' +// 各地区供需数据 +export function getAreaNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/areaNeedSupply', + method: 'get', + params + }) +} +// 各用户供需数据 +export function getUserNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/userNeedSupply', + method: 'get', + params + }) +} diff --git a/src/assets/button_images/button_blue.png b/src/assets/button_images/button_blue.png new file mode 100644 index 0000000..afa28ba --- /dev/null +++ b/src/assets/button_images/button_blue.png Binary files differ diff --git a/src/assets/button_images/button_yellow.png b/src/assets/button_images/button_yellow.png new file mode 100644 index 0000000..a305030 --- /dev/null +++ b/src/assets/button_images/button_yellow.png Binary files differ diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue index e6c3b12..85748f0 100644 --- a/src/components/Map/MarsMap.vue +++ b/src/components/Map/MarsMap.vue @@ -6,6 +6,8 @@ - - diff --git a/src/views/maps/needTopic.vue b/src/views/maps/needTopic.vue new file mode 100644 index 0000000..2a8db54 --- /dev/null +++ b/src/views/maps/needTopic.vue @@ -0,0 +1,319 @@ + + + + + + + + diff --git a/src/views/maps/pipeOverview.vue b/src/views/maps/pipeOverview.vue index 5706e58..877b0d2 100644 --- a/src/views/maps/pipeOverview.vue +++ b/src/views/maps/pipeOverview.vue @@ -19,7 +19,7 @@ - + @@ -35,6 +35,7 @@ import ThreatDialog from './components/threatDialog' import HighConsequenceDialog from './components/highConsequenceDialog' import { getDisasterList, getEarthquakeList } from '@/api/weather' + export default { name: 'PipeOverview', components: { @@ -88,16 +89,7 @@ '橙色': '03', '红色': '04' }, // 灾害等级与数字对应表 - manageStations: [ - { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' }, - { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' }, - { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' }, - { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' }, - { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' }, - { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' }, - { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' }, - { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' } - ], + manageStations: [], station2: [], // 站场列表 valveChambers: [], // 阀室 liquidFactory: [], // 液化工厂 @@ -292,20 +284,26 @@ var graphicLayer = new mars3d.layer.GraphicLayer() this.stationLayer = graphicLayer this.map.addLayer(graphicLayer) - for (const station of this.manageStations) { - const graphic = new mars3d.graphic.ModelEntity({ - name: station.name, - position: [station.x, station.y, 0], - style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 - }, - tooltip: station.name - }) - graphicLayer.addGraphic(graphic) - } + axios.get('static/config/manageStation.json').then((res) => { + res = res.data + if (res.code === 200) { + this.manageStations = res.data + for (const station of this.manageStations) { + const graphic = new mars3d.graphic.ModelEntity({ + name: station.name, + position: [station.x, station.y, 0], + style: { + url: 'static/gltf/output/guanlizhan.gltf', + scale: 5, + heading: 90, + minimumPixelSize: 30 + }, + tooltip: station.name + }) + graphicLayer.addGraphic(graphic) + } + } + }) }, // 站场 addStation2() { @@ -322,8 +320,8 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/zhanchang.gltf', - scale: 20, + url: 'static/gltf/output/zhanchang.gltf', + scale: 5, heading: 90, minimumPixelSize: 30 }, @@ -349,10 +347,10 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/fashi.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 + url: 'static/gltf/output/fashi.gltf', + scale: 4, + heading: 0, + minimumPixelSize: 15 }, tooltip: station.name }) @@ -371,9 +369,9 @@ this.liquidFactory = res.data[0].data const factoryModelLayer = new mars3d.layer.ModelLayer({ name: '液化工厂', - url: './static/gltf/output/yehuagongchang.gltf', + url: 'static/gltf/output/yehuagongchang.gltf', style: { - scale: 20, + scale: 3, heading: 0, minimumPixelSize: 30, clampToGround: true @@ -396,7 +394,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' + const img = 'static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '气象灾害', position: [item.lng, item.lat, 10000], @@ -427,7 +425,7 @@ getEarthquakeList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/earthquake.png' + const img = 'static/images/map/earthquake.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '地震', position: [item.lng, item.lat, 0], @@ -460,7 +458,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/camera.png' + const img = 'static/images/map/camera.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '监控点', position: new mars3d.LatLngPoint(item.lng, item.lat, 0), @@ -600,7 +598,7 @@ }, // 显示摄像头 showCamera(show) { - console.log('func showCamera:'+show) + console.log('func showCamera:' + show) if (show) { // 移除 this.cameraShow = false this.map.removeLayer(this.cameraLayer, true) @@ -608,7 +606,7 @@ this.cameraShow = true this.addCamera() } - console.log('func showCamera over:'+this.cameraShow) + console.log('func showCamera over:' + this.cameraShow) } } } diff --git a/src/views/maps/routeTopic.vue b/src/views/maps/routeTopic.vue index 0c774ac..4fdc979 100644 --- a/src/views/maps/routeTopic.vue +++ b/src/views/maps/routeTopic.vue @@ -271,8 +271,8 @@ name: station.name, position: [station.x, station.y, 10000], style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, + url: 'static/gltf/output/guanlizhan.gltf', + scale: 10, heading: 90, minimumPixelSize: 30 }, diff --git a/src/views/maps/sinkThreat.vue b/src/views/maps/sinkThreat.vue index 75516da..eb1db82 100644 --- a/src/views/maps/sinkThreat.vue +++ b/src/views/maps/sinkThreat.vue @@ -4,50 +4,41 @@ * @Date: 2021-04-09 --> - - diff --git a/src/views/maps/needTopic.vue b/src/views/maps/needTopic.vue new file mode 100644 index 0000000..2a8db54 --- /dev/null +++ b/src/views/maps/needTopic.vue @@ -0,0 +1,319 @@ + + + + + + + + diff --git a/src/views/maps/pipeOverview.vue b/src/views/maps/pipeOverview.vue index 5706e58..877b0d2 100644 --- a/src/views/maps/pipeOverview.vue +++ b/src/views/maps/pipeOverview.vue @@ -19,7 +19,7 @@ - + @@ -35,6 +35,7 @@ import ThreatDialog from './components/threatDialog' import HighConsequenceDialog from './components/highConsequenceDialog' import { getDisasterList, getEarthquakeList } from '@/api/weather' + export default { name: 'PipeOverview', components: { @@ -88,16 +89,7 @@ '橙色': '03', '红色': '04' }, // 灾害等级与数字对应表 - manageStations: [ - { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' }, - { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' }, - { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' }, - { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' }, - { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' }, - { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' }, - { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' }, - { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' } - ], + manageStations: [], station2: [], // 站场列表 valveChambers: [], // 阀室 liquidFactory: [], // 液化工厂 @@ -292,20 +284,26 @@ var graphicLayer = new mars3d.layer.GraphicLayer() this.stationLayer = graphicLayer this.map.addLayer(graphicLayer) - for (const station of this.manageStations) { - const graphic = new mars3d.graphic.ModelEntity({ - name: station.name, - position: [station.x, station.y, 0], - style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 - }, - tooltip: station.name - }) - graphicLayer.addGraphic(graphic) - } + axios.get('static/config/manageStation.json').then((res) => { + res = res.data + if (res.code === 200) { + this.manageStations = res.data + for (const station of this.manageStations) { + const graphic = new mars3d.graphic.ModelEntity({ + name: station.name, + position: [station.x, station.y, 0], + style: { + url: 'static/gltf/output/guanlizhan.gltf', + scale: 5, + heading: 90, + minimumPixelSize: 30 + }, + tooltip: station.name + }) + graphicLayer.addGraphic(graphic) + } + } + }) }, // 站场 addStation2() { @@ -322,8 +320,8 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/zhanchang.gltf', - scale: 20, + url: 'static/gltf/output/zhanchang.gltf', + scale: 5, heading: 90, minimumPixelSize: 30 }, @@ -349,10 +347,10 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/fashi.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 + url: 'static/gltf/output/fashi.gltf', + scale: 4, + heading: 0, + minimumPixelSize: 15 }, tooltip: station.name }) @@ -371,9 +369,9 @@ this.liquidFactory = res.data[0].data const factoryModelLayer = new mars3d.layer.ModelLayer({ name: '液化工厂', - url: './static/gltf/output/yehuagongchang.gltf', + url: 'static/gltf/output/yehuagongchang.gltf', style: { - scale: 20, + scale: 3, heading: 0, minimumPixelSize: 30, clampToGround: true @@ -396,7 +394,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' + const img = 'static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '气象灾害', position: [item.lng, item.lat, 10000], @@ -427,7 +425,7 @@ getEarthquakeList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/earthquake.png' + const img = 'static/images/map/earthquake.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '地震', position: [item.lng, item.lat, 0], @@ -460,7 +458,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/camera.png' + const img = 'static/images/map/camera.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '监控点', position: new mars3d.LatLngPoint(item.lng, item.lat, 0), @@ -600,7 +598,7 @@ }, // 显示摄像头 showCamera(show) { - console.log('func showCamera:'+show) + console.log('func showCamera:' + show) if (show) { // 移除 this.cameraShow = false this.map.removeLayer(this.cameraLayer, true) @@ -608,7 +606,7 @@ this.cameraShow = true this.addCamera() } - console.log('func showCamera over:'+this.cameraShow) + console.log('func showCamera over:' + this.cameraShow) } } } diff --git a/src/views/maps/routeTopic.vue b/src/views/maps/routeTopic.vue index 0c774ac..4fdc979 100644 --- a/src/views/maps/routeTopic.vue +++ b/src/views/maps/routeTopic.vue @@ -271,8 +271,8 @@ name: station.name, position: [station.x, station.y, 10000], style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, + url: 'static/gltf/output/guanlizhan.gltf', + scale: 10, heading: 90, minimumPixelSize: 30 }, diff --git a/src/views/maps/sinkThreat.vue b/src/views/maps/sinkThreat.vue index 75516da..eb1db82 100644 --- a/src/views/maps/sinkThreat.vue +++ b/src/views/maps/sinkThreat.vue @@ -4,50 +4,41 @@ * @Date: 2021-04-09 --> - - diff --git a/src/views/maps/needTopic.vue b/src/views/maps/needTopic.vue new file mode 100644 index 0000000..2a8db54 --- /dev/null +++ b/src/views/maps/needTopic.vue @@ -0,0 +1,319 @@ + + + + + + + + diff --git a/src/views/maps/pipeOverview.vue b/src/views/maps/pipeOverview.vue index 5706e58..877b0d2 100644 --- a/src/views/maps/pipeOverview.vue +++ b/src/views/maps/pipeOverview.vue @@ -19,7 +19,7 @@ - + @@ -35,6 +35,7 @@ import ThreatDialog from './components/threatDialog' import HighConsequenceDialog from './components/highConsequenceDialog' import { getDisasterList, getEarthquakeList } from '@/api/weather' + export default { name: 'PipeOverview', components: { @@ -88,16 +89,7 @@ '橙色': '03', '红色': '04' }, // 灾害等级与数字对应表 - manageStations: [ - { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' }, - { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' }, - { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' }, - { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' }, - { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' }, - { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' }, - { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' }, - { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' } - ], + manageStations: [], station2: [], // 站场列表 valveChambers: [], // 阀室 liquidFactory: [], // 液化工厂 @@ -292,20 +284,26 @@ var graphicLayer = new mars3d.layer.GraphicLayer() this.stationLayer = graphicLayer this.map.addLayer(graphicLayer) - for (const station of this.manageStations) { - const graphic = new mars3d.graphic.ModelEntity({ - name: station.name, - position: [station.x, station.y, 0], - style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 - }, - tooltip: station.name - }) - graphicLayer.addGraphic(graphic) - } + axios.get('static/config/manageStation.json').then((res) => { + res = res.data + if (res.code === 200) { + this.manageStations = res.data + for (const station of this.manageStations) { + const graphic = new mars3d.graphic.ModelEntity({ + name: station.name, + position: [station.x, station.y, 0], + style: { + url: 'static/gltf/output/guanlizhan.gltf', + scale: 5, + heading: 90, + minimumPixelSize: 30 + }, + tooltip: station.name + }) + graphicLayer.addGraphic(graphic) + } + } + }) }, // 站场 addStation2() { @@ -322,8 +320,8 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/zhanchang.gltf', - scale: 20, + url: 'static/gltf/output/zhanchang.gltf', + scale: 5, heading: 90, minimumPixelSize: 30 }, @@ -349,10 +347,10 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/fashi.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 + url: 'static/gltf/output/fashi.gltf', + scale: 4, + heading: 0, + minimumPixelSize: 15 }, tooltip: station.name }) @@ -371,9 +369,9 @@ this.liquidFactory = res.data[0].data const factoryModelLayer = new mars3d.layer.ModelLayer({ name: '液化工厂', - url: './static/gltf/output/yehuagongchang.gltf', + url: 'static/gltf/output/yehuagongchang.gltf', style: { - scale: 20, + scale: 3, heading: 0, minimumPixelSize: 30, clampToGround: true @@ -396,7 +394,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' + const img = 'static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '气象灾害', position: [item.lng, item.lat, 10000], @@ -427,7 +425,7 @@ getEarthquakeList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/earthquake.png' + const img = 'static/images/map/earthquake.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '地震', position: [item.lng, item.lat, 0], @@ -460,7 +458,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/camera.png' + const img = 'static/images/map/camera.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '监控点', position: new mars3d.LatLngPoint(item.lng, item.lat, 0), @@ -600,7 +598,7 @@ }, // 显示摄像头 showCamera(show) { - console.log('func showCamera:'+show) + console.log('func showCamera:' + show) if (show) { // 移除 this.cameraShow = false this.map.removeLayer(this.cameraLayer, true) @@ -608,7 +606,7 @@ this.cameraShow = true this.addCamera() } - console.log('func showCamera over:'+this.cameraShow) + console.log('func showCamera over:' + this.cameraShow) } } } diff --git a/src/views/maps/routeTopic.vue b/src/views/maps/routeTopic.vue index 0c774ac..4fdc979 100644 --- a/src/views/maps/routeTopic.vue +++ b/src/views/maps/routeTopic.vue @@ -271,8 +271,8 @@ name: station.name, position: [station.x, station.y, 10000], style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, + url: 'static/gltf/output/guanlizhan.gltf', + scale: 10, heading: 90, minimumPixelSize: 30 }, diff --git a/src/views/maps/sinkThreat.vue b/src/views/maps/sinkThreat.vue index 75516da..eb1db82 100644 --- a/src/views/maps/sinkThreat.vue +++ b/src/views/maps/sinkThreat.vue @@ -4,50 +4,41 @@ * @Date: 2021-04-09 --> + + + + diff --git a/config/index.js b/config/index.js index 5db6bbf..358b560 100644 --- a/config/index.js +++ b/config/index.js @@ -18,9 +18,8 @@ } } }, - // Various Dev Server settings - host: '0.0.0.0', // can be overwritten by process.env.HOST + // host: '0.0.0.0', // can be overwritten by process.env.HOST port: 8081, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: true, errorOverlay: true, diff --git a/package.json b/package.json index 038a72e..9d5c107 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,7 @@ "js-cookie": "2.2.0", "jsencrypt": "^3.0.0-rc.1", "lodash": "^4.17.15", - "mars3d": "^3.0.16", + "mars3d": "^3.0.19", "mars3d-echarts": "^3.0.2", "mars3d-heatmap": "^3.0.2", "mars3d-mapv": "^3.0.2", diff --git a/src/api/needSupply.js b/src/api/needSupply.js new file mode 100644 index 0000000..751d397 --- /dev/null +++ b/src/api/needSupply.js @@ -0,0 +1,20 @@ +/** + * 供需接口 + */ +import request from '@/utils/request' +// 各地区供需数据 +export function getAreaNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/areaNeedSupply', + method: 'get', + params + }) +} +// 各用户供需数据 +export function getUserNeedSupply(params) { + return request({ + url: 'http://rest.apizza.net/mock/cfbb939c147bb6d68372de83af189fee/userNeedSupply', + method: 'get', + params + }) +} diff --git a/src/assets/button_images/button_blue.png b/src/assets/button_images/button_blue.png new file mode 100644 index 0000000..afa28ba --- /dev/null +++ b/src/assets/button_images/button_blue.png Binary files differ diff --git a/src/assets/button_images/button_yellow.png b/src/assets/button_images/button_yellow.png new file mode 100644 index 0000000..a305030 --- /dev/null +++ b/src/assets/button_images/button_yellow.png Binary files differ diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue index e6c3b12..85748f0 100644 --- a/src/components/Map/MarsMap.vue +++ b/src/components/Map/MarsMap.vue @@ -6,6 +6,8 @@ - - diff --git a/src/views/maps/needTopic.vue b/src/views/maps/needTopic.vue new file mode 100644 index 0000000..2a8db54 --- /dev/null +++ b/src/views/maps/needTopic.vue @@ -0,0 +1,319 @@ + + + + + + + + diff --git a/src/views/maps/pipeOverview.vue b/src/views/maps/pipeOverview.vue index 5706e58..877b0d2 100644 --- a/src/views/maps/pipeOverview.vue +++ b/src/views/maps/pipeOverview.vue @@ -19,7 +19,7 @@ - + @@ -35,6 +35,7 @@ import ThreatDialog from './components/threatDialog' import HighConsequenceDialog from './components/highConsequenceDialog' import { getDisasterList, getEarthquakeList } from '@/api/weather' + export default { name: 'PipeOverview', components: { @@ -88,16 +89,7 @@ '橙色': '03', '红色': '04' }, // 灾害等级与数字对应表 - manageStations: [ - { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' }, - { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' }, - { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' }, - { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' }, - { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' }, - { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' }, - { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' }, - { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' } - ], + manageStations: [], station2: [], // 站场列表 valveChambers: [], // 阀室 liquidFactory: [], // 液化工厂 @@ -292,20 +284,26 @@ var graphicLayer = new mars3d.layer.GraphicLayer() this.stationLayer = graphicLayer this.map.addLayer(graphicLayer) - for (const station of this.manageStations) { - const graphic = new mars3d.graphic.ModelEntity({ - name: station.name, - position: [station.x, station.y, 0], - style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 - }, - tooltip: station.name - }) - graphicLayer.addGraphic(graphic) - } + axios.get('static/config/manageStation.json').then((res) => { + res = res.data + if (res.code === 200) { + this.manageStations = res.data + for (const station of this.manageStations) { + const graphic = new mars3d.graphic.ModelEntity({ + name: station.name, + position: [station.x, station.y, 0], + style: { + url: 'static/gltf/output/guanlizhan.gltf', + scale: 5, + heading: 90, + minimumPixelSize: 30 + }, + tooltip: station.name + }) + graphicLayer.addGraphic(graphic) + } + } + }) }, // 站场 addStation2() { @@ -322,8 +320,8 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/zhanchang.gltf', - scale: 20, + url: 'static/gltf/output/zhanchang.gltf', + scale: 5, heading: 90, minimumPixelSize: 30 }, @@ -349,10 +347,10 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/fashi.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 + url: 'static/gltf/output/fashi.gltf', + scale: 4, + heading: 0, + minimumPixelSize: 15 }, tooltip: station.name }) @@ -371,9 +369,9 @@ this.liquidFactory = res.data[0].data const factoryModelLayer = new mars3d.layer.ModelLayer({ name: '液化工厂', - url: './static/gltf/output/yehuagongchang.gltf', + url: 'static/gltf/output/yehuagongchang.gltf', style: { - scale: 20, + scale: 3, heading: 0, minimumPixelSize: 30, clampToGround: true @@ -396,7 +394,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' + const img = 'static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '气象灾害', position: [item.lng, item.lat, 10000], @@ -427,7 +425,7 @@ getEarthquakeList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/earthquake.png' + const img = 'static/images/map/earthquake.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '地震', position: [item.lng, item.lat, 0], @@ -460,7 +458,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/camera.png' + const img = 'static/images/map/camera.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '监控点', position: new mars3d.LatLngPoint(item.lng, item.lat, 0), @@ -600,7 +598,7 @@ }, // 显示摄像头 showCamera(show) { - console.log('func showCamera:'+show) + console.log('func showCamera:' + show) if (show) { // 移除 this.cameraShow = false this.map.removeLayer(this.cameraLayer, true) @@ -608,7 +606,7 @@ this.cameraShow = true this.addCamera() } - console.log('func showCamera over:'+this.cameraShow) + console.log('func showCamera over:' + this.cameraShow) } } } diff --git a/src/views/maps/routeTopic.vue b/src/views/maps/routeTopic.vue index 0c774ac..4fdc979 100644 --- a/src/views/maps/routeTopic.vue +++ b/src/views/maps/routeTopic.vue @@ -271,8 +271,8 @@ name: station.name, position: [station.x, station.y, 10000], style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, + url: 'static/gltf/output/guanlizhan.gltf', + scale: 10, heading: 90, minimumPixelSize: 30 }, diff --git a/src/views/maps/sinkThreat.vue b/src/views/maps/sinkThreat.vue index 75516da..eb1db82 100644 --- a/src/views/maps/sinkThreat.vue +++ b/src/views/maps/sinkThreat.vue @@ -4,50 +4,41 @@ * @Date: 2021-04-09 --> + + + + diff --git a/src/views/maps/vip.vue b/src/views/maps/vip.vue index f30e8a3..6b1f578 100644 --- a/src/views/maps/vip.vue +++ b/src/views/maps/vip.vue @@ -4,11 +4,7 @@ * @Date: 2021-04-11 --> - - diff --git a/src/views/maps/needTopic.vue b/src/views/maps/needTopic.vue new file mode 100644 index 0000000..2a8db54 --- /dev/null +++ b/src/views/maps/needTopic.vue @@ -0,0 +1,319 @@ + + + + + + + + diff --git a/src/views/maps/pipeOverview.vue b/src/views/maps/pipeOverview.vue index 5706e58..877b0d2 100644 --- a/src/views/maps/pipeOverview.vue +++ b/src/views/maps/pipeOverview.vue @@ -19,7 +19,7 @@ - + @@ -35,6 +35,7 @@ import ThreatDialog from './components/threatDialog' import HighConsequenceDialog from './components/highConsequenceDialog' import { getDisasterList, getEarthquakeList } from '@/api/weather' + export default { name: 'PipeOverview', components: { @@ -88,16 +89,7 @@ '橙色': '03', '红色': '04' }, // 灾害等级与数字对应表 - manageStations: [ - { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' }, - { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' }, - { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' }, - { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' }, - { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' }, - { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' }, - { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' }, - { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' } - ], + manageStations: [], station2: [], // 站场列表 valveChambers: [], // 阀室 liquidFactory: [], // 液化工厂 @@ -292,20 +284,26 @@ var graphicLayer = new mars3d.layer.GraphicLayer() this.stationLayer = graphicLayer this.map.addLayer(graphicLayer) - for (const station of this.manageStations) { - const graphic = new mars3d.graphic.ModelEntity({ - name: station.name, - position: [station.x, station.y, 0], - style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 - }, - tooltip: station.name - }) - graphicLayer.addGraphic(graphic) - } + axios.get('static/config/manageStation.json').then((res) => { + res = res.data + if (res.code === 200) { + this.manageStations = res.data + for (const station of this.manageStations) { + const graphic = new mars3d.graphic.ModelEntity({ + name: station.name, + position: [station.x, station.y, 0], + style: { + url: 'static/gltf/output/guanlizhan.gltf', + scale: 5, + heading: 90, + minimumPixelSize: 30 + }, + tooltip: station.name + }) + graphicLayer.addGraphic(graphic) + } + } + }) }, // 站场 addStation2() { @@ -322,8 +320,8 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/zhanchang.gltf', - scale: 20, + url: 'static/gltf/output/zhanchang.gltf', + scale: 5, heading: 90, minimumPixelSize: 30 }, @@ -349,10 +347,10 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/fashi.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 + url: 'static/gltf/output/fashi.gltf', + scale: 4, + heading: 0, + minimumPixelSize: 15 }, tooltip: station.name }) @@ -371,9 +369,9 @@ this.liquidFactory = res.data[0].data const factoryModelLayer = new mars3d.layer.ModelLayer({ name: '液化工厂', - url: './static/gltf/output/yehuagongchang.gltf', + url: 'static/gltf/output/yehuagongchang.gltf', style: { - scale: 20, + scale: 3, heading: 0, minimumPixelSize: 30, clampToGround: true @@ -396,7 +394,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' + const img = 'static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '气象灾害', position: [item.lng, item.lat, 10000], @@ -427,7 +425,7 @@ getEarthquakeList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/earthquake.png' + const img = 'static/images/map/earthquake.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '地震', position: [item.lng, item.lat, 0], @@ -460,7 +458,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/camera.png' + const img = 'static/images/map/camera.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '监控点', position: new mars3d.LatLngPoint(item.lng, item.lat, 0), @@ -600,7 +598,7 @@ }, // 显示摄像头 showCamera(show) { - console.log('func showCamera:'+show) + console.log('func showCamera:' + show) if (show) { // 移除 this.cameraShow = false this.map.removeLayer(this.cameraLayer, true) @@ -608,7 +606,7 @@ this.cameraShow = true this.addCamera() } - console.log('func showCamera over:'+this.cameraShow) + console.log('func showCamera over:' + this.cameraShow) } } } diff --git a/src/views/maps/routeTopic.vue b/src/views/maps/routeTopic.vue index 0c774ac..4fdc979 100644 --- a/src/views/maps/routeTopic.vue +++ b/src/views/maps/routeTopic.vue @@ -271,8 +271,8 @@ name: station.name, position: [station.x, station.y, 10000], style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, + url: 'static/gltf/output/guanlizhan.gltf', + scale: 10, heading: 90, minimumPixelSize: 30 }, diff --git a/src/views/maps/sinkThreat.vue b/src/views/maps/sinkThreat.vue index 75516da..eb1db82 100644 --- a/src/views/maps/sinkThreat.vue +++ b/src/views/maps/sinkThreat.vue @@ -4,50 +4,41 @@ * @Date: 2021-04-09 --> + + + + diff --git a/src/views/maps/vip.vue b/src/views/maps/vip.vue index f30e8a3..6b1f578 100644 --- a/src/views/maps/vip.vue +++ b/src/views/maps/vip.vue @@ -4,11 +4,7 @@ * @Date: 2021-04-11 --> - - diff --git a/src/views/maps/needTopic.vue b/src/views/maps/needTopic.vue new file mode 100644 index 0000000..2a8db54 --- /dev/null +++ b/src/views/maps/needTopic.vue @@ -0,0 +1,319 @@ + + + + + + + + diff --git a/src/views/maps/pipeOverview.vue b/src/views/maps/pipeOverview.vue index 5706e58..877b0d2 100644 --- a/src/views/maps/pipeOverview.vue +++ b/src/views/maps/pipeOverview.vue @@ -19,7 +19,7 @@ - + @@ -35,6 +35,7 @@ import ThreatDialog from './components/threatDialog' import HighConsequenceDialog from './components/highConsequenceDialog' import { getDisasterList, getEarthquakeList } from '@/api/weather' + export default { name: 'PipeOverview', components: { @@ -88,16 +89,7 @@ '橙色': '03', '红色': '04' }, // 灾害等级与数字对应表 - manageStations: [ - { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' }, - { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' }, - { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' }, - { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' }, - { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' }, - { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' }, - { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' }, - { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' } - ], + manageStations: [], station2: [], // 站场列表 valveChambers: [], // 阀室 liquidFactory: [], // 液化工厂 @@ -292,20 +284,26 @@ var graphicLayer = new mars3d.layer.GraphicLayer() this.stationLayer = graphicLayer this.map.addLayer(graphicLayer) - for (const station of this.manageStations) { - const graphic = new mars3d.graphic.ModelEntity({ - name: station.name, - position: [station.x, station.y, 0], - style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 - }, - tooltip: station.name - }) - graphicLayer.addGraphic(graphic) - } + axios.get('static/config/manageStation.json').then((res) => { + res = res.data + if (res.code === 200) { + this.manageStations = res.data + for (const station of this.manageStations) { + const graphic = new mars3d.graphic.ModelEntity({ + name: station.name, + position: [station.x, station.y, 0], + style: { + url: 'static/gltf/output/guanlizhan.gltf', + scale: 5, + heading: 90, + minimumPixelSize: 30 + }, + tooltip: station.name + }) + graphicLayer.addGraphic(graphic) + } + } + }) }, // 站场 addStation2() { @@ -322,8 +320,8 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/zhanchang.gltf', - scale: 20, + url: 'static/gltf/output/zhanchang.gltf', + scale: 5, heading: 90, minimumPixelSize: 30 }, @@ -349,10 +347,10 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/fashi.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 + url: 'static/gltf/output/fashi.gltf', + scale: 4, + heading: 0, + minimumPixelSize: 15 }, tooltip: station.name }) @@ -371,9 +369,9 @@ this.liquidFactory = res.data[0].data const factoryModelLayer = new mars3d.layer.ModelLayer({ name: '液化工厂', - url: './static/gltf/output/yehuagongchang.gltf', + url: 'static/gltf/output/yehuagongchang.gltf', style: { - scale: 20, + scale: 3, heading: 0, minimumPixelSize: 30, clampToGround: true @@ -396,7 +394,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' + const img = 'static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '气象灾害', position: [item.lng, item.lat, 10000], @@ -427,7 +425,7 @@ getEarthquakeList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/earthquake.png' + const img = 'static/images/map/earthquake.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '地震', position: [item.lng, item.lat, 0], @@ -460,7 +458,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/camera.png' + const img = 'static/images/map/camera.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '监控点', position: new mars3d.LatLngPoint(item.lng, item.lat, 0), @@ -600,7 +598,7 @@ }, // 显示摄像头 showCamera(show) { - console.log('func showCamera:'+show) + console.log('func showCamera:' + show) if (show) { // 移除 this.cameraShow = false this.map.removeLayer(this.cameraLayer, true) @@ -608,7 +606,7 @@ this.cameraShow = true this.addCamera() } - console.log('func showCamera over:'+this.cameraShow) + console.log('func showCamera over:' + this.cameraShow) } } } diff --git a/src/views/maps/routeTopic.vue b/src/views/maps/routeTopic.vue index 0c774ac..4fdc979 100644 --- a/src/views/maps/routeTopic.vue +++ b/src/views/maps/routeTopic.vue @@ -271,8 +271,8 @@ name: station.name, position: [station.x, station.y, 10000], style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, + url: 'static/gltf/output/guanlizhan.gltf', + scale: 10, heading: 90, minimumPixelSize: 30 }, diff --git a/src/views/maps/sinkThreat.vue b/src/views/maps/sinkThreat.vue index 75516da..eb1db82 100644 --- a/src/views/maps/sinkThreat.vue +++ b/src/views/maps/sinkThreat.vue @@ -4,50 +4,41 @@ * @Date: 2021-04-09 --> + + + + diff --git a/src/views/maps/vip.vue b/src/views/maps/vip.vue index f30e8a3..6b1f578 100644 --- a/src/views/maps/vip.vue +++ b/src/views/maps/vip.vue @@ -4,11 +4,7 @@ * @Date: 2021-04-11 --> - - diff --git a/src/views/maps/needTopic.vue b/src/views/maps/needTopic.vue new file mode 100644 index 0000000..2a8db54 --- /dev/null +++ b/src/views/maps/needTopic.vue @@ -0,0 +1,319 @@ + + + + + + + + diff --git a/src/views/maps/pipeOverview.vue b/src/views/maps/pipeOverview.vue index 5706e58..877b0d2 100644 --- a/src/views/maps/pipeOverview.vue +++ b/src/views/maps/pipeOverview.vue @@ -19,7 +19,7 @@ - + @@ -35,6 +35,7 @@ import ThreatDialog from './components/threatDialog' import HighConsequenceDialog from './components/highConsequenceDialog' import { getDisasterList, getEarthquakeList } from '@/api/weather' + export default { name: 'PipeOverview', components: { @@ -88,16 +89,7 @@ '橙色': '03', '红色': '04' }, // 灾害等级与数字对应表 - manageStations: [ - { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' }, - { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' }, - { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' }, - { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' }, - { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' }, - { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' }, - { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' }, - { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' } - ], + manageStations: [], station2: [], // 站场列表 valveChambers: [], // 阀室 liquidFactory: [], // 液化工厂 @@ -292,20 +284,26 @@ var graphicLayer = new mars3d.layer.GraphicLayer() this.stationLayer = graphicLayer this.map.addLayer(graphicLayer) - for (const station of this.manageStations) { - const graphic = new mars3d.graphic.ModelEntity({ - name: station.name, - position: [station.x, station.y, 0], - style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 - }, - tooltip: station.name - }) - graphicLayer.addGraphic(graphic) - } + axios.get('static/config/manageStation.json').then((res) => { + res = res.data + if (res.code === 200) { + this.manageStations = res.data + for (const station of this.manageStations) { + const graphic = new mars3d.graphic.ModelEntity({ + name: station.name, + position: [station.x, station.y, 0], + style: { + url: 'static/gltf/output/guanlizhan.gltf', + scale: 5, + heading: 90, + minimumPixelSize: 30 + }, + tooltip: station.name + }) + graphicLayer.addGraphic(graphic) + } + } + }) }, // 站场 addStation2() { @@ -322,8 +320,8 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/zhanchang.gltf', - scale: 20, + url: 'static/gltf/output/zhanchang.gltf', + scale: 5, heading: 90, minimumPixelSize: 30 }, @@ -349,10 +347,10 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/fashi.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 + url: 'static/gltf/output/fashi.gltf', + scale: 4, + heading: 0, + minimumPixelSize: 15 }, tooltip: station.name }) @@ -371,9 +369,9 @@ this.liquidFactory = res.data[0].data const factoryModelLayer = new mars3d.layer.ModelLayer({ name: '液化工厂', - url: './static/gltf/output/yehuagongchang.gltf', + url: 'static/gltf/output/yehuagongchang.gltf', style: { - scale: 20, + scale: 3, heading: 0, minimumPixelSize: 30, clampToGround: true @@ -396,7 +394,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' + const img = 'static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '气象灾害', position: [item.lng, item.lat, 10000], @@ -427,7 +425,7 @@ getEarthquakeList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/earthquake.png' + const img = 'static/images/map/earthquake.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '地震', position: [item.lng, item.lat, 0], @@ -460,7 +458,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/camera.png' + const img = 'static/images/map/camera.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '监控点', position: new mars3d.LatLngPoint(item.lng, item.lat, 0), @@ -600,7 +598,7 @@ }, // 显示摄像头 showCamera(show) { - console.log('func showCamera:'+show) + console.log('func showCamera:' + show) if (show) { // 移除 this.cameraShow = false this.map.removeLayer(this.cameraLayer, true) @@ -608,7 +606,7 @@ this.cameraShow = true this.addCamera() } - console.log('func showCamera over:'+this.cameraShow) + console.log('func showCamera over:' + this.cameraShow) } } } diff --git a/src/views/maps/routeTopic.vue b/src/views/maps/routeTopic.vue index 0c774ac..4fdc979 100644 --- a/src/views/maps/routeTopic.vue +++ b/src/views/maps/routeTopic.vue @@ -271,8 +271,8 @@ name: station.name, position: [station.x, station.y, 10000], style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, + url: 'static/gltf/output/guanlizhan.gltf', + scale: 10, heading: 90, minimumPixelSize: 30 }, diff --git a/src/views/maps/sinkThreat.vue b/src/views/maps/sinkThreat.vue index 75516da..eb1db82 100644 --- a/src/views/maps/sinkThreat.vue +++ b/src/views/maps/sinkThreat.vue @@ -4,50 +4,41 @@ * @Date: 2021-04-09 --> + + + + diff --git a/src/views/maps/vip.vue b/src/views/maps/vip.vue index f30e8a3..6b1f578 100644 --- a/src/views/maps/vip.vue +++ b/src/views/maps/vip.vue @@ -4,11 +4,7 @@ * @Date: 2021-04-11 --> - - diff --git a/src/views/maps/needTopic.vue b/src/views/maps/needTopic.vue new file mode 100644 index 0000000..2a8db54 --- /dev/null +++ b/src/views/maps/needTopic.vue @@ -0,0 +1,319 @@ + + + + + + + + diff --git a/src/views/maps/pipeOverview.vue b/src/views/maps/pipeOverview.vue index 5706e58..877b0d2 100644 --- a/src/views/maps/pipeOverview.vue +++ b/src/views/maps/pipeOverview.vue @@ -19,7 +19,7 @@ - + @@ -35,6 +35,7 @@ import ThreatDialog from './components/threatDialog' import HighConsequenceDialog from './components/highConsequenceDialog' import { getDisasterList, getEarthquakeList } from '@/api/weather' + export default { name: 'PipeOverview', components: { @@ -88,16 +89,7 @@ '橙色': '03', '红色': '04' }, // 灾害等级与数字对应表 - manageStations: [ - { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' }, - { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' }, - { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' }, - { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' }, - { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' }, - { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' }, - { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' }, - { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' } - ], + manageStations: [], station2: [], // 站场列表 valveChambers: [], // 阀室 liquidFactory: [], // 液化工厂 @@ -292,20 +284,26 @@ var graphicLayer = new mars3d.layer.GraphicLayer() this.stationLayer = graphicLayer this.map.addLayer(graphicLayer) - for (const station of this.manageStations) { - const graphic = new mars3d.graphic.ModelEntity({ - name: station.name, - position: [station.x, station.y, 0], - style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 - }, - tooltip: station.name - }) - graphicLayer.addGraphic(graphic) - } + axios.get('static/config/manageStation.json').then((res) => { + res = res.data + if (res.code === 200) { + this.manageStations = res.data + for (const station of this.manageStations) { + const graphic = new mars3d.graphic.ModelEntity({ + name: station.name, + position: [station.x, station.y, 0], + style: { + url: 'static/gltf/output/guanlizhan.gltf', + scale: 5, + heading: 90, + minimumPixelSize: 30 + }, + tooltip: station.name + }) + graphicLayer.addGraphic(graphic) + } + } + }) }, // 站场 addStation2() { @@ -322,8 +320,8 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/zhanchang.gltf', - scale: 20, + url: 'static/gltf/output/zhanchang.gltf', + scale: 5, heading: 90, minimumPixelSize: 30 }, @@ -349,10 +347,10 @@ name: station.name, position: [station.x, station.y, 0], style: { - url: '/static/gltf/output/fashi.gltf', - scale: 20, - heading: 90, - minimumPixelSize: 30 + url: 'static/gltf/output/fashi.gltf', + scale: 4, + heading: 0, + minimumPixelSize: 15 }, tooltip: station.name }) @@ -371,9 +369,9 @@ this.liquidFactory = res.data[0].data const factoryModelLayer = new mars3d.layer.ModelLayer({ name: '液化工厂', - url: './static/gltf/output/yehuagongchang.gltf', + url: 'static/gltf/output/yehuagongchang.gltf', style: { - scale: 20, + scale: 3, heading: 0, minimumPixelSize: 30, clampToGround: true @@ -396,7 +394,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' + const img = 'static/images/weather_disaster/' + this.disaster[item.zhlx] + this.disasterLevel[item.zhdj] + '.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '气象灾害', position: [item.lng, item.lat, 10000], @@ -427,7 +425,7 @@ getEarthquakeList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/earthquake.png' + const img = 'static/images/map/earthquake.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '地震', position: [item.lng, item.lat, 0], @@ -460,7 +458,7 @@ getDisasterList().then((res) => { const data = res.data for (const item of data) { - const img = '/static/images/map/camera.png' + const img = 'static/images/map/camera.png' const graphic = new mars3d.graphic.BillboardEntity({ name: '监控点', position: new mars3d.LatLngPoint(item.lng, item.lat, 0), @@ -600,7 +598,7 @@ }, // 显示摄像头 showCamera(show) { - console.log('func showCamera:'+show) + console.log('func showCamera:' + show) if (show) { // 移除 this.cameraShow = false this.map.removeLayer(this.cameraLayer, true) @@ -608,7 +606,7 @@ this.cameraShow = true this.addCamera() } - console.log('func showCamera over:'+this.cameraShow) + console.log('func showCamera over:' + this.cameraShow) } } } diff --git a/src/views/maps/routeTopic.vue b/src/views/maps/routeTopic.vue index 0c774ac..4fdc979 100644 --- a/src/views/maps/routeTopic.vue +++ b/src/views/maps/routeTopic.vue @@ -271,8 +271,8 @@ name: station.name, position: [station.x, station.y, 10000], style: { - url: '/static/gltf/output/guanlizhan.gltf', - scale: 20, + url: 'static/gltf/output/guanlizhan.gltf', + scale: 10, heading: 90, minimumPixelSize: 30 }, diff --git a/src/views/maps/sinkThreat.vue b/src/views/maps/sinkThreat.vue index 75516da..eb1db82 100644 --- a/src/views/maps/sinkThreat.vue +++ b/src/views/maps/sinkThreat.vue @@ -4,50 +4,41 @@ * @Date: 2021-04-09 --> + + + + diff --git a/src/views/maps/vip.vue b/src/views/maps/vip.vue index f30e8a3..6b1f578 100644 --- a/src/views/maps/vip.vue +++ b/src/views/maps/vip.vue @@ -4,11 +4,7 @@ * @Date: 2021-04-11 -->