| | |
| | | import parse from "qs/lib/parse"; |
| | | import store from "../../../store"; |
| | | import * as turf from '@turf/turf'; |
| | | const menuGrid = { |
| | | geom: [], |
| | | init() { |
| | | console.log(123) |
| | | var that = this; |
| | | var grid = sgworld.Creator.createSimpleGraphic( |
| | | "rectangle", |
| | | "point", |
| | | { |
| | | // clampToGround: false |
| | | }, entity => { |
| | | |
| | | }, (entity) => { |
| | | var val = that.setCartesianToEightFour(entity.position.getValue()) |
| | | that.geom.push([parseFloat(val.lng), parseFloat(val.lat)]) |
| | | sgworld.Creator.SimpleGraphic.remove(entity.id); |
| | | if (this.geom.length < 2) { |
| | | that.init(); |
| | | } else { |
| | | store.state.isshowGrid = true; |
| | | } |
| | | }) |
| | | }, |
| | | setTurfGrid(res, geom) { |
| | | |
| | | var box = [parseFloat(geom[0][0]), parseFloat(geom[0][1]), parseFloat(geom[1][0]), parseFloat(geom[1][1])] |
| | | this.geom = []; |
| | | var options = { units: "meters" }; |
| | | var squareGrid = turf.squareGrid(box, res.cellSide, options); |
| | | var features = []; |
| | | for (var i = 0; i < squareGrid.features.length; i++) { |
| | | var coord = squareGrid.features[i].geometry.coordinates[0]; |
| | | var coordinates = []; |
| | | for (var j in coord) { |
| | | coordinates.push([coord[j][0], coord[j][1], 18]) |
| | | } |
| | | features.push({ |
| | | "type": "Feature", "properties": { |
| | | "NAME": '新建格网' + (i + 1), |
| | | "bak": '' |
| | | }, |
| | | "geometry": { |
| | | "type": "Polygon", "coordinates": [ |
| | | coordinates |
| | | ] |
| | | } |
| | | }) |
| | | } |
| | | var obj = { |
| | | "type": "FeatureCollection", |
| | | "name": "新建格网", |
| | | "crs": { |
| | | "type": "name", |
| | | "properties": { |
| | | "name": "urn:ogc:def:crs:OGC:1.3:CRS84" |
| | | } |
| | | }, |
| | | "features": features |
| | | } |
| | | this.adddDataSource(obj) |
| | | }, |
| | | |
| | | adddDataSource(res) { |
| | | var data = Cesium.GeoJsonDataSource.load(res, //要加载的 url、GeoJSON 对象或 TopoJSON 对象。 |
| | | { |
| | | stroke: Cesium.Color.RED, //折线和多边形轮廓的默认颜色。 |
| | | fill: Cesium.Color.WHITE.withAlpha(0.2), //多边形内部的默认颜色。 |
| | | strokeWidth: 3, //折线和多边形轮廓的默认宽度。 |
| | | } |
| | | ) |
| | | data.then((dataSource) => { |
| | | Viewer.dataSources.add( |
| | | dataSource |
| | | ); |
| | | }) |
| | | }, |
| | | |
| | | setOtherGrid(res, geom) { |
| | | var maxlon, minlon, maxlat, minlat; |
| | | console.log(geom) |
| | | if (parseFloat(geom[0][0]) > parseFloat(geom[1][0])) { |
| | | maxlon = parseFloat(geom[0][0]); |
| | | minlon = parseFloat(geom[1][0]); |
| | | } else { |
| | | maxlon = parseFloat(geom[1][0]); |
| | | minlon = parseFloat(geom[0][0]); |
| | | } |
| | | if (parseFloat(geom[0][1]) > parseFloat(geom[1][1])) { |
| | | maxlat = geom[0][1]; |
| | | minlat = geom[1][1]; |
| | | } else { |
| | | maxlat = geom[1][1]; |
| | | minlat = geom[0][1]; |
| | | } |
| | | var row = 3; |
| | | var col = 3; |
| | | var lon_dis = (parseFloat(maxlon) - parseFloat(minlon)) / 3; |
| | | var lat_dis = (parseFloat(maxlat) - parseFloat(minlat)) / 3; |
| | | console.log(lon_dis, minlon) |
| | | for (var i = 0; i < col; i++) { |
| | | for (var j = 0; j < row; j++) { |
| | | var startlon = parseFloat(minlon + (j * lon_dis)) |
| | | var startlat = parseFloat(minlat + (i * lat_dis)) |
| | | var endlon = parseFloat(minlon + ((j + 1) * lon_dis)) |
| | | var endlat = parseFloat(minlat + ((i + 1) * lat_dis)) |
| | | var positions = [ |
| | | parseFloat(startlon), parseFloat(startlat), parseFloat(endlon), parseFloat(startlat), |
| | | parseFloat(endlon), parseFloat(endlat), parseFloat(startlon), parseFloat(endlat), parseFloat(startlon), parseFloat(startlat) |
| | | ] |
| | | |
| | | |
| | | Viewer.entities.add({ |
| | | name: "polygon_height", |
| | | polygon: { |
| | | show: true, |
| | | hierarchy: new Cesium.Cartesian3.fromDegreesArray(positions), |
| | | height: 18, |
| | | material: Cesium.Color.CYAN.withAlpha(0.5), |
| | | outline: true, |
| | | outlineColor: Cesium.Color.BLACK, |
| | | } |
| | | }) |
| | | |
| | | |
| | | |
| | | } |
| | | } |
| | | }, |
| | | |
| | | |
| | | setGridRowCol(res) { |
| | | store.state.isshowGrid = false; |
| | | var geom = this.geom; |
| | | // this.setTurfGrid(res,geom) |
| | | this.setOtherGrid(res, geom); |
| | | |
| | | }, |
| | | toFixed(res) { |
| | | return parseFloat(res).toFixed(6) |
| | | }, |
| | | setdistance(start, end) { |
| | | var from = turf.point(start); |
| | | var to = turf.point(end); |
| | | var distance = turf.distance(from, to, { |
| | | units: 'meters' |
| | | }); |
| | | return distance |
| | | }, |
| | | |
| | | |
| | | setCartesianToEightFour(res) { |
| | | var std = {}; |
| | | let ellipsoid = window.Viewer.scene.globe.ellipsoid; |
| | | let cartographic = ellipsoid.cartesianToCartographic(res); |
| | | std.lat = Cesium.Math.toDegrees(cartographic.latitude); |
| | | std.lng = Cesium.Math.toDegrees(cartographic.longitude); |
| | | std.alt = cartographic.height; |
| | | return std; |
| | | } |
| | | } |
| | | export default menuGrid; |