Commit fd5b0fc0 authored by xxx's avatar xxx

1

parent 9cf6f1ea
......@@ -26,7 +26,9 @@ Vue.prototype.mars3d = mars3d
Vue.prototype.Cesium = mars3d.Cesium
var map;
let pathEntity = null;
//画测距属性
var graphicLayerPolyline;
export default {
name: 'mars3dViewer',
......@@ -183,6 +185,7 @@ export default {
that.addGraphic_02(graphicLayer2,item.arrays,that.carNumber);
})
//停车区域
that.stopPointData.forEach((item,index)=>{
var graphicLayer2 = new mars3d.layer.GraphicLayer();
map.addLayer(graphicLayer2);
......@@ -190,6 +193,11 @@ export default {
that.addDemoGraphic1(graphicLayer2,item.lon,item.lat,item.alarmTime,item.time);
})
//画测距
graphicLayerPolyline = new mars3d.layer.GraphicLayer();
//that.bindLayerContextMenu(graphicLayerPolyline);
map.addLayer(graphicLayerPolyline);
// 抛出事件
this.$emit('onload', map)
},
......@@ -241,6 +249,17 @@ export default {
graphicLayer2.addGraphic(graphic); //还可以另外一种写法: graphic.addTo(graphicLayer)
},
getSampledPositionProperty(points){
let property = new Cesium.SampledPositionProperty();
let start = this.map.clock.currentTime;
let positions = mars3d.LatLngArray.toCartesians(points);
for (let i = 0; i < positions.length; i++) {
let time = Cesium.JulianDate.addSeconds(start, i * 20, new Cesium.JulianDate());
let position = positions[i];
property.addSample(time, position);
}
return property;
},
//停车区域
addDemoGraphic1(graphicLayer,x,y,alarmTime,time) {
const graphic = new mars3d.graphic.CircleEntity({
......@@ -269,18 +288,173 @@ export default {
})
graphicLayer.addGraphic(graphic)
},
getSampledPositionProperty(points){
let property = new Cesium.SampledPositionProperty();
let start = this.map.clock.currentTime;
let positions = mars3d.LatLngArray.toCartesians(points);
for (let i = 0; i < positions.length; i++) {
let time = Cesium.JulianDate.addSeconds(start, i * 20, new Cesium.JulianDate());
let position = positions[i];
property.addSample(time, position);
//测距画线
startDrawGraphic(boo) {
let that = this;
if(boo){
graphicLayerPolyline.startDraw({
type: "polyline",
//maxPointNum: 2, //可以限定最大点数,2个点绘制后自动结束
style: {
color: "#55ff33",
width: 3,
clampToGround: false,
label: {
font_size: 18,
color: "#ffffff",
distanceDisplayCondition: true,
distanceDisplayCondition_far: 500000,
distanceDisplayCondition_near: 0
}
},
success: function (graphic){
for(let i = 0,len = graphic._positions_draw.length;i < len - 1;i++){
//第一个坐标
var cartographic1 = Cesium.Cartographic.fromCartesian(graphic._positions_draw[i]);
var lat1 = Cesium.Math.toDegrees(cartographic1.latitude);
var lon1 = Cesium.Math.toDegrees(cartographic1.longitude);
//第二个坐标
var cartographic2 = Cesium.Cartographic.fromCartesian(graphic._positions_draw[i + 1]);
var lat2 = Cesium.Math.toDegrees(cartographic2.latitude);
var lon2 = Cesium.Math.toDegrees(cartographic2.longitude);
//中间坐标
let position1 = that.getCenterLonLat(lon1,lat1,lon2,lat2);
let distance1 = that.getDistance(lat1,lon1,lat2,lon2);
//添加文字
const graphicLabel = new mars3d.graphic.LabelEntity({
position: position1,
style: {
text: distance1 + '',
font_size: 35,
scale: 0.5,
font_family: "楷体",
color: "#00ffff",
outline: true,
outlineColor: "#000000",
outlineWidth: 2,
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
visibleDepth: false
},
})
graphicLayerPolyline.addGraphic(graphicLabel)
}
}
})
}else{
graphicLayerPolyline.stopDraw();
}
return property;
},
//添加测距画线右键菜单
bindLayerContextMenu(graphicLayer) {
graphicLayer.bindContextMenu([
// {
// text: "开始编辑对象",
// icon: "fa fa-edit",
// show: function (e) {
// const graphic = e.graphic
// if (!graphic || !graphic.hasEdit) {
// return false
// }
// return !graphic.isEditing
// },
// callback: (e) => {
// const graphic = e.graphic
// if (!graphic) {
// return false
// }
// if (graphic) {
// graphicLayer.startEditing(graphic)
// }
// }
// },
// {
// text: "停止编辑对象",
// icon: "fa fa-edit",
// show: function (e) {
// const graphic = e.graphic
// if (!graphic || !graphic.hasEdit) {
// return false
// }
// return graphic.isEditing
// },
// callback: (e) => {
// const graphic = e.graphic
// if (!graphic) {
// return false
// }
// if (graphic) {
// graphic.stopEditing()
// }
// }
// },
{
text: "删除对象",
icon: "fa fa-trash-o",
show: (event) => {
const graphic = event.graphic
if (!graphic || graphic.isDestroy) {
return false
} else {
return true
}
},
callback: (e) => {
const graphic = e.graphic
if (!graphic) {
return
}
const parent = graphic.parent // 右击是编辑点时
graphicLayer.removeGraphic(graphic)
if (parent) {
graphicLayer.removeGraphic(parent)
}
}
},
// {
// text: "计算长度",
// icon: "fa fa-medium",
// callback: (e) => {
// console.log(e);
// const graphic = e.graphic
// const strDis = mars3d.MeasureUtil.formatDistance(graphic.distance)
// alert("该对象的长度为:" + strDis)
// }
// }
])
},
//两个点的经纬度得出中间点的经纬度
getCenterLonLat(oneLon, oneLat, twoLon, twoLat) {
//oneLon:第一个点的经度;oneLat:第一个点的纬度;twoLon:第二个点的经度;twoLat:第二个点的纬度;
let aLon = 0, aLat = 0;
let bLon = Number(oneLon) - Number(twoLon);
let bLat = Number(oneLat) - Number(twoLat);
//Math.abs()绝对值
if( bLon > 0){
aLon = Number(oneLon) - Math.abs(bLon) / 2;
}else{
aLon = Number(twoLon) - Math.abs(bLon) / 2;
}
if( bLat > 0){
aLat = Number(oneLat) - Math.abs(bLat) / 2;
}else{
aLat = Number(twoLat) - Math.abs(bLat) / 2;
}
return [aLon, aLat ,1000];
},
//根据两个经纬度计算距离
getDistance(lat1, lng1, lat2, lng2) {
var radLat1 = lat1 * Math.PI / 180.0;
var radLat2 = lat2 * Math.PI / 180.0;
var a = radLat1 - radLat2;
var b = lng1 * Math.PI / 180.0 - lng2 * Math.PI / 180.0;
var s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) + Math.cos(radLat1) * Math.cos(radLat2) * Math.pow(Math.sin(b / 2), 2)));
s = s * 6378.137 // EARTH_RADIUS;
s = Math.round(s * 10000) / 10;
return s
},
}
}
</script>
......
......@@ -37,9 +37,10 @@
<el-button type="primary" icon="el-icon-search" @click="toSearch" style="display: inline-block;">搜索</el-button>
<el-button icon="el-icon-refresh" @click="clearLimit" style="display: inline-block;">清除所有痕迹</el-button>
<!-- <el-form-item label="测量距离" style="display: inline-block;">
<el-button type="primary" @click="measureDistance()" plain>开测距</el-button>
</el-form-item> -->
<el-form-item label="测量距离" style="display: inline-block;">
<el-button type="primary" @click="measureDistance()" plain :disabled="measureDistanceDis">开测距</el-button>
<el-button type="primary" @click="measureDistanceClose()" plain :disabled="measureDistanceDis">关测距</el-button>
</el-form-item>
<br>
......@@ -100,6 +101,7 @@ export default {
playSpeedNum:5,
tishiTextShow:true,
trajectoryTableData:[],
measureDistanceDis:true,
}
},
mounted() {
......@@ -181,6 +183,7 @@ export default {
//获取列表
HttpReq.truckDispatching.mineAlarmHistoryCountQuery({number:this.query.number,bTime:this.query.bTime,eTime:this.query.eTime}).then((res1) => {
if(res1.code == 200){
this.measureDistanceDis = false;
this.trajectoryTableData = res1.data;
this.shuaxinTimer = new Date().getTime();
that.$refs.mars3dViewerMapMethod.getCoordinate(res.data.content[0].equipmentName,res.data.content[0].number,that.playSpeedNum,that.query.bTime,that.query.eTime,this.trajectoryTableData);
......@@ -212,6 +215,7 @@ export default {
this.tishiTextShow = true;
this.shuaxinTimer = new Date().getTime();
this.$refs.mars3dViewerMapMethod.getCoordinate('','',5,'','',[]);
this.measureDistanceDis = true;
},
//获取数据
loadData() {
......@@ -253,9 +257,13 @@ export default {
})
}
},
//测量距离
//测量距离
measureDistance(){
this.$refs.mars3dViewerMapMethod.startDrawGraphic(true);
},
//关测量距离
measureDistanceClose(){
this.$refs.mars3dViewerMapMethod.startDrawGraphic(false);
},
// 地图构造完成回调
onMapload(map) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment