加载中…Cesium学习笔记-工具篇05-DynamicDrawTool交互绘制
(2018-07-28 16:40:31)
标签：
cesiumdrawhelper交互绘制动态绘制dynamicdraw |
分类： Cesium |
前两篇博客我们学习了cesium使用频率最高的一个工具：drawhelper（github源码），以及它的一个重要功能：ChangeablePrimitive-可编辑图形。本篇博客我们再学习另外一个重要功能：
//回调cartesians获取点位信息
});
var lineOption = {
width:
5,
geodesic:
true
};
DynamicDrawTool.startDrawingPolyshape(viewer,
false, lineOption, function (cartesians) {
//回调cartesians 获取点位信息
});
var gonOption = {
width:
5,
geodesic:
true
};
DynamicDrawTool.startDrawingPolyshape(viewer,
true, gonOption, function (cartesians) {
//回调cartesians 获取点位信息
});
此示例中我修改了鼠标tooltip方式，使用前面介绍的entity方式：Cesium学习笔记-工具篇01-Tooltip-entity方式。
var isInit =
false;
var viewer;
var labelEntity;
function _() { };
_.initTool = function
(_viewer) {
if (isInit) { return; }
viewer = _viewer;
labelEntity = viewer.entities.add({
position:
Cesium.Cartesian3.fromDegrees(0, 0),
label:
{
text: '提示',
font: '15px
sans-serif',
pixelOffset: new
Cesium.Cartesian2(8, 8),//y大小根据行数和字体大小改变
horizontalOrigin:
Cesium.HorizontalOrigin.LEFT,
showBackground: true,
backgroundColor: new
Cesium.Color(0.165, 0.165, 0.165, 1.0)
}
});
labelEntity.show = false;
isInit = true;
}
_.setVisible = function
(visible) {
if (!isInit) { return; }
labelEntity.show = visible ? true : false;
};
_.showAt = function
(position, message) {
if (!isInit) { return; }
if (position && message) {
labelEntity.show = true;
var
cartesian = viewer.camera.pickEllipsoid(position,
viewer.scene.globe.ellipsoid);//
if
(cartesian) {
labelEntity.position =
cartesian;
labelEntity.show =
true;
labelEntity.label.text =
message;
} else
{
labelEntity.show =
false;
}
}
};
return _;
动态画图-DynamicDrawTool。
1动态绘制点：
我们可以通过一下简单的几行代码调用即可实现上述功能：
1画点：
DynamicDrawTool.startDrawingMarker(viewer, "点击添加项目中心点",
function (cartesian) {
2画线：
3画面：
var CesiumTooltip = (function () {
})();
我们可以结合DynamicDrawTool和ChangeablePrimitive这两个工具灵活实现drawhelper工具。
示例代码：github源码
我的学习公众号也开通，感兴趣的小伙伴们可以加关注：giserYZ2SS，代码交流小伙伴在公众号发消息，我会一一回复的。
喜欢
0
赠金笔