Skip to content

Commit

Permalink
优化直线距离测量
Browse files Browse the repository at this point in the history
  • Loading branch information
AJJackGIS committed Apr 19, 2019
1 parent c63aead commit b63061e
Show file tree
Hide file tree
Showing 2 changed files with 129 additions and 110 deletions.
204 changes: 111 additions & 93 deletions App/CesiumMeasure.js
View file
Original file line number Diff line number Diff line change
@@ -1,123 +1,141 @@
/**
* 测量线段
*/
function measurePolyLine(viewer) {

var firstPoint = null; // 鼠标单击量测的第一个点
var firstEntity = null;
var movePoint = null; // 鼠标移动时不断改变的点
var lineEntity = null; // 鼠标移动时不断改变的线
var lastPoint = null; // 鼠标单击量测的第二个点
var lastEntity = null;
var labelEntity = null; // 量测时不断改变的文字信息
var centerPoint = null; // 量测时不断改变的中心点

// 注册鼠标左击事件
viewer.screenSpaceEventHandler.setInputAction(function (clickEvent) {
var cartesian = viewer.scene.pickPosition(clickEvent.position); // 坐标

// 存储第一个点
if (firstEntity == null) {
firstPoint = cartesian;
firstEntity = viewer.entities.add(new Cesium.Entity({
position: firstPoint,
point: {
color: Cesium.Color.GREEN,
pixelSize: 10,
scaleByDistance: new Cesium.NearFarScalar(500, 1.0, 2000, 0.0),
translucencyByDistance: new Cesium.NearFarScalar(500, 1.0, 2000, 0.0)
}
}));
function MeasureTools(viewer) {

// 注册鼠标移动事件
viewer.screenSpaceEventHandler.setInputAction(function (moveEvent) {
movePoint = viewer.scene.pickPosition(moveEvent.endPosition); // 鼠标移动的点
var entityCollection = [];

// 绘制线
if (lineEntity) {
viewer.entities.remove(lineEntity);
}
lineEntity = viewer.entities.add(new Cesium.Entity({
polyline: {
positions: [firstPoint, movePoint],
width: 4,
material: Cesium.Color.RED
}
}));
this.getCollection = function () {
return entityCollection;
};

// 绘制label
if (labelEntity) {
viewer.entities.remove(labelEntity);
}
// 计算中点
centerPoint = Cesium.Cartesian3.midpoint(firstPoint, movePoint, new Cesium.Cartesian3());
// 计算距离
var length = Cesium.Cartesian3.distance(firstPoint, movePoint);
if (length > 1000) {
length = (length / 1000).toFixed(2) + " km";
} else {
length = length.toFixed(2) + " m";
}
labelEntity = viewer.entities.add(new Cesium.Entity({
position: centerPoint,
label: {
text: "长度：" + length,
showBackground: true,
pixelOffset: new Cesium.Cartesian2(0, -20),
font: '8px sans-serif'
this.destroy = function () {
for (var i = 0; i < entityCollection.length; i++) {
viewer.entities.remove(entityCollection[i]);
}
entityCollection = [];
};

this.measurePolyLine = function () {

var positions = [];
var labelEntity = null; // 标签实体

// 注册鼠标左击事件
viewer.screenSpaceEventHandler.setInputAction(function (clickEvent) {
var cartesian = viewer.scene.pickPosition(clickEvent.position); // 坐标

// 存储第一个点
if (positions.length == 0) {
positions.push(cartesian.clone());

addPoint(cartesian);

// 注册鼠标移动事件
viewer.screenSpaceEventHandler.setInputAction(function (moveEvent) {
var movePosition = viewer.scene.pickPosition(moveEvent.endPosition); // 鼠标移动的点
if (positions.length == 2) {
positions.pop();
positions.push(movePosition);

// 绘制label
if (labelEntity) {
viewer.entities.remove(labelEntity);
entityCollection.splice(entityCollection.indexOf(labelEntity), 1);
}

labelEntity = addLabel(positions);
entityCollection.push(labelEntity);

} else {
positions.push(movePosition);

// 绘制线
addLine(positions);
}
}));

}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
} else {
// 存储第二个点
lastPoint = cartesian;
lastEntity = viewer.entities.add(new Cesium.Entity({
position: lastPoint,
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
} else {
// 存储第二个点
positions.pop();
positions.push(cartesian);
addPoint(cartesian);
viewer.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);
viewer.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.MOUSE_MOVE);
}
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);


/**
* 添加点
* @param position
*/
var addPoint = function (position) {
entityCollection.push(viewer.entities.add(new Cesium.Entity({
position: position,
point: {
color: Cesium.Color.GREEN,
pixelSize: 10,
scaleByDistance: new Cesium.NearFarScalar(500, 1.0, 2000, 0.0),
translucencyByDistance: new Cesium.NearFarScalar(500, 1.0, 2000, 0.0)
}
}));
})));
};

// 绘制线
viewer.entities.remove(lineEntity);
lineEntity = viewer.entities.add(new Cesium.Entity({
/**
* 添加线
* @param positions
*/
var addLine = function (positions) {
var dynamicPositions = new Cesium.CallbackProperty(function () {
return positions;
}, false);
entityCollection.push(viewer.entities.add(new Cesium.Entity({
polyline: {
positions: [firstPoint, lastPoint],
positions: dynamicPositions,
width: 4,
material: Cesium.Color.RED
}
}));
// 绘制label
viewer.entities.remove(labelEntity);
})));
};

/**
* 添加标签
* @param position
* @param text
*/
var addLabel = function (positions) {

// 计算中点
centerPoint = Cesium.Cartesian3.midpoint(firstPoint, lastPoint, new Cesium.Cartesian3());
var centerPoint = Cesium.Cartesian3.midpoint(positions[0], positions[1], new Cesium.Cartesian3());
// 计算距离
var length = Cesium.Cartesian3.distance(firstPoint, lastPoint);

if (length > 1000) {
length = (length / 1000).toFixed(2) + " km";
} else {
length = length.toFixed(2) + " m";
}
var lengthText = getLengthText(positions[0], positions[1]);

labelEntity = viewer.entities.add(new Cesium.Entity({
return viewer.entities.add(new Cesium.Entity({
position: centerPoint,
label: {
text: "长度：" + length,
text: lengthText,
showBackground: true,
pixelOffset: new Cesium.Cartesian2(0, -20),
font: '8px sans-serif'
}
}));
};

viewer.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);
viewer.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.MOUSE_MOVE);
}

/**
* 计算两点距离
* @param firstPoint
* @param secondPoint
*/
var getLengthText = function (firstPoint, secondPoint) {
// 计算距离
var length = Cesium.Cartesian3.distance(firstPoint, secondPoint);
if (length > 1000) {
length = (length / 1000).toFixed(2) + " km";
} else {
length = length.toFixed(2) + " m";
}
return length;
};
}
}

}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
}
35 changes: 18 additions & 17 deletions App/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -267,32 +267,33 @@
}

// 测量工具
const tool = new Cesium.DrawTool({
viewer: viewer,
isMeasure: true, // 是否开启测量模式
isClampGround: true, // 是否开启贴地模式
lineWidth: 1.0 // 设置线宽
});
// const tool = new Cesium.DrawTool({
// viewer: viewer,
// isMeasure: true, // 是否开启测量模式
// isClampGround: true, // 是否开启贴地模式
// lineWidth: 1.0 // 设置线宽
// });
const measureTool = new MeasureTools(viewer);

function changeMeasureType(type) {
tool.setIsClampGround(type) // 设置是否开启贴地模式
}
// function changeMeasureType(type) {
// tool.setIsClampGround(type) // 设置是否开启贴地模式
// }

// document.getElementById('point').onclick = function () {
// tool.startPoint() // 画点
// };
document.getElementById('line').onclick = function () {
// tool.startPolyline() // 画线
measurePolyLine(viewer);
};
document.getElementById('polygon').onclick = function () {
tool.startPolygon(); // 画面
};
document.getElementById('elevation').onclick = function () {
tool.startElevation(); // 量高
measureTool.measurePolyLine();
};
// document.getElementById('polygon').onclick = function () {
// tool.startPolygon(); // 画面
// };
// document.getElementById('elevation').onclick = function () {
// tool.startElevation(); // 量高
// };
document.getElementById('remove').onclick = function () {
tool.destory()
measureTool.destroy();
};

// 倾斜数据
Expand Down

0 comments on commit b63061e

Please sign in to comment.