# 地图标绘

fast3dbase.Draw是实体类，标绘控制处理类，提供文字、点、线、面、管道、立体、模型等entity对象的绘制。

# 使用示例

var  drawControl = new fast3dbase.Draw({
    viewer: viewer,
    hasEdit: true,
    dragIcon: 'img/dragIcon.png',
    onStopDrawing: function (entity) {
    },
    onStartEditing: function (entity) {
    },
    onChangeEditing: function (entity) {
    },
    onStopEditing: function (entity) {
    },
});
//标绘文字
drawControl.startDraw({
    type: "label",
    style: {
        text: "三维地球",
        color: "#0081c2",
        font_size: 50,
        border: true,
        border_color: "#ffffff",
        border_width: 2
    }
});

# 创建对象

创建示例	说明
fast3dbase.Draw(`<Draw options> options`)	根据相关参数创建一个标绘控制器

# Options参数选项

Option参数	参数类型	默认值	说明
viewer	viewer	必须传入	当前的地球对象viewer
dragIcon	String	null	编辑时拖动点的图标Image URL地址
onEvnet	Boolean	true	是否初始化时就绑定相关交互事件，如果传入false，后续需要手动调用onEvnet方法绑定。
hasEdit	Boolean	false	是否可以编辑
onStartDrawing	function	undefined	开始标绘后回调 onStartDrawing: function (entity) { },
onChangeDrawing	function	undefined	标绘中数据有变化后回调 onChangeDrawing: function (entity) { },
onMoveDrawing	function	undefined	标绘中移动鼠标后回调 onMoveDrawing: function (entity) { },
onStopDrawing	function	undefined	标绘完成后回调 onStopDrawing: function () { },
onStartEditing	function	undefined	选中开始编辑对象后回调 onStartEditing: function (entity) { },
onChangeEditing	function	undefined	编辑对象有修改后回调 onChangeEditing: function (entity) { },
onStopEditing	function	undefined	停止编辑对象后回调 onStopEditing: function () { },

# 方法

方法名	返回值	说明
startDraw(DrawStyle-option option)	Entity	激活开始绘制
stopDraw()	this	停止编辑
updateAttribute(Object attribute)	Entity	修改当前正在编辑的Entity的属性
updateGeometry(Array positions)	Entity	修改当前正在编辑的Entity的坐标、高程
deleteEntity(Entity entity)		删除单个entity
deleteCurrentEntity()		删除当前entity
deleteAll()		删除所有entity
hasDraw()	Boolean	是否存在有绘制的entity
hasEdit(Boolean value)		设置是否可以编辑修改entity
getEntitys()	Entity[]	获取所有绘制的实体对象列表
getCoordinates(Entity entity)	[]	获取实体的经纬度坐标数组
getPositions(Entity entity)	[]	获取实体的笛卡尔坐标数组
setPositions(Entity entity,Array positions)		设置实体的坐标
toGeoJSON()	String	转换所有标绘的Entity为geojson标准的字符串
jsonToEntity(GeoJson Object json,Boolean isClear)	Entity[]	转换保存过的geojson数据为entity，并绑定相关标绘事件等
markersInfoToEntity(Arrary或String json,Json style,Boolean isClear)	Array	转换通用格式的标记数据为entity数组 var attribute = { type:"billboard", style: { scale: 0.60, image: this.path + "img/marker.png" } }; var json =[ {"name": "标记1","x": 114.030,"y": 22.646,"z": 58 }, {"name": "标记2","x": 114.656,"y": 22.682,"z": 60 } ]; drawControl.markersInfoToEntity(json,attribute,isclear);

# startDraw 参数选项

# 1.文字

{
    "type": "label", 
    "style": {
        "text": "文字",
        "opacity": 1,
        "color": "#0081c2",
        "font_family": "黑体",
        "font_size": 30,
        "font_style": "normal",
        "font_weight": "normal",
        "border": true,
        "border_color": "#ffffff",
        "border_width": 2,
        "background": false,
        "background_color": "#ccc"
    }
}

# 2.点标记

{
    "type": "point", 
    "style": {
        "pixelSize": 10,
        "color": "#3388ff",
        "outline": true,
        "outlineColor": "#ffffff",
        "outlineWidth": 1,
        "opacity": 0.6
    } 
}

# 3.图片点标记

{
    "type": "billboard", 
    "style": {
        "image": "./img/marker/mark1.png",
        "opacity": 1,
        "scale": 1,
        "rotation": 0
    }
}

# 4.gltf模型

{
    "type": "model", 
    "style": {
        "modelUrl": "data/models/CesiumAir/Cesium_Air.glb",
        "scale": 1,
        "heading": 0,
        "pitch": 0,
        "roll": 0,
        "fill": false,
        "color": "#3388ff",
        "opacity": 1,
        "silhouette": false,
        "silhouetteColor": "#ffffff",
        "silhouetteSize": 2,
        "silhouetteAlpha": 0.8
    }
}

# 5.线

{
    "type": "polyline", 
    "style": {
        "color": "#3388ff",
        "width": 3,
        "lineType": "solid",
        "outline": false,
        "outlineColor": "#ffffff",
        "outlineWidth": "1.0",
        "opacity": 1
    }
}

# 6.面

{
    "type": "polygon", 
    "position": { "height": false },
    "style": {
        "color": "#00FF00",
        "outline": true,
        "outlineColor": "#ffffff",
        "opacity": 0.6,
        "extrudedHeight": 40,
        "height": 0,
        "perPositionHeight": false
    }
}

# 7.矩形

{
    "type": "rectangle", 
    "position": { "height": false },
    "style": {
        "color": "#00FF00",
        "outline": true,
        "outlineColor": "#ffffff",
        "rotation": 0,
        "opacity": 0.6,
        "extrudedHeight": 40,
        "height": 0
    }
}

# 8.圆、椭圆

{
    "type": "ellipse", 
    "position": { "height": false },
    "style": {
        "semiMinorAxis": 100,
        "semiMajorAxis": 100,
        "height": 0,
        "extrudedHeight": 0,
        "opacity": 0.6,
        "fill": true,
        "color": "#3388ff",
        "outline": true,
        "outlineColor": "#ffffff",
        "rotation": 0
    }
}

# 9.管道线

{
    "type": "polylineVolume", 
    "style": {
        "color": "#00FF00",
        "radius": 10,
        "shape": "circle",
        "outline": false,
        "outlineColor": "#ffffff",
        "opacity": 1
    } 
}

# 10.球体

{
    "type": "ellipsoid", 
    "style": {
        "extentRadii": 100,
        "widthRadii": 100,
        "heightRadii": 100,
        "color": "#00FF00",
        "outline": true,
        "outlineColor": "#ffffff",
        "fill": true,
        "opacity": 0.6
    } 
}

# 11.墙体

{
    "type": "wall", 
    "position": { "height": false },
    "style": {
        "color": "#00FF00",
        "outline": true,
        "outlineColor": "#ffffff",
        "opacity": 0.6,
        "maximumHeights": 40
    } 
}

← 通用方法地图量算 →