最近在做一个大屏展示系统,使用Skyline 进行三维地图展示。由于Skyline 自带的量测功能(面积量测、水平量测)在大屏上字体非常小,看不清楚,所以自己重写了量测的功能。
实现了可以根据屏幕分辨率设置量测线线宽的大小以及量测结果字体的自定义设置。(另外Skyline 在大屏展示的效率实在不敢恭维,有时间再写一下Skyline在大屏展示的优化历程)
拿一个水平量测的来举例:关键事件:OnLButtonDown、OnRightButtonUp 和OnFrame事件
OnLButtonDown 事件主要用于开始点击三维场景时进行量测线段的生成,以及第二次点击之后结束第一段量测
onLButtonDown: function (flags, x, y) {
var ret = _vecMeasure.sgworld.Window.PixelToWorld(x, y, -1);
if (_vecMeasure.bFirstClick) //首次点击
{
_vecMeasure.mlistPoints.push(ret.Position.X, ret.Position.Y, ret.Position.Altitude + 0.5);
//创建一条线,起点和终点是相同的
var lineArray = new Array(ret.Position.X, ret.Position.Y, ret.Position.Altitude + 0.5, ret.Position.X, ret.Position.Y, ret.Position.Altitude + 0.5);
var geometryLine = _vecMeasure.sgworld.Creator.GeometryCreator.CreateLineStringGeometry(lineArray);
var groupID = _vecMeasure.getAreaGroupId(_vecMeasure.sgworld,_vecMeasure.measureResultGroup);
_vecMeasure.tempLine = _vecMeasure.sgworld.Creator.CreatePolyline(geometryLine, 0xFF00FF00, 3, groupID, "临时线");
_vecMeasure.bFirstClick = false;
}
else //点击第二次以后
{
_vecMeasure.mlistPoints.push(ret.Position.X, ret.Position.Y, _vecMeasure.mlistPoints[2]);
}
return true;
}
OnRightButtondUp 主要是结束整个绘制事件(量测可能同时量测多段)
onRButtonUp: function (flags, x, y) {
if (_vecMeasure.tempLine != null) {
_vecMeasure.sgworld.ProjectTree.DeleteItem(_vecMeasure.tempLine.ID);
}
_vecMeasure.mlistPoints.splice(0, _vecMeasure.mlistPoints.length);
_vecMeasure.tempLine = null;
_vecMeasure.bFirstClick = true;
return true;
}
OnFrame 主要是根据鼠标位置实时修改量测线的位置
onFrame: function () {
var mouseInfo = _vecMeasure.sgworld.Window.GetMouseInfo();
var ret = _vecMeasure.sgworld.Window.PixelToWorld(mouseInfo.X, mouseInfo.Y, -1);
if (_vecMeasure.mlistPoints != null) {
if (_vecMeasure.mlistPoints.length > 0) {
if (_vecMeasure.mlistPoints.length == 3) //修改零时的线,出现象皮筋效果,类似OpenGL 的方式
{
var lineString = _vecMeasure.tempLine.Geometry;
lineString.StartEdit();
lineString.StartPoint.X = ret.Position.X;
lineString.StartPoint.Y = ret.Position.Y;
lineString.StartPoint.Z = ret.Position.Altitude + 0.5;
var lineGeometry = lineString.EndEdit();
_vecMeasure.tempLine.Geometry = lineGeometry;
}
else if (_vecMeasure.mlistPoints.length == 6) {
//创建polygon
//删除polyline
//6.1
//sgworld.ProjectTree.DeleteItem(AreaMeasureSpace.tempLine.TreeItem.ItemID);
_vecMeasure.sgworld.ProjectTree.DeleteItem(_vecMeasure.tempLine.ID);
var nLineColor = 0xFF00FF00;
var vertices = [
_vecMeasure.mlistPoints[0],
_vecMeasure.mlistPoints[1],
_vecMeasure.mlistPoints[2],
_vecMeasure.mlistPoints[3],
_vecMeasure.mlistPoints[4],
_vecMeasure.mlistPoints[5]
];
//创建线和标注
var groupID = _vecMeasure.getAreaGroupId(_vecMeasure.sgworld, _vecMeasure.measureResultGroup);
var resultLineGeo = _vecMeasure.sgworld.Creator.GeometryCreator.CreateLineStringGeometry(vertices);
var resultLine = _vecMeasure.sgworld.Creator.CreatePolyline(resultLineGeo, nLineColor, 3, groupID, "量测线");
var showResult = resultLineGeo.length.toFixed(3);
var showText = showResult + "米";
if (parseFloat(showResult) > 1000 ) {
var showgl = parseFloat(showResult) / 1000;
showText = showgl.toFixed(2) + "平方千米";
}
//var centerPoint = polygonGeomety.Centroid;
var alt = _vecMeasure.mlistPoints[2] + 1.5;
//自定义根据分辨率设置线宽,字体大小等 var lbX = (resultLineGeo.StartPoint.X + resultLineGeo.EndPoint.X) * 0.5;
var lbY = (resultLineGeo.StartPoint.Y + resultLineGeo.EndPoint.Y) * 0.5;
var sPosition = _vecMeasure.sgworld.Creator.CreatePosition(lbX, lbY, alt, 3, 0, 0, 0, 0);
var sLabelStyle = _vecMeasure.sgworld.Creator.CreateLabelStyle(0);
sLabelStyle.TextColor.FromARGBColor(0x7FFFFF00);
sLabelStyle.MaxViewingHeight = 15000;
var areaLabel = _vecMeasure.sgworld.Creator.CreateLabel(sPosition, showText, "", sLabelStyle, groupID, "");
//创建一条线,起点和终点是相同的
var lineArray = [
_vecMeasure.mlistPoints[3],
_vecMeasure.mlistPoints[4],
_vecMeasure.mlistPoints[5],
_vecMeasure.mlistPoints[3],
_vecMeasure.mlistPoints[4],
_vecMeasure.mlistPoints[5]];
var geometryLine = _vecMeasure.sgworld.Creator.GeometryCreator.CreateLineStringGeometry(lineArray);
_vecMeasure.mlistPoints.splice(0, 3);
_vecMeasure.tempLine = _vecMeasure.sgworld.Creator.CreatePolyline(geometryLine, nLineColor, 3, groupID, "临时线");
}
}
}
},