在昨日基础之上改进之后可以进行正常的编辑了,目前相较于原始的逻辑,缺少点的添加逻辑和删除逻辑;
删除逻辑相对容易,添加的逻辑还需进行研究,因为原始不是每次拉动都会在两点的中间添加一个新的点。
相对上一版本,将处理逻辑放在left_down中。,构造primititive的js文件没有做任何修改;
此外,有一个问题是,每次刷新时,浏览器会异常卡。这也是后续需要解决的一个问题。(解决方法是,在获取geometry时,增加条件判断,只有当首次创建或者移动标志位真时,才需要重新获取geometry)
var viewer = new Cesium.Viewer('cesiumContainer', {
creditContainer: "creditContainer",
TerrainProvider: null,
selectionIndicator: false,
animation: false,
baseLayerPicker: true,
geocoder: false,
timeline: false,
sceneModePicker: true,
navigationHelpButton: false,
infoBox: false,
fullscreenButton: true
});
//取消双击事件
viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);
//设置默认地图源
viewer.baseLayerPicker.viewModel.selectedImagery = viewer.baseLayerPicker.viewModel.imageryProviderViewModels[6];
//设置homebutton的位置
Cesium.Camera.DEFAULT_VIEW_RECTANGLE =
Cesium.Rectangle.fromDegrees(110.15, 34.54, 110.25, 34.56);//Rectangle(west, south, east, north)
//设置初始位置
viewer.camera.setView({
destination: Cesium.Cartesian3.fromDegrees(110.20, 34.55, 3000000)
});
var positionWord = [];
positionWord.push(Cesium.Cartesian3.fromDegrees(110.20, 34.55, 0));
positionWord.push(Cesium.Cartesian3.fromDegrees(115.20, 34.55, 0));
positionWord.push(Cesium.Cartesian3.fromDegrees(115.20, 39.55, 0));
var pr=new changeLinePrimitive({positions: positionWord})
console.log(pr)
viewer.scene.primitives.add(pr);
var editFlag=false
var moveFlag=false//当点击的点是bill时,开始变动primitive
var billEntity=[]//记录添加的折点entity
var handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
var dragId=-1
handler.setInputAction(function(movement) {
var pick = viewer.scene.pick(movement.position);
console.log(pick)
if(pick){
//pick的是bill-有leaf_down来处理逻辑,否则,添加mark
if(pick.id!=null &&pick.id.name=="bill"){
}
else{
editFlag=true
var pos=pick.primitive.geometryInstances.geometry._positions
removeMarkEntity(billEntity)
billEntity=[]
addMark(pos)
dragId=-1
}
}
//没有选中任何实体
else{
removeMarkEntity(billEntity)
initeventParams()
}
},Cesium.ScreenSpaceEventType.LEFT_CLICK);
handler.setInputAction(function(movement) {
if ( moveFlag && dragId!=-1) {
let ray = viewer.camera.getPickRay(movement.endPosition);
let cartesian = viewer.scene.globe.pick(ray, viewer.scene);
pr.positions[dragId]=cartesian
let cartographic = Cesium.Cartographic.fromCartesian(cartesian);
let longitudeString = Cesium.Math.toDegrees(cartographic.longitude).toFixed(3);
let latitudeString = Cesium.Math.toDegrees(cartographic.latitude).toFixed(3);
billEntity[dragId].position=new Cesium.CallbackProperty(function () {
return Cesium.Cartesian3.fromDegrees(longitudeString, latitudeString, 0);
}, false);//防止闪烁,在移动的过程)
}
},Cesium.ScreenSpaceEventType.MOUSE_MOVE);
function initeventParams(){
dragId=-1
billEntity=[]
editFlag=false
moveFlag=false
viewer.scene.screenSpaceCameraController.enableRotate = true;//恢复相机状态
}
handler.setInputAction(function (movement) {
var pick = viewer.scene.pick(movement.position);
if(pick) {
//pick的是bill
if (pick.id != null && pick.id.name == "bill") {
console.log("相机锁定")
dragId = pick.id.id.split("-")[1]
moveFlag = true
viewer.scene.screenSpaceCameraController.enableRotate = false;//锁定相机
}
}
}, Cesium.ScreenSpaceEventType.LEFT_DOWN);
//左键弹起,仅仅标志拖动结束,但仍可能继续编辑
handler.setInputAction(
function (movement) {
moveFlag=false
}, Cesium.ScreenSpaceEventType.LEFT_UP);
function addMark(positions) {
var bill= {
show: true,
pixelOffset: new Cesium.Cartesian2(0, 0),
eyeOffset: new Cesium.Cartesian3(0.0, 0.0, 0.0),
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
verticalOrigin: Cesium.VerticalOrigin.CENTER,
scale: 2.0,
image: "./sampledata/images/dragIcon.png",
color: new Cesium.Color(1.0, 1.0, 1.0, 1.0)
}
var entity
positions.map((v,index) =>{
console.log(index)
var cartesian3=new Cesium.Cartesian3(v.x,v.y,v.z);
var cartographic=viewer.scene.globe.ellipsoid.cartesianToCartographic(cartesian3);
var lat=Cesium.Math.toDegrees(cartographic.latitude);
var lng=Cesium.Math.toDegrees(cartographic.longitude);
var height=Cesium.Math.toDegrees(cartographic.height);
entity=viewer.entities.add({
position: Cesium.Cartesian3.fromDegrees(lng, lat, height),
billboard:bill,
name:"bill",
id:"bill-"+index
})
billEntity.push(entity)
})
}
function removeMarkEntity(entities){
entities.map(v =>{
viewer.entities.remove(v)
})
}