/*
|
* draw tools
|
*/
|
|
(function (window) {
|
'use strict';
|
|
function define_CesiumDraw() {
|
//Main object
|
var CesiumDraw = {};
|
var drawHandler;
|
var pinBuilder = new Cesium.PinBuilder(); //创建cesium pin标签
|
|
/*
|
* options = {
|
* 'viewer':viewer,
|
* 'polygoncolor':Cesium.Color.YELLOW,
|
* 'pointcolor':Cesium.Color.RED,
|
* 'printId':'textid',
|
* 'type':'net',
|
* };
|
* */
|
//绘制多边形面
|
var drawpointArr = [];
|
CesiumDraw.drawPolygon = function (options) {
|
drawpointArr = [];
|
var positions = [];
|
var activeShapePoints = [];
|
var activeShapePointsgeo = [];
|
drawHandler = drawHandler && drawHandler.destroy();
|
drawHandler = new Cesium.ScreenSpaceEventHandler(options.viewer.scene.canvas);
|
drawHandler.setInputAction(function (movement) {
|
var earthPosition = options.viewer.scene.pickPosition(movement.position);
|
var cartographic = Cesium.Cartographic.fromCartesian(earthPosition);
|
var height = cartographic.height; //模型高度
|
if (Number(height) < 0) {
|
var ray = options.viewer.camera.getPickRay(movement.position);
|
earthPosition = options.viewer.scene.globe.pick(ray, options.viewer.scene);
|
cartographic = Cesium.Cartographic.fromCartesian(earthPosition);
|
}
|
var longitudeString = Cesium.Math.toDegrees(cartographic.longitude);
|
var latitudeString = Cesium.Math.toDegrees(cartographic.latitude);
|
var heightString = cartographic.height;
|
if (Cesium.defined(earthPosition)) {
|
activeShapePoints.push(earthPosition);
|
activeShapePointsgeo.push(cartographic);
|
//若做动态预览此处条件为>3
|
if (activeShapePoints.length >= 3) {
|
drawPolygon();
|
}
|
createPoint(earthPosition);
|
}
|
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
drawHandler.setInputAction(function (movement) {
|
var newPosition = options.viewer.scene.pickPosition(movement.endPosition);
|
var cartographic = Cesium.Cartographic.fromCartesian(newPosition);
|
var height = cartographic.height; //模型高度
|
if (Number(height) < 0) {
|
var ray = options.viewer.camera.getPickRay(movement.endPosition);
|
newPosition = options.viewer.scene.globe.pick(ray, options.viewer.scene);
|
}
|
//做动态面预览用
|
// activeShapePoints.pop();
|
// activeShapePoints.push(newPosition);
|
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
|
drawHandler.setInputAction(function (movement) {
|
drawHandler = drawHandler && drawHandler.destroy();
|
var tempPointsStr = '';
|
if (activeShapePointsgeo.length > 2) {
|
for (var pindex = 0; pindex < activeShapePointsgeo.length; pindex++) {
|
var longitudeString = Cesium.Math.toDegrees(activeShapePointsgeo[pindex].longitude);
|
var latitudeString = Cesium.Math.toDegrees(activeShapePointsgeo[pindex].latitude);
|
var heightString = activeShapePointsgeo[pindex].height;
|
if (options.type == 'net') {
|
tempPointsStr += longitudeString + ',' + latitudeString + ',' + heightString + ',';
|
} else {
|
tempPointsStr += longitudeString + ',' + latitudeString + ','; //+heightString+","
|
}
|
}
|
document.getElementById(options.printId).value = tempPointsStr.substring(
|
0,
|
tempPointsStr.length - 1
|
);
|
}
|
}, Cesium.ScreenSpaceEventType.RIGHT_CLICK);
|
|
function createPoint(worldPosition) {
|
drawpointArr.push(
|
options.viewer.entities.add({
|
position: worldPosition,
|
point: {
|
color: Cesium.Color.RED,
|
pixelSize: 10,
|
outlineWidth: 1,
|
outlineColor: Cesium.Color.WHITE,
|
disableDepthTestDistance: 10000
|
}
|
})
|
);
|
}
|
|
function drawPolygon() {
|
if (options.viewer.entities.getById('areaEntity') !== undefined) {
|
options.viewer.entities.removeById('areaEntity');
|
}
|
options.viewer.entities.add({
|
id: 'areaEntity',
|
polygon: {
|
hierarchy: new Cesium.PolygonHierarchy(activeShapePoints),
|
/*new Cesium.CallbackProperty(function () {
|
return activeShapePoints;
|
}, false),*/
|
material: new Cesium.ColorMaterialProperty(Cesium.Color.RED.withAlpha(0.3)),
|
classificationType: Cesium.ClassificationType.BOTH,
|
outline: true,
|
outlineColor: Cesium.Color.WHITE
|
}
|
});
|
}
|
//回退
|
CesiumDraw.clearLastPolygonPoint = function () {
|
if (drawpointArr.length > 1) {
|
console.log('1111111111');
|
options.viewer.entities.remove(drawpointArr[drawpointArr.length - 1]);
|
drawpointArr.pop();
|
activeShapePoints.pop();
|
activeShapePointsgeo.pop();
|
if (activeShapePoints.length >= 3) {
|
drawPolygon();
|
} else {
|
options.viewer.entities.removeById('areaEntity');
|
}
|
} else {
|
console.log('2222222222');
|
}
|
};
|
};
|
|
/*var options = {
|
'viewer':viewer,
|
'polylinecolor':Cesium.Color.YELLOW,
|
'pointcolor':Cesium.Color.RED,
|
'printId':'textid',
|
'text':'证'
|
};*/
|
var lineDrawMarkArr = [];
|
CesiumDraw.drawPolyline = function (options) {
|
drawHandler = drawHandler && drawHandler.destroy();
|
if (options.viewer.entities.getById('dynamicLineGroundEntity') !== undefined) {
|
options.viewer.entities.removeById('dynamicLineGroundEntity');
|
}
|
if (options.viewer.entities.getById('measureLineGroundEntity') !== undefined) {
|
options.viewer.entities.removeById('measureLineGroundEntity');
|
}
|
for (var i = 0; i < lineDrawMarkArr.length; i++) {
|
options.viewer.entities.remove(lineDrawMarkArr[i]);
|
}
|
lineDrawMarkArr = [];
|
var isFirst = true; //是否为第一个点
|
var previousPosition; //前一个点的坐标
|
var currentPosition; //当前点坐标
|
var dynamicLineGroundEntity = options.viewer.entities.add({
|
id: 'dynamicLineGroundEntity',
|
polyline: {
|
clampToGround: true,
|
width: 3,
|
material: Cesium.Color.RED
|
}
|
});
|
//已输入的线段的entity
|
var measureLineGroundEntity = options.viewer.entities.add({
|
id: 'measureLineGroundEntity',
|
polyline: {
|
clampToGround: true,
|
width: 3,
|
material: options.polylinecolor
|
}
|
});
|
|
//节点添加标签
|
function addPin(carPoi) {
|
lineDrawMarkArr.push(
|
options.viewer.entities.add({
|
position: carPoi,
|
point: {
|
pixelSize: 10,
|
color: options.pointcolor,
|
disableDepthTestDistance: 5000000,
|
outlineWidth: 2,
|
outlineColor: Cesium.Color.WHITE.withAlpha(1)
|
}
|
})
|
);
|
}
|
|
var measureLinePositonsArray = []; //存储已量测的线段的折点
|
drawHandler = new Cesium.ScreenSpaceEventHandler(options.viewer.scene.canvas);
|
drawHandler.setInputAction(function (movement) {
|
if (isFirst) {
|
previousPosition = options.viewer.scene.pickPosition(movement.position);
|
var cartographic = Cesium.Cartographic.fromCartesian(previousPosition);
|
var height = cartographic.height; //模型高度
|
if (Number(height) < 0) {
|
var ray = options.viewer.camera.getPickRay(movement.position);
|
previousPosition = options.viewer.scene.globe.pick(ray, options.viewer.scene);
|
}
|
var tmp1 = previousPosition.clone();
|
measureLinePositonsArray.push(tmp1);
|
isFirst = false;
|
addPin(tmp1);
|
} else {
|
currentPosition = options.viewer.scene.pickPosition(movement.position);
|
var cartographic = Cesium.Cartographic.fromCartesian(currentPosition);
|
var height = cartographic.height; //模型高度
|
if (Number(height) < 0) {
|
var ray = options.viewer.camera.getPickRay(movement.position);
|
currentPosition = options.viewer.scene.globe.pick(ray, options.viewer.scene);
|
}
|
var tmp2 = currentPosition.clone();
|
measureLinePositonsArray.push(tmp2);
|
measureLineGroundEntity.polyline.positions = measureLinePositonsArray;
|
previousPosition = currentPosition.clone();
|
addPin(tmp2);
|
}
|
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
drawHandler.setInputAction(function (movement) {
|
if (!isFirst) {
|
//获取当前点的坐标
|
currentPosition = options.viewer.scene.pickPosition(movement.endPosition);
|
var cartographic = Cesium.Cartographic.fromCartesian(currentPosition);
|
var height = cartographic.height; //模型高度
|
if (Number(height) < 0) {
|
var ray = options.viewer.camera.getPickRay(movement.endPosition);
|
currentPosition = options.viewer.scene.globe.pick(ray, options.viewer.scene);
|
}
|
if (currentPosition) {
|
dynamicLineGroundEntity.polyline.positions = [previousPosition, currentPosition];
|
}
|
}
|
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
|
drawHandler.setInputAction(function () {
|
drawHandler = drawHandler && drawHandler.destroy();
|
var tempPointsStr = '';
|
for (var i = 0; i < measureLinePositonsArray.length; i++) {
|
var cartographic = Cesium.Cartographic.fromCartesian(measureLinePositonsArray[i]);
|
var longitudeString = Cesium.Math.toDegrees(cartographic.longitude);
|
var latitudeString = Cesium.Math.toDegrees(cartographic.latitude);
|
var heightString = cartographic.height;
|
tempPointsStr += longitudeString + ',' + latitudeString + ',' + heightString + ',';
|
}
|
document.getElementById(options.printId).value = tempPointsStr.substring(
|
0,
|
tempPointsStr.length - 1
|
);
|
}, Cesium.ScreenSpaceEventType.RIGHT_CLICK);
|
};
|
|
CesiumDraw.drawPoint = function (options, callback) {
|
drawHandler = drawHandler && drawHandler.destroy();
|
drawHandler = new Cesium.ScreenSpaceEventHandler(options.viewer.scene.canvas);
|
drawHandler.setInputAction(function (movement) {
|
//获取鼠标点击处的坐标
|
var cartesian = options.viewer.scene.pickPosition(movement.position);
|
var cartographic = Cesium.Cartographic.fromCartesian(cartesian);
|
var height = cartographic.height; //模型高度
|
if (Number(height) < 0) {
|
var ray = options.viewer.camera.getPickRay(movement.position);
|
cartesian = options.viewer.scene.globe.pick(ray, options.viewer.scene);
|
}
|
cartographic = Cesium.Cartographic.fromCartesian(cartesian);
|
height = cartographic.height; //地形高度
|
var lng = Cesium.Math.toDegrees(cartographic.longitude);
|
var lat = Cesium.Math.toDegrees(cartographic.latitude);
|
var poiResult = lng + ',' + lat + ',' + height;
|
document.getElementById(options.printId).value = poiResult;
|
var drawPointEntity = options.viewer.entities.getById('drawPointEntity');
|
if (drawPointEntity == undefined) {
|
options.viewer.entities.add({
|
id: 'drawPointEntity',
|
position: cartesian.clone(),
|
billboard: {
|
image: pinBuilder
|
.fromText(options.text, options.pointcolor, options.size)
|
.toDataURL(),
|
verticalOrigin: Cesium.VerticalOrigin.BOTTOM
|
},
|
ellipsoid: {
|
radii: new Cesium.Cartesian3(0.33, 0.65, 0.5),
|
material: options.pointcolor.withAlpha(0.7)
|
}
|
});
|
} else {
|
drawPointEntity.position = cartesian.clone();
|
}
|
callback();
|
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
};
|
|
var wallDrawMarkArr = [];
|
CesiumDraw.drawWall = function (options) {
|
wallDrawMarkArr = [];
|
var isFirst = true; //是否为第一个点
|
var previousPosition; //前一个点的坐标
|
var currentPosition; //当前点坐标
|
var dynamicLineGroundEntity = options.viewer.entities.add({
|
id: 'dynamicLineGroundEntity',
|
polyline: {
|
clampToGround: true,
|
width: 3,
|
material: Cesium.Color.RED
|
}
|
});
|
//已输入的线段的entity
|
var measureLineGroundEntity = options.viewer.entities.add({
|
id: 'measureLineGroundEntity',
|
polyline: {
|
clampToGround: true,
|
width: 3,
|
material: options.wallcolor
|
}
|
});
|
|
//节点添加标签
|
function addPin(carPoi) {
|
wallDrawMarkArr.push(
|
options.viewer.entities.add({
|
position: carPoi,
|
point: {
|
pixelSize: 10,
|
color: options.pointcolor,
|
disableDepthTestDistance: 5000000,
|
outlineWidth: 2,
|
outlineColor: Cesium.Color.WHITE.withAlpha(1)
|
}
|
})
|
);
|
}
|
|
var measureLinePositonsArray = []; //存储已量测的线段的折点
|
drawHandler = new Cesium.ScreenSpaceEventHandler(options.viewer.scene.canvas);
|
drawHandler.setInputAction(function (movement) {
|
if (isFirst) {
|
previousPosition = options.viewer.scene.pickPosition(movement.position);
|
var cartographic = Cesium.Cartographic.fromCartesian(previousPosition);
|
var height = cartographic.height; //模型高度
|
if (Number(height) < 0) {
|
var ray = options.viewer.camera.getPickRay(movement.position);
|
previousPosition = options.viewer.scene.globe.pick(ray, options.viewer.scene);
|
}
|
var tmp1 = previousPosition.clone();
|
measureLinePositonsArray.push(tmp1);
|
isFirst = false;
|
addPin(tmp1);
|
} else {
|
currentPosition = options.viewer.scene.pickPosition(movement.position);
|
var cartographic = Cesium.Cartographic.fromCartesian(currentPosition);
|
var height = cartographic.height; //模型高度
|
if (Number(height) < 0) {
|
var ray = options.viewer.camera.getPickRay(movement.position);
|
currentPosition = options.viewer.scene.globe.pick(ray, options.viewer.scene);
|
}
|
var tmp2 = currentPosition.clone();
|
measureLinePositonsArray.push(tmp2);
|
measureLineGroundEntity.polyline.positions = measureLinePositonsArray;
|
previousPosition = currentPosition.clone();
|
addPin(tmp2);
|
}
|
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
drawHandler.setInputAction(function (movement) {
|
if (!isFirst) {
|
//获取当前点的坐标
|
currentPosition = options.viewer.scene.pickPosition(movement.endPosition);
|
var cartographic = Cesium.Cartographic.fromCartesian(currentPosition);
|
var height = cartographic.height; //模型高度
|
if (Number(height) < 0) {
|
var ray = options.viewer.camera.getPickRay(movement.endPosition);
|
currentPosition = options.viewer.scene.globe.pick(ray, options.viewer.scene);
|
}
|
if (currentPosition) {
|
dynamicLineGroundEntity.polyline.positions = [previousPosition, currentPosition];
|
}
|
}
|
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
|
drawHandler.setInputAction(function () {
|
drawHandler = drawHandler && drawHandler.destroy();
|
var tempPointsStr = '';
|
var tempPosArr = [];
|
var minimumHeights = [];
|
var measureResult = 0;
|
for (var i = 0; i < measureLinePositonsArray.length; i++) {
|
var cartographic = Cesium.Cartographic.fromCartesian(measureLinePositonsArray[i]);
|
var longitudeString = Cesium.Math.toDegrees(cartographic.longitude);
|
var latitudeString = Cesium.Math.toDegrees(cartographic.latitude);
|
var heightString = cartographic.height;
|
tempPointsStr += longitudeString + ',' + latitudeString + ',' + heightString + ',';
|
tempPosArr.push(
|
Number(longitudeString),
|
Number(latitudeString),
|
Number(heightString) + options.wallHeight
|
);
|
minimumHeights.push(Number(heightString));
|
}
|
|
var cartographic = Cesium.Cartographic.fromCartesian(measureLinePositonsArray[0]);
|
var longitudeString = Cesium.Math.toDegrees(cartographic.longitude);
|
var latitudeString = Cesium.Math.toDegrees(cartographic.latitude);
|
var heightString = cartographic.height;
|
tempPointsStr += longitudeString + ',' + latitudeString + ',' + heightString + ',';
|
var cartographics = Cesium.Cartographic.fromCartesian(measureLinePositonsArray[1]);
|
var longitudeStrings = Cesium.Math.toDegrees(cartographics.longitude);
|
var latitudeStrings = Cesium.Math.toDegrees(cartographics.latitude);
|
tempPointsStr += longitudeStrings + ',' + latitudeStrings + ',' + heightString + ',';
|
tempPosArr.push(
|
Number(longitudeString),
|
Number(latitudeString),
|
Number(heightString) + options.wallHeight,
|
Number(longitudeStrings),
|
Number(latitudeStrings),
|
Number(heightString) + options.wallHeight
|
);
|
minimumHeights.push(Number(heightString));
|
tempPointsStr = tempPointsStr.substring(0, tempPointsStr.length - 1);
|
document.getElementById(options.printId).value = tempPointsStr;
|
options.viewer.entities.remove(dynamicLineGroundEntity);
|
options.viewer.entities.remove(measureLineGroundEntity);
|
for (var i = 0; i < wallDrawMarkArr.length; i++) {
|
options.viewer.entities.remove(wallDrawMarkArr[i]);
|
}
|
options.viewer.entities.add({
|
wall: {
|
positions: Cesium.Cartesian3.fromDegreesArrayHeights(tempPosArr),
|
material: options.wallcolor.withAlpha(1),
|
minimumHeights: minimumHeights
|
}
|
});
|
}, Cesium.ScreenSpaceEventType.RIGHT_CLICK);
|
//回退
|
CesiumDraw.clearLastWallPoint = function () {
|
if (wallDrawMarkArr.length > 1) {
|
console.log('1111111111');
|
options.viewer.entities.remove(wallDrawMarkArr[wallDrawMarkArr.length - 1]);
|
wallDrawMarkArr.pop();
|
previousPosition = wallDrawMarkArr[wallDrawMarkArr.length - 1]._position._value;
|
measureLinePositonsArray.pop();
|
} else {
|
console.log('2222222222');
|
}
|
};
|
};
|
|
CesiumDraw.clearDraw = function (options) {
|
for (var i = 0; i < drawpointArr.length; i++) {
|
options.viewer.entities.remove(drawpointArr[i]);
|
}
|
if (options.viewer.entities.getById('areaEntity') !== undefined) {
|
options.viewer.entities.removeById('areaEntity');
|
}
|
if (options.viewer.entities.getById('dynamicLineGroundEntity') !== undefined) {
|
options.viewer.entities.removeById('dynamicLineGroundEntity');
|
}
|
if (options.viewer.entities.getById('measureLineGroundEntity') !== undefined) {
|
options.viewer.entities.removeById('measureLineGroundEntity');
|
}
|
if (options.viewer.entities.getById('drawPointEntity') !== undefined) {
|
options.viewer.entities.removeById('drawPointEntity');
|
}
|
for (var i = 0; i < lineDrawMarkArr.length; i++) {
|
options.viewer.entities.remove(lineDrawMarkArr[i]);
|
}
|
lineDrawMarkArr.length = 0;
|
for (var i = 0; i < wallDrawMarkArr.length; i++) {
|
options.viewer.entities.remove(wallDrawMarkArr[i]);
|
}
|
wallDrawMarkArr.length = 0;
|
};
|
|
CesiumDraw.clearDrawHandler = function () {
|
drawHandler = drawHandler && drawHandler.destroy();
|
};
|
|
return CesiumDraw;
|
}
|
|
if (typeof CesiumDraw === 'undefined') {
|
window.CesiumDraw = define_CesiumDraw();
|
} else {
|
console.log('CesiumDraw already defined.');
|
}
|
})(window);
|
