| | |
| | | <template> |
| | | <div class="menu_Box"> |
| | | <div class="menu_Box box_div"> |
| | | <div |
| | | class="leftMen_div" |
| | | @click="setChangeTwoMenu(item)" |
| | | v-for="(item, index) in setListTwoMenu" |
| | | :class="{ lefMenuDivActive: showTwoMenuFlag == item.id }" |
| | | > |
| | | <div class="menuTwoImage" :class="item.css"></div> |
| | | <div |
| | | class="menuTwoImage" |
| | | :class="item.css" |
| | | ></div> |
| | | <div>{{ $t(item.label) }}</div> |
| | | </div> |
| | | <mapinfo ref="mapinfo" /> |
| | | <input type="file" accept=".kml" class="file" style="display: none" /> |
| | | <maplayer ref="maplayer" /> |
| | | <queryinfo ref="queryinfo" /> |
| | | <input |
| | | type="file" |
| | | accept=".kml" |
| | | class="file" |
| | | style="display: none" |
| | | /> |
| | | <input |
| | | :accept="'.shp, .shx, .dbf, .prj'" |
| | | style="display: none" |
| | | ref="pathClear" |
| | | type="file" |
| | | name="file" |
| | | id="shpFile" |
| | | multiple="multiple" |
| | | @change="handleOpenShp()" |
| | | /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | |
| | | import { transform } from 'ol/proj'; |
| | | import mapinfo from '../Tools/mapinfo.vue'; |
| | | import maplayer from '../Tools/maplayer.vue'; |
| | | import queryinfo from '../Tools/queryinfo.vue'; |
| | | import $ from 'jquery' |
| | | import { getToken } from '@/utils/auth'; |
| | | import { |
| | | OverviewMap, |
| | | defaults as defaultControls, |
| | | FullScreen, |
| | | ScaleLine, |
| | | Rotate, |
| | | |
| | | } from "ol/control.js" |
| | | import * as turf from '@turf/turf'; |
| | | import { geometry } from '@turf/turf'; |
| | | |
| | | export default { |
| | | components: { mapinfo }, |
| | | components: { mapinfo, maplayer, queryinfo }, |
| | | data() { |
| | | return { |
| | | showTwoMenuFlag: false, |
| | |
| | | name: '图层管理', |
| | | css: 'twoMenu_imge11', |
| | | }, |
| | | { |
| | | id: 'a2', |
| | | name: '场景提取', |
| | | label: 'synthesis.sceneExtraction', |
| | | css: 'twoMenu_imge12', |
| | | }, |
| | | { |
| | | id: 'a3', |
| | | label: 'synthesis.release', |
| | | name: '场景发布', |
| | | css: 'twoMenu_imge13', |
| | | }, |
| | | |
| | | ], |
| | | [ |
| | | { |
| | |
| | | name: '指北针', |
| | | css: 'twoMenu_imge28', |
| | | }, |
| | | { |
| | | id: 'b9', |
| | | label: 'synthesis.undergroundMode', |
| | | name: '地下模式', |
| | | css: 'twoMenu_imge29', |
| | | }, |
| | | ], |
| | | [ |
| | | { |
| | |
| | | name: '地图快照', |
| | | css: 'twoMenu_imge34', |
| | | }, |
| | | { |
| | | id: 'c5', |
| | | label: 'synthesis.tdisplay', |
| | | name: '三维演示', |
| | | css: 'twoMenu_imge35', |
| | | }, |
| | | |
| | | ], |
| | | [ |
| | | { |
| | |
| | | name: '地形开挖', |
| | | css: 'twoMenu_imge411', |
| | | }, |
| | | { |
| | | id: "d12", |
| | | label: "synthesis.visibilityAnalysis", |
| | | name: "通视分析", |
| | | css: "twoMenu_imge412", |
| | | }, |
| | | { |
| | | id: "d13", |
| | | label: "synthesis.viewAnalysis", |
| | | name: "视域分析", |
| | | css: "twoMenu_imge413", |
| | | }, |
| | | { |
| | | id: "d14", |
| | | label: "synthesis.circularViewAnalysis", |
| | | name: "圆形视域分析", |
| | | css: "twoMenu_imge414", |
| | | }, |
| | | |
| | | |
| | | ], |
| | | [ |
| | | { |
| | |
| | | { |
| | | id: 'j1', |
| | | label: 'synthesis.synthobj.m1', |
| | | name: '水平距离', |
| | | name: '表面距离', |
| | | css: 'twoMenu_imge71', |
| | | }, |
| | | { |
| | |
| | | name: '空间距离', |
| | | css: 'twoMenu_imge76', |
| | | }, |
| | | { |
| | | id: "j7", |
| | | label: "synthesis.synthobj.m9", |
| | | name: "高程量测", |
| | | css: "twoMenu_imge77", |
| | | }, |
| | | ], |
| | | [ |
| | | { |
| | |
| | | label: 'synthesis.point', |
| | | name: '点', |
| | | css: 'twoMenu_imge81', |
| | | }, |
| | | { |
| | | id: 'h8', |
| | | label: 'synthesis.addlabel', |
| | | name: '文字', |
| | | css: 'twoMenu_imge88', |
| | | }, |
| | | { |
| | | id: 'h2', |
| | |
| | | { |
| | | id: 'h5', |
| | | label: 'synthesis.import', |
| | | name: '导入', |
| | | name: '导入KML', |
| | | css: 'twoMenu_imge85', |
| | | }, |
| | | { |
| | | id: 'h6', |
| | | label: 'synthesis.export', |
| | | name: '导出', |
| | | name: '导出KML', |
| | | css: 'twoMenu_imge86', |
| | | }, |
| | | |
| | | { |
| | | id: 'h9', |
| | | label: 'synthesis.import1', |
| | | name: '导入SHP', |
| | | css: 'twoMenu_imge85', |
| | | }, |
| | | { |
| | | id: 'h10', |
| | | label: 'synthesis.export1', |
| | | name: '导出SHP', |
| | | css: 'twoMenu_imge86', |
| | | }, |
| | | |
| | | |
| | | { |
| | | id: 'h7', |
| | | label: 'synthesis.removepaint', |
| | | name: '清除', |
| | | css: 'twoMenu_imge87', |
| | | }, |
| | | ], |
| | | ], [ |
| | | { |
| | | id: 'i1', |
| | | name: '场景提取', |
| | | label: 'synthesis.sceneExtraction', |
| | | css: 'twoMenu_imge12', |
| | | }, |
| | | { |
| | | id: 'i2', |
| | | label: 'synthesis.release', |
| | | name: '场景发布', |
| | | css: 'twoMenu_imge13', |
| | | }, { |
| | | id: 'i3', |
| | | label: 'synthesis.tdisplay', |
| | | name: '三维演示', |
| | | css: 'twoMenu_imge35', |
| | | }, |
| | | ] |
| | | ], |
| | | isRuler: false, |
| | | isNaviget: false, |
| | | isolineFlag: false, |
| | | isslopeFlag: false, |
| | | isContrastFlag: false, |
| | | UndergroundMode: false, |
| | | scaleLine: null, |
| | | Excavation: false, |
| | | entityaLayers: [], |
| | | isMenuFlag: null, |
| | | }; |
| | | }, |
| | | methods: { |
| | | //二級菜单点击切换 |
| | | setChangeTwoMenu(res) { |
| | | this.showTwoMenuFlag = res.id; |
| | | this.$store.state.mapMenuBoolean = false; |
| | | this.$store.state.mapMenuBoxFlag = null; |
| | | this.$store.state.mapPopBoolean = false; |
| | | this.$store.state.mapPopBoxFlag = null; |
| | | var val = res.id[0]; |
| | | if (window.model != null) { |
| | | window.model.deleteObject(); |
| | | window.model = null; |
| | | } |
| | | sgworld.Analysis.clearCurtainContrast(); |
| | | if (this.isMenuFlag == "d") { |
| | | this.clearAllAnalsy(); |
| | | } |
| | | if (this.isMenuFlag !=val) { |
| | | sgworld.Creator.SimpleGraphic.clear(); |
| | | this.isMenuFlag = val; |
| | | if (this.entityaLayers.length != 0) { |
| | | for (var i in this.entityaLayers) { |
| | | sgworld.Viewer.entities.remove(this.entityaLayers[i]); |
| | | } |
| | | this.entityaLayers = []; |
| | | } |
| | | for (var i in this.$store.state.queryInfo) { |
| | | sgworld.Viewer.entities.remove(this.$store.state.queryInfo[i]); |
| | | } |
| | | this.$store.state.queryInfo = []; |
| | | if (this.$store.state.primitLayer != null) { |
| | | sgworld.Viewer.entities.remove(this.$store.state.primitLayer); |
| | | sgworld.Creator.DeleteObject(this.$store.state.primitLayer); |
| | | this.$store.state.primitLayer = null; |
| | | } |
| | | } |
| | | this.showTwoMenuFlag = res.id; |
| | | |
| | | switch (val) { |
| | | |
| | | |
| | | |
| | | case 'a': //图层管理 |
| | | |
| | | this.setCoverage(res.id); |
| | | break; |
| | | case 'b': |
| | |
| | | sgworld.Creator.SimpleGraphic.edit(true, { editProp: true }); |
| | | this.setPlot(res.id); |
| | | break; |
| | | |
| | | } |
| | | }, |
| | | setPlot(res) { |
| | |
| | | sgworld.Creator.createSimpleGraphic( |
| | | 'point', |
| | | {}, |
| | | function (entity) {} |
| | | function (entity) { } |
| | | ); |
| | | break; |
| | | case 'h2': |
| | | sgworld.Creator.createSimpleGraphic( |
| | | 'polyline', |
| | | {}, |
| | | function (entity) {} |
| | | function (entity) { } |
| | | ); |
| | | break; |
| | | case 'h3': |
| | | sgworld.Creator.createSimpleGraphic( |
| | | 'rectangle', |
| | | {}, |
| | | function (entity) {} |
| | | function (entity) { } |
| | | ); |
| | | break; |
| | | case 'h4': |
| | | sgworld.Creator.createSimpleGraphic( |
| | | 'polygon', |
| | | {}, |
| | | function (entity) {} |
| | | function (entity) { } |
| | | ); |
| | | break; |
| | | case 'h5': |
| | |
| | | case 'h6': |
| | | this.handleSaveClick(); |
| | | break; |
| | | case 'h9': |
| | | // this.handleOpenShp(); |
| | | $("#shpFile").click(); |
| | | break; |
| | | case 'h10': |
| | | this.handleSaveShp(); |
| | | break; |
| | | case 'h7': |
| | | sgworld.Creator.SimpleGraphic.clear(); |
| | | for (var i in this.entityaLayers) { |
| | | sgworld.Viewer.entities.remove(this.entityaLayers[i]); |
| | | } |
| | | this.entityaLayers = []; |
| | | break; |
| | | case 'h8': |
| | | sgworld.Creator.createSimpleGraphic('label', {}, function (entity) { |
| | | |
| | | }); |
| | | break; |
| | | } |
| | | }, |
| | |
| | | alert('当前场景没有entities实体'); |
| | | } |
| | | }, |
| | | handleSaveShp() { |
| | | |
| | | var entities = sgworld.Viewer.entities.values; |
| | | if (entities.length == 0) { |
| | | return; |
| | | } |
| | | var std = []; |
| | | for (var i in entities) { |
| | | var type, fillColor, alpha, wkt, name; |
| | | var bak = {} |
| | | |
| | | if (entities[i].name) { |
| | | |
| | | name = entities[i].name |
| | | } |
| | | if (entities[i].properties) { |
| | | |
| | | var properties = entities[i].properties.propertyNames; |
| | | for (var j in properties) { |
| | | bak[properties[j]] = entities[i].properties[properties[j]]._value; |
| | | } |
| | | } else { |
| | | bak = { |
| | | "name": entities[i].name |
| | | } |
| | | } |
| | | if (entities[i].rectangle) {//矩形 |
| | | type = 'rectangle' |
| | | var east = Cesium.Math.toDegrees(entities[i].rectangle.coordinates.getValue().east); |
| | | var north = Cesium.Math.toDegrees(entities[i].rectangle.coordinates.getValue().north); |
| | | var west = Cesium.Math.toDegrees(entities[i].rectangle.coordinates.getValue().west); |
| | | var south = Cesium.Math.toDegrees(entities[i].rectangle.coordinates.getValue().south); |
| | | var line = turf.polygon([[[east, north], [west, north], [west, south], [east, south], [east, north]]]) |
| | | wkt = this.$wkt.convert(line.geometry) |
| | | var fill = entities[i].rectangle._material._color._value; |
| | | fillColor = fill.red + ',' + fill.green + ',' + fill.blue; |
| | | alpha = fill.alpha; |
| | | } else if (entities[i].point) {//点 |
| | | type = 'point' |
| | | let ellipsoid = Viewer.scene.globe.ellipsoid; |
| | | let cartographic = ellipsoid.cartesianToCartographic(entities[i].position.getValue()); |
| | | let lat = Cesium.Math.toDegrees(cartographic.latitude); |
| | | let lng = Cesium.Math.toDegrees(cartographic.longitude); |
| | | let alt = cartographic.height; |
| | | let point = turf.point([lng, lat, alt]) |
| | | wkt = this.$wkt.convert(point.geometry) |
| | | var fill = entities[i].point._color._value; |
| | | fillColor = fill.red + ',' + fill.green + ',' + fill.blue; |
| | | alpha = fill.alpha; |
| | | |
| | | |
| | | } else if (entities[i].polygon) { |
| | | type = 'polygon'; |
| | | var fill = entities[i].polygon._material._color._value; |
| | | fillColor = fill.red + ',' + fill.green + ',' + fill.blue; |
| | | alpha = fill.alpha; |
| | | var geometry = entities[i].polygon.hierarchy.getValue().positions; |
| | | var coordinates = []; |
| | | for (var k in geometry) { |
| | | coordinates.push(this.setCartesianToEightFour(geometry[k])) |
| | | } |
| | | if (coordinates[0] != coordinates[1]) { |
| | | coordinates.push(coordinates[0]) |
| | | } |
| | | var polygon = turf.polygon([coordinates]) |
| | | wkt = this.$wkt.convert(polygon.geometry) |
| | | } else if (entities[i].polyline) { |
| | | type = "polyline"; |
| | | var coordinates = []; |
| | | var geometry = entities[i].polyline.positions.getValue(); |
| | | for (var k in geometry) { |
| | | coordinates.push(this.setCartesianToEightFour(geometry[k])) |
| | | } |
| | | var polyline = turf.lineString(coordinates) |
| | | wkt = this.$wkt.convert(polyline.geometry) |
| | | |
| | | var fill = entities[i].polyline._material._color._value; |
| | | fillColor = fill.red + ',' + fill.green + ',' + fill.blue; |
| | | alpha = fill.alpha; |
| | | } else if (entities[i].label) { |
| | | type = "label"; |
| | | let ellipsoid = Viewer.scene.globe.ellipsoid; |
| | | let cartographic = ellipsoid.cartesianToCartographic(entities[i].position.getValue()); |
| | | let lat = Cesium.Math.toDegrees(cartographic.latitude); |
| | | let lng = Cesium.Math.toDegrees(cartographic.longitude); |
| | | let alt = cartographic.height; |
| | | let point = turf.point([lng, lat, alt]) |
| | | wkt = this.$wkt.convert(point.geometry) |
| | | var fill = entities[i].label.backgroundColor._value; |
| | | fillColor = fill.red + ',' + fill.green + ',' + fill.blue; |
| | | alpha = fill.alpha; |
| | | } |
| | | std.push({ |
| | | id: parseInt(i) + 1, |
| | | type: type, |
| | | fillColor: fillColor, |
| | | opacity: alpha, |
| | | name: name, |
| | | bak: JSON.stringify(bak), |
| | | wkt: wkt |
| | | }) |
| | | } |
| | | $.ajax({ |
| | | url: BASE_URL + "/comprehensive/downloadShp?token=" + getToken(), |
| | | type: "POST", |
| | | data: JSON.stringify(std), |
| | | dataType: 'json', // html、json、jsonp、script、text |
| | | contentType: "application/json", // "application/x-www-form-urlencoded" |
| | | success: (rs) => { |
| | | if (rs && rs.code == 200) { |
| | | var a = document.createElement('a'); // 创建一个a标签元素 |
| | | a.style.display = 'none'; // 设置元素不可见 |
| | | |
| | | a.href = BASE_URL + "/comprehensive/downloadFile?token=" + getToken() + "&guid=" + rs.result; |
| | | |
| | | document.body.appendChild(a); // 加入 |
| | | a.click(); // 触发点击,下载 |
| | | document.body.removeChild(a); // 释放 |
| | | } |
| | | }, |
| | | error: function (e) { |
| | | } |
| | | }); |
| | | |
| | | }, |
| | | handleOpenShp() { |
| | | var formData = new FormData(); |
| | | var fs = document.getElementById("shpFile"); |
| | | var exts = [".shp", ".shx", ".dbf", ".prj"]; |
| | | var count = 0; |
| | | for (var i = 0, c = fs.files.length; i < c; i++) { |
| | | var name = fs.files[i].name.toLocaleLowerCase(); |
| | | var ext = name.substring(name.lastIndexOf(".")); |
| | | if (exts.indexOf(ext) > -1) { |
| | | count++; |
| | | formData.append(fs.files[i].name, fs.files[i]); // fs.files[i].name,file |
| | | } |
| | | } |
| | | if (count != 4) { |
| | | alert("ShapeFile文件选择不全!"); |
| | | return; |
| | | } |
| | | var that = this; |
| | | $.ajax(BASE_URL + "/comprehensive/uploadShp?token=" + getToken(), { |
| | | type: "post", |
| | | data: formData, |
| | | async: true, |
| | | cache: false, |
| | | processData: false, |
| | | contentType: false, |
| | | success: function (rs) { |
| | | |
| | | if (rs.code == 200) { |
| | | that.showShpEntity(rs.result); |
| | | } |
| | | }, |
| | | error: function (e) { |
| | | console.error(e); |
| | | } |
| | | }); |
| | | |
| | | document.getElementById("shpFile").value = "" |
| | | |
| | | }, |
| | | showShpEntity(res) { |
| | | |
| | | for (var i in res) { |
| | | var wkt = this.$wkt.parse(res[i].wkt); |
| | | var fillColor = res[i].fillColor.split(","); |
| | | var color = new Cesium.Color(parseFloat(fillColor[0]), parseFloat(fillColor[1]), parseFloat(fillColor[2]), res[i].opacity); |
| | | var name = res[i].name |
| | | switch (res[i].type) { |
| | | case 'rectangle': |
| | | case 'polygon': |
| | | |
| | | var std = []; |
| | | var geo = wkt.coordinates[0]; |
| | | for (var i in geo) { |
| | | std.push(geo[i][0]) |
| | | std.push(geo[i][1]) |
| | | } |
| | | var entity = Viewer.entities.add({ |
| | | name: name, |
| | | polygon: { |
| | | hierarchy: Cesium.Cartesian3.fromDegreesArray(std), |
| | | //height : 100000, |
| | | material: color, |
| | | outline: true, |
| | | outlineColor: color, |
| | | } |
| | | }) |
| | | this.entityaLayers.push(entity) |
| | | break; |
| | | case 'point': |
| | | let point = Viewer.entities.add({ |
| | | name: name, |
| | | position: Cesium.Cartesian3.fromDegrees(wkt.coordinates[0], wkt.coordinates[1]), //经纬度转世界坐标 |
| | | point: { |
| | | show: true, |
| | | color: color, |
| | | pixelSize: 10, |
| | | outlineColor: color, |
| | | outlineWidth: 3, |
| | | heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, |
| | | disableDepthTestDistance: Number.POSITIVE_INFINITY, |
| | | }, |
| | | }); |
| | | |
| | | this.entityaLayers.push(point) |
| | | break; |
| | | case 'polyline': |
| | | var std = []; |
| | | var geo = wkt.coordinates; |
| | | for (var i in geo) { |
| | | std.push(geo[i][0]) |
| | | std.push(geo[i][1]) |
| | | } |
| | | let line = Viewer.entities.add({ |
| | | name: name, |
| | | polyline: { |
| | | //经纬度数组转世界坐标,带高度的话是fromDegreesArrayHeights |
| | | positions: Cesium.Cartesian3.fromDegreesArray(std), |
| | | width: 10, |
| | | material: color, |
| | | clampToGround: true, |
| | | } |
| | | }) |
| | | |
| | | this.entityaLayers.push(line) |
| | | break; |
| | | case 'label': |
| | | const label = Viewer.entities.add({ |
| | | position: Cesium.Cartesian3.fromDegrees(wkt.coordinates[0], wkt.coordinates[1]), |
| | | label: { |
| | | text: name, |
| | | fillColor: color, |
| | | font: '28px', |
| | | horizontalOrigin: Cesium.HorizontalOrigin.CENTER, |
| | | verticalOrigin: Cesium.VerticalOrigin.TOP, |
| | | heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, |
| | | disableDepthTestDistance: Number.POSITIVE_INFINITY, |
| | | }, |
| | | }) |
| | | this.entityaLayers.push(label) |
| | | break; |
| | | } |
| | | } |
| | | }, |
| | | |
| | | setCartesianToEightFour(res) { |
| | | var std = []; |
| | | let ellipsoid = Viewer.scene.globe.ellipsoid; |
| | | let cartographic = ellipsoid.cartesianToCartographic(res); |
| | | let lat = Cesium.Math.toDegrees(cartographic.latitude); |
| | | let lng = Cesium.Math.toDegrees(cartographic.longitude); |
| | | let alt = cartographic.height; |
| | | std = [lng, lat, alt] |
| | | return std; |
| | | }, |
| | | handleOpenClick() { |
| | | // let that = this; |
| | | var that = this; |
| | | sgworld.Creator.SimpleGraphic.edit(true, { editProp: true }); |
| | | let fileInput = document.querySelector('.file'); |
| | | fileInput.onchange = function (evt) { |
| | | let files = evt.target.files; |
| | | if (files.length > 0) { |
| | | let file = evt.target.files[0]; |
| | | |
| | | let fileReader = new FileReader(); |
| | | fileReader.readAsDataURL(file); |
| | | fileReader.onload = () => { |
| | | sgworld.Viewer.dataSources |
| | | .add( |
| | | Cesium.KmlDataSource.load(fileReader.result, { |
| | | camera: sgworld.Viewer.scene.camera, |
| | | canvas: sgworld.Viewer.scene.canvas, |
| | | }) |
| | | ) |
| | | .then((KmlDataSource) => { |
| | | console.log(KmlDataSource); |
| | | // let entities = kmlDataSource.entities; |
| | | }); |
| | | var kmlOptions = { |
| | | camera: sgworld.Viewer.scene.camera, |
| | | canvas: sgworld.Viewer.scene.canvas, |
| | | clampToGround: true, |
| | | }; |
| | | var geocachePromise = Cesium.KmlDataSource.load( |
| | | fileReader.result, |
| | | kmlOptions |
| | | ); |
| | | |
| | | geocachePromise.then(function (dataSource) { |
| | | var geocacheEntities = dataSource.entities.values; |
| | | that.entityaLayers = geocacheEntities; |
| | | for (var i = 0; i < geocacheEntities.length; i++) { |
| | | var entity = geocacheEntities[i]; |
| | | |
| | | sgworld.Viewer.entities.add(entity); |
| | | } |
| | | }); |
| | | // sgworld.Viewer.dataSources |
| | | // .add( |
| | | // Cesium.KmlDataSource.load(fileReader.result, { |
| | | // camera: sgworld.Viewer.scene.camera, |
| | | // canvas: sgworld.Viewer.scene.canvas, |
| | | // }) |
| | | // ) |
| | | // .then((KmlDataSource) => { |
| | | // console.log(KmlDataSource); |
| | | // // let entities = kmlDataSource.entities; |
| | | // }); |
| | | }; |
| | | } |
| | | // fileInput.value = null; |
| | | }; |
| | | fileInput.click(); |
| | | }, |
| | | setLayerScene() { |
| | | |
| | | var URL = window.location.href.split("#"); |
| | | this.openwindow({ url: URL[0] + 'LfSKyline/index.html' }); |
| | | }, |
| | | |
| | | openwindow(data) { |
| | | var url = data.url; //转向网页的地址; |
| | | var name = data.title || '选择要添加的页面'; //网页名称,可为空; |
| | | var iWidth = window.screen.width; //弹出窗口的宽度; |
| | | var iHeight = window.screen.height; //弹出窗口的高度; |
| | | var iTop = 0 //获得窗口的垂直位置; |
| | | var iLeft = 0; //获得窗口的水平位置; |
| | | window.open(url, name, 'height=' + iHeight + ',,innerHeight=' + iHeight + ',width=' + iWidth + ',innerWidth=' + iWidth + ',top=' + iTop + ',left=' + iLeft + ',toolbar=no,menubar=no,scrollbars=auto,resizeable=no,location=no,status=no'); |
| | | }, |
| | | |
| | | |
| | | |
| | | setMeasurement(res) { |
| | | switch (res) { |
| | | case 'j1': |
| | |
| | | (data) => { |
| | | data.id = window.sgworld.Core.getuid(); |
| | | this.measureData.set(data.id, measure); |
| | | this.openMeasureResultInfo('水平距离', data); |
| | | this.openMeasureResultInfo('表面距离', data); |
| | | } |
| | | ); |
| | | break; |
| | |
| | | } |
| | | ); |
| | | break; |
| | | case 'j3': |
| | | var measure = window.sgworld.Command.execute( |
| | | 1, |
| | | 11, |
| | | this.colorAll, |
| | | (data) => { |
| | | data.id = window.sgworld.Core.getuid(); |
| | | this.measureData.set(data.id, measure); |
| | | this.openMeasureResultInfo('海拔高度', data); |
| | | } |
| | | ); |
| | | break; |
| | | // case 'j3': |
| | | |
| | | // var measure = window.sgworld.Command.execute(0, 3, this.colorAll, (data) => { |
| | | // data.id = window.sgworld.Core.getuid(); |
| | | // this.measureData.set(data.id, measure); |
| | | // this.openMeasureResultInfo('平面面积', data); |
| | | |
| | | |
| | | // }); |
| | | |
| | | // break; |
| | | case 'j2': |
| | | var measure = window.sgworld.Command.execute( |
| | | 0, |
| | |
| | | 'auto', |
| | | (data) => { |
| | | if (volumetricMeasurementTool.popupData) { |
| | | volumetricMeasurementTool.popupData.value = `填方:${ |
| | | data.volume.fill.toFixed(4) + data.unit.fill |
| | | }<br>挖方:${data.volume.dig.toFixed(4) + data.unit.dig}`; |
| | | volumetricMeasurementTool.popupData.value = `填方:${data.volume.fill.toFixed(4) + data.unit.fill |
| | | }<br>挖方:${data.volume.dig.toFixed(4) + data.unit.dig}`; |
| | | } else { |
| | | data.id = window.sgworld.Core.getuid(); |
| | | this.measureData.set(data.id, volumetricMeasurementTool); |
| | |
| | | } |
| | | ); |
| | | break; |
| | | case "j7": |
| | | var measure = window.sgworld.Command.execute( |
| | | 1, |
| | | 11, |
| | | this.colorAll, |
| | | data => { |
| | | data.id = window.sgworld.Core.getuid() |
| | | this.measureData.set(data.id, measure) |
| | | this.openMeasureResultInfo("海拔高度", data) |
| | | } |
| | | ) |
| | | break |
| | | } |
| | | }, |
| | | openMeasureResultInfo(name, data) { |
| | | let info = ''; |
| | | switch (name) { |
| | | case '水平距离': |
| | | case '表面距离': |
| | | case '空间距离': |
| | | info = '总长度:' + data.distance[data.distance.length - 1]; |
| | | break; |
| | | case '海拔高度': |
| | | info = '海拔:' + data.height; |
| | | info = '高度:' + data.height; |
| | | break; |
| | | case '垂直高度': |
| | | info = `${data.gddistance}<br>${data.kjdistance}<br>${data.spdistance}`; |
| | |
| | | }); |
| | | break; |
| | | case '体积方量': |
| | | info = `填方:${ |
| | | data.volume.fill.toFixed(4) + data.unit.fill |
| | | }<br>挖方:${data.volume.dig.toFixed(4) + data.unit.dig}`; |
| | | info = `填方:${data.volume.fill.toFixed(4) + data.unit.fill |
| | | }<br>挖方:${data.volume.dig.toFixed(4) + data.unit.dig}`; |
| | | break; |
| | | } |
| | | return ( |
| | |
| | | break; |
| | | } |
| | | }, |
| | | clearAllAnalsy() { |
| | | // switch (this.showTwoMenuFlag) { |
| | | // case 'd1': |
| | | // that.isolineFlag = false; |
| | | // elevationTool.tf = that.isolineFlag; |
| | | // elevationTool.render(); |
| | | // break; |
| | | // case 'd2': |
| | | // that.isslopeFlag = false; |
| | | // elevationTool.type = 'none'; |
| | | // elevationTool.render(); |
| | | // break; |
| | | // } |
| | | }, |
| | | |
| | | |
| | | |
| | | setAnalsy(res) { |
| | | //this.$refs && this.$refs.queryinfo && this.$refs.queryinfo.close("queryinfo"); |
| | | var that = this; |
| | | switch (res) { |
| | | case 'd1': |
| | |
| | | break; |
| | | case 'd2': |
| | | that.isslopeFlag = !that.isslopeFlag; |
| | | window.PDelevationTool= new SmartEarth.ElevationTool(sgworld);//全局变量 |
| | | if (that.isslopeFlag == true) { |
| | | elevationTool.type = 'slope'; |
| | | PDelevationTool.type = 'slope'; |
| | | PDelevationTool.tf = this.checked; |
| | | } else { |
| | | elevationTool.type = 'none'; |
| | | PDelevationTool.type = 'none'; |
| | | } |
| | | elevationTool.render(); |
| | | PDelevationTool.render(); |
| | | break; |
| | | case 'd3': |
| | | var value = { |
| | |
| | | 'auto', |
| | | (data) => { |
| | | if (volumetricMeasurementTool.popupData) { |
| | | volumetricMeasurementTool.popupData.value = `填方:${ |
| | | data.volume.fill.toFixed(4) + data.unit.fill |
| | | }<br>挖方:${data.volume.dig.toFixed(4) + data.unit.dig}`; |
| | | volumetricMeasurementTool.popupData.value = `填方:${data.volume.fill.toFixed(4) + data.unit.fill |
| | | }<br>挖方:${data.volume.dig.toFixed(4) + data.unit.dig}`; |
| | | } else { |
| | | data.id = sgworld.Core.getuid(); |
| | | this.measureData.set(data.id, volumetricMeasurementTool); |
| | |
| | | } |
| | | ); |
| | | break; |
| | | case 'd10': |
| | | if (window.TerrainFlattening) { |
| | | window.TerrainFlattening.remove(); |
| | | window.TerrainFlattening = null; |
| | | } else { |
| | | sgworld.Creator.createSimpleGraphic( |
| | | 'polygon', |
| | | { |
| | | clampToGround: true, |
| | | }, |
| | | function (entity) { |
| | | var positions = entity.polygon.hierarchy.getValue().positions; |
| | | sgworld.Creator.SimpleGraphic.remove(entity.id); |
| | | window.TerrainFlattening = |
| | | sgworld.Creator.createTerrainModifier( |
| | | '地形压平', |
| | | positions, |
| | | 10, |
| | | {} |
| | | ); |
| | | case 'd7': |
| | | var that = this; |
| | | window.model = sgworld.Creator.create3DTilesets( |
| | | '', |
| | | modelUrl+'/SN/tileset.json', |
| | | {}, |
| | | {}, |
| | | '0', |
| | | true, |
| | | (data) => { |
| | | sgworld.Navigate.flyToObj(data); |
| | | that.setclippingModel(); |
| | | } |
| | | ); |
| | | break; |
| | | case 'd9': |
| | | this.$refs && this.$refs.queryinfo && this.$refs.queryinfo.close("queryinfo"); |
| | | this.$store.state.mapPopBoxFlag = '3'; |
| | | |
| | | this.$refs && this.$refs.queryinfo && this.$refs.queryinfo.open("管道空间分析", null, { |
| | | close: () => { |
| | | if (this.$store.state.pipelineEntity.length != 0) { |
| | | for (var i in this.$store.state.pipelineEntity) { |
| | | var item = this.$store.state.pipelineEntity[i] |
| | | sgworld.Viewer.entities.remove(item); |
| | | } |
| | | } |
| | | ); |
| | | } |
| | | }); |
| | | break; |
| | | case 'd8': |
| | | if (this.isContrastFlag == false) { |
| | | this.isContrastFlag = true; |
| | | sgworld.Analysis.createCurtainContrast(2, 1); |
| | | } else { |
| | | this.isContrastFlag = false; |
| | | sgworld.Analysis.clearCurtainContrast(); |
| | | } |
| | | break; |
| | | case 'd10': |
| | | |
| | | if(window.DXTerrainFlattening!=null){ |
| | | DXTerrainFlattening.remove(); |
| | | } |
| | | sgworld.Creator.createSimpleGraphic( |
| | | 'polygon', |
| | | { |
| | | clampToGround: true, |
| | | }, |
| | | function (entity) { |
| | | let positions = entity.polygon.hierarchy.getValue().positions; |
| | | console.log(positions); |
| | | sgworld.Creator.SimpleGraphic.remove(entity.id); |
| | | |
| | | window.DXTerrainFlattening = sgworld.Creator.createTerrainModifier("地形压平", positions, 10, {}); |
| | | } |
| | | ); |
| | | break; |
| | | |
| | | case 'd11': |
| | | if (window.Excavation) { |
| | | window.Excavation.clear(); |
| | |
| | | window.Excavation = sgworld.Analysis.TerrainExcavation( |
| | | 10, |
| | | {}, |
| | | function () {} |
| | | function () { } |
| | | ); |
| | | } |
| | | break; |
| | | |
| | | case "d12": |
| | | if (window.TSExcavation!=null) { |
| | | window.TSExcavation.deleteObject() |
| | | window.TSExcavation = null |
| | | } else { |
| | | window.TSExcavation = sgworld.Analysis.createSightLine({ |
| | | type: "default", |
| | | }) |
| | | } |
| | | break |
| | | case "d13": |
| | | if (this.Excavation) { |
| | | this.Excavation.destroy() |
| | | this.Excavation = null |
| | | } else { |
| | | this.Excavation = sgworld.Analysis.create3DViewshedPoss({ |
| | | height: 1.8, |
| | | }) |
| | | } |
| | | break |
| | | case "d14": |
| | | if (window.Excavation) { |
| | | window.Excavation.close() |
| | | window.Excavation = null |
| | | } else { |
| | | var SYFX_visible_color = { r: 0.0, g: 1.0, b: 0.0 }, |
| | | SYFX_notVisible_color = { r: 1.0, g: 0.0, b: 0.0 } |
| | | window.Excavation = sgworld.Analysis.create3DViewshed({ |
| | | name: "Viewshed On Frederick", |
| | | height: 1.8, |
| | | color: { |
| | | Back: SYFX_notVisible_color, |
| | | Fore: SYFX_visible_color, |
| | | }, |
| | | isSpherical: "spherical", |
| | | }) |
| | | } |
| | | |
| | | break |
| | | |
| | | |
| | | } |
| | | }, |
| | | setclippingModel() { |
| | | if (window.model) { |
| | | setTimeout(() => { |
| | | window.model.clippingModel({ |
| | | direction: 'z', |
| | | }); |
| | | }, 1000); |
| | | // window.model.clippingModel({ |
| | | // direction: 'z', |
| | | // }); |
| | | } |
| | | }, |
| | | clear(res) { |
| | |
| | | 2, |
| | | 2, |
| | | method, |
| | | (value) => {} |
| | | (value) => { } |
| | | ); |
| | | }, |
| | | |
| | | addterrainSectionAnalysis() { |
| | | window.AnalysisDXPM = sgworld.Command.execute( |
| | | 2, |
| | |
| | | { cyjj: 50, objid: 0 }, |
| | | (Distance) => { |
| | | if (Distance.gcs && Distance.gcs.length) { |
| | | var url = window.location.href; |
| | | var testurl = ''; |
| | | if (url.indexOf('web') != -1) { |
| | | testurl = '/web'; |
| | | } |
| | | window.AnalysisDXPM.analyseData = Distance; |
| | | this.dxpmIndex = layer.open({ |
| | | type: 2, |
| | |
| | | area: ['80%', '280px'], |
| | | offset: 'b', |
| | | skin: 'other-class', |
| | | content: '/SmartEarthSDK/Workers/analysis/AnalysisDXPM.html', |
| | | content: testurl + '/SmartEarthSDK/Workers/analysis/AnalysisDXPM.html', |
| | | end: () => { |
| | | this.dxpmIndex && this.clear('d4'); |
| | | }, |
| | |
| | | case 'b7': //比例尺 |
| | | this.isRuler = !this.isRuler; |
| | | window.sgworld.navControl('scale', this.isRuler); |
| | | if (this.isRuler == true) { |
| | | this.scaleLine = new ScaleLine({ |
| | | units: "metric" |
| | | }); |
| | | window.map.addControl(this.scaleLine); |
| | | } else { |
| | | |
| | | window.map.removeControl(this.scaleLine); |
| | | this.scaleLine = false; |
| | | } |
| | | break; |
| | | case 'b8': //指北针 |
| | | this.isNaviget = !this.isNaviget; |
| | | window.sgworld.navControl('nav', this.isNaviget); |
| | | this.$store.state.isNaviget = this.isNaviget |
| | | break; |
| | | case 'b9': //地下模式 |
| | | this.UndergroundMode = !this.UndergroundMode; |
| | | window.sgworld.Analysis.UndergroundMode(this.UndergroundMode, 0.3) |
| | | break; |
| | | } |
| | | }, |
| | | setCoverage(res) { |
| | | switch (res) { |
| | | case 'a1': |
| | | if (this.$store.state.layerMnage == false) { |
| | | this.$refs && this.$refs.maplayer && this.$refs.maplayer.closeAll(); |
| | | this.$refs && this.$refs.maplayer && this.$refs.maplayer.open(); |
| | | this.$store.state.layerMnage = true; |
| | | } else if (this.$store.state.layerMnage == true) { |
| | | this.$bus.$emit("treeDataCopy","true"); |
| | | this.$refs && this.$refs.maplayer && this.$refs.maplayer.closeAll(); |
| | | this.$store.state.layerMnage = false; |
| | | |
| | | } |
| | | |
| | | break; |
| | | } |
| | | }, |
| | |
| | | polygon: Cesium.Color.fromCssColorString('#ffff00').withAlpha(0.6), |
| | | }; |
| | | this.$bus.$on('setChangeTwoMenu', (res) => { |
| | | this.menuChange(res); |
| | | |
| | | if (res == 8) { this.setLayerScene(); } else { |
| | | this.menuChange(res); |
| | | } |
| | | |
| | | }); |
| | | |
| | | this.$store.state.showAllLayers = true; |
| | | this.$store.state.layerMnage = false; |
| | | this.$store.state.treeData = null; |
| | | this.$store.state.checkedKeys = []; |
| | | this.setCoverage('a1'); |
| | | }, |
| | | }; |
| | | </script> |
| | |
| | | .menu_Box { |
| | | width: 100%; |
| | | height: 100%; |
| | | |
| | | margin: 0; |
| | | padding: 0; |
| | | overflow-y: auto; |
| | | text-align: center; |
| | | // text-align: center; |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | align-content: flex-start; |
| | |
| | | font-size: 16px; |
| | | font-family: Microsoft YaHei; |
| | | font-weight: 400; |
| | | color: #ffffff; |
| | | border: 1px solid rgba(0, 0, 0, 0); |
| | | padding: 10px; |
| | | min-width: 100px; |
| | | margin-left: 10px; |
| | | margin-top: 10px; |
| | | border-radius: 5px; |
| | | text-align: center; |
| | | } |
| | | .leftMen_div:hover { |
| | | background: linear-gradient(180deg, #002992, #080472); |
| | | border: 1px solid #000000; |
| | | box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.21); |
| | | background: rgba(64, 158, 255, 0.4); |
| | | border: 1px solid #409eff; |
| | | box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1); |
| | | border-radius: 5px; |
| | | } |
| | | .lefMenuDivActive { |
| | | background: linear-gradient(180deg, #002992, #080472); |
| | | background: rgba(64, 158, 255, 0.4); |
| | | border: 1px solid #409eff; |
| | | } |
| | | .menuTwoImage { |
| | | width: 32px; |
| | | height: 32px; |
| | | width: 40px; |
| | | height: 40px; |
| | | display: inline-block; |
| | | } |
| | | |
| | | .twoMenu_imge11 { |
| | | background: url('../../assets/img/synthesis/图层 32.png') no-repeat center; |
| | | } |
| | | .twoMenu_imge12 { |
| | | background: url('../../assets/img/synthesis/图层 35.png') no-repeat center; |
| | | } |
| | | .twoMenu_imge13 { |
| | | background: url('../../assets/img/synthesis/发布.png') no-repeat center; |
| | | } |
| | | //视图 |
| | | .twoMenu_imge21 { |
| | | background: url('../../assets/img/synthesis/圆角矩形 12 拷贝 3.png') |
| | | no-repeat center; |
| | | } |
| | | .twoMenu_imge22 { |
| | | background: url('../../assets/img/synthesis/图层 10 拷贝.png') no-repeat |
| | | center; |
| | | } |
| | | .twoMenu_imge23 { |
| | | background: url('../../assets/img/synthesis/图层 11 拷贝.png') no-repeat |
| | | center; |
| | | } |
| | | .twoMenu_imge24 { |
| | | background: url('../../assets/img/synthesis/图层 12 拷贝 2.png') no-repeat |
| | | center; |
| | | } |
| | | .twoMenu_imge25 { |
| | | background: url('../../assets/img/synthesis/圆角矩形 5 拷贝 2.png') |
| | | no-repeat center; |
| | | } |
| | | .twoMenu_imge26 { |
| | | background: url('../../assets/img/synthesis/圆角矩形 5 拷贝 3.png') |
| | | no-repeat center; |
| | | } |
| | | .twoMenu_imge27 { |
| | | background: url('../../assets/img/synthesis/矩形 9.png') no-repeat center; |
| | | } |
| | | .twoMenu_imge28 { |
| | | background: url('../../assets/img/synthesis/椭圆 4.png') no-repeat center; |
| | | } |
| | | //漫游 |
| | | .twoMenu_imge31 { |
| | | background: url('../../assets/img/synthesis/椭圆 6.png') no-repeat center; |
| | | } |
| | | .twoMenu_imge32 { |
| | | background: url('../../assets/img/synthesis/椭圆 7 拷贝 2.png') no-repeat |
| | | center; |
| | | } |
| | | .twoMenu_imge33 { |
| | | background: url('../../assets/img/synthesis/图层 14 副本 拷贝.png') |
| | | no-repeat center; |
| | | } |
| | | .twoMenu_imge34 { |
| | | background: url('../../assets/img/synthesis/图层 74 拷贝 2.png') no-repeat |
| | | center; |
| | | } |
| | | .twoMenu_imge35 { |
| | | background: url('../../assets/img/synthesis/椭圆 7 拷贝 4.png') no-repeat |
| | | center; |
| | | } |
| | | //分析 |
| | | .twoMenu_imge41 { |
| | | background: url('../../assets/img/synthesis/椭圆 8 拷贝 8.png') no-repeat |
| | | center; |
| | | } |
| | | .twoMenu_imge42 { |
| | | background: url('../../assets/img/synthesis/圆角矩形 12 拷贝 5.png') |
| | | no-repeat center; |
| | | } |
| | | .twoMenu_imge43 { |
| | | background: url('../../assets/img/synthesis/圆角矩形 10 副本 3.png') |
| | | no-repeat center; |
| | | } |
| | | .twoMenu_imge44 { |
| | | background: url('../../assets/img/synthesis/图层 74 拷贝 3.png') no-repeat |
| | | center; |
| | | } |
| | | .twoMenu_imge45 { |
| | | background: url('../../assets/img/synthesis/图层 20.png') no-repeat center; |
| | | } |
| | | .twoMenu_imge46 { |
| | | background: url('../../assets/img/synthesis/图层 14 拷贝 3.png') no-repeat |
| | | center; |
| | | } |
| | | .twoMenu_imge47 { |
| | | background: url('../../assets/img/synthesis/图层 18.png') no-repeat center; |
| | | } |
| | | .twoMenu_imge48 { |
| | | background: url('../../assets/img/synthesis/圆角矩形 12 拷贝 6.png') |
| | | no-repeat center; |
| | | } |
| | | .twoMenu_imge49 { |
| | | background: url('../../assets/img/synthesis/管道.png') no-repeat center; |
| | | } |
| | | .twoMenu_imge410 { |
| | | background: url('../../assets/img/synthesis/dxkw.png') no-repeat center; |
| | | } |
| | | .twoMenu_imge411 { |
| | | background: url('../../assets/img/synthesis/矩形 14 拷贝 7.png') no-repeat |
| | | center; |
| | | } |
| | | //查询 |
| | | .twoMenu_imge51 { |
| | | background: url('../../assets/img/synthesis/图层 23.png') no-repeat center; |
| | | } |
| | | .twoMenu_imge52 { |
| | | background: url('../../assets/img/synthesis/空间查询.png') no-repeat center; |
| | | } |
| | | //定位 |
| | | .twoMenu_imge61 { |
| | | background: url('../../assets/img/synthesis/图层 27.png') no-repeat center; |
| | | } |
| | | .twoMenu_imge62 { |
| | | background: url('../../assets/img/synthesis/图层 28.png') no-repeat center; |
| | | } |
| | | //测量 |
| | | .twoMenu_imge71 { |
| | | background: url('../../assets/img/synthesis/图层 31.png') no-repeat center; |
| | | } |
| | | .twoMenu_imge72 { |
| | | background: url('../../assets/img/synthesis/图层 31 拷贝.png') no-repeat |
| | | center; |
| | | } |
| | | .twoMenu_imge73 { |
| | | background: url('../../assets/img/synthesis/矩形 13 拷贝.png') no-repeat |
| | | center; |
| | | } |
| | | .twoMenu_imge74 { |
| | | background: url('../../assets/img/synthesis/图层 18 拷贝.png') no-repeat |
| | | center; |
| | | } |
| | | .twoMenu_imge75 { |
| | | background: url('../../assets/img/synthesis/M 拷贝.png') no-repeat center; |
| | | } |
| | | .twoMenu_imge76 { |
| | | background: url('../../assets/img/synthesis/空间测距.png') no-repeat center; |
| | | } |
| | | //标绘 |
| | | .twoMenu_imge81 { |
| | | background: url('../../assets/img/synthesis/椭圆 5 拷贝 3.png') no-repeat |
| | | center; |
| | | } |
| | | .twoMenu_imge82 { |
| | | background: url('../../assets/img/synthesis/椭圆 3 拷贝 16.png') no-repeat |
| | | center; |
| | | } |
| | | .twoMenu_imge83 { |
| | | background: url('../../assets/img/synthesis/椭圆 3 拷贝 20.png') no-repeat |
| | | center; |
| | | } |
| | | .twoMenu_imge84 { |
| | | background: url('../../assets/img/synthesis/椭圆 3 拷贝 23.png') no-repeat |
| | | center; |
| | | } |
| | | .twoMenu_imge85 { |
| | | background: url('../../assets/img/synthesis/导入.png') no-repeat center; |
| | | } |
| | | .twoMenu_imge86 { |
| | | background: url('../../assets/img/synthesis/导出.png') no-repeat center; |
| | | } |
| | | .twoMenu_imge87 { |
| | | background: url('../../assets/img/synthesis/清除.png') no-repeat center; |
| | | } |
| | | } |
| | | </style> |