Class: GraphicsLayer

GraphicsLayer

new GraphicsLayer(viewer, options)

engineExtensions/graphic/GraphicsLayer.js, line 28

支持如下方法:
[1、开始绘制图形]
[2、添加绘制图形]
[3、添加绘制图形]
[4、移除所有鼠标事件,停止绘制]
[5、开始编辑]
[6、停止编辑]
[7、根据ID获取标绘图形对象]
[8、根据name获取标绘图形对象]
[9、根据GroupName获取标绘图形对象]
[10、根据序号获取标绘图形对象]
[11、根据对象获取index]
[12、获取图层所有标绘图形]
[13、获取标绘模型编辑器]
[14、根据ID移除标绘图形]
[15、根据GroupName移除一组标绘图形]
[16、根据序号移除标绘图形]
[17、移除最后一个标绘图形]
[18、移除选中标绘图形]
[19、移除是否成功]
[20、整个图层导出为json文件]
[21、计算当前标绘图层的外包围球]
[22、跳转到该图层]
[23、加载json文件]
[24、移除整个图层]

Name Type Description
viewer Cesium.Viewer

场景视图对象,详见Cesium.Viewer

options Object

图层初始化参数

Name Type Default Description
getGraphic function null 可选

添加标绘对象成功后的回调函数。

revokeModel function null 可选

撤销添加模型的回调函数。

revokePoint function null 可选

撤销添加点,广告牌,文字框的回调函数。

clickGraphic function null 可选

点击标绘对象的回调函数。

enableClickGraphic Boolean true 可选

是否启用标绘对象的点击事件。

enableRightRevoke Boolean true 可选

是否启用右键撤销绘制。

mouseMoveShowAt function function(position, tipDom, tittleDom, arrowDom) 可选

重写鼠标移动时的提示函数,position:当前鼠标的屏幕像素坐标, tittleDom:提示内容的dom元素对象, arrowDom:提示左箭头的dom元素对象, tipDom:整个提示框的dom元素对象。

toolTipDom Object 可选

重写整个提示框dom对象

enableToolTip Boolean true 可选

是否显示提示框

Examples

初始化标绘图层

// ES5引入方式
const { GraphicsLayer } = zondy.cesium
// ES6引入方式
import { GraphicsLayer } from "@mapgis/webclient-cesium-plugin"

//初始化标绘图层
const graphicsLayer = new GraphicsLayer(viewer, {
  //添加标绘对象成功后的回调函数
  getGraphic: function(e) {},
  //撤销添加模型的回调函数
  revokeModel: function(e) {},
  //撤销添加点,广告牌,文字框,div,marker的回调函数
  revokePoint: function(e) {},
  //点击标绘对象的回调函数
  clickGraphic: function(e) {},
  //是否启用标绘对象的点击事件
  enableClickGraphic: true,
  //是否启用右键撤销绘制
  enableRightRevoke: true,
  //重写鼠标移动提示事件
  mouseMoveShowAt: function(position, tipDom, tittleDom, arrowDom){
      tittleDom.innerHTML = "你的提示";
      tipDom.style.left = position.x + 10 + 'px';
      tipDom.style.top = position.y - tipDom.clientHeight / 2 + 'px';
  },
  //是否显示提示框
  enableToolTip: true
});
//添加标绘图层到图层管理器中
viewer.scene.layers.appendGraphicsLayer(graphicsLayer);

重写提示框对象

// ES5引入方式
const { GraphicsLayer } = zondy.cesium
// ES6引入方式
import { GraphicsLayer } from "@mapgis/webclient-cesium-plugin"

const graphicsLayer = new GraphicsLayer(viewer, {
  //重写鼠标移动提示事件,当toolTipDom存在时,只有两个回调参数
  mouseMoveShowAt: function(position, tipDom){
     //你的提示事件
  },
  toolTipDom: "你的toolTipDom的DOM对象"
});

Members

editToolEditTool

图层编辑工具

graphicListHashMap

图形集合,包含该图层内所有图形对象的键值对

Methods

addGraphic(graphic, options){Graphic}

engineExtensions/graphic/GraphicsLayer.js, line 349

添加绘制图形

Name Type Description
graphic Object

不同类型实体参考:参见Graphic.graphicType

options Object

额外参数

Returns:
Type Description
Graphic 反回添加的图形

calculateBoundingSphere(){Cesium.BoundingSphere}

engineExtensions/graphic/GraphicsLayer.js, line 1601
Returns:
Type Description
Cesium.BoundingSphere 外包围球。

destroy()

engineExtensions/graphic/GraphicsLayer.js, line 1699

exportToJson(){String}

engineExtensions/graphic/GraphicsLayer.js, line 1585
Returns:
Type Description
String json格式的字符串。

flyTo(options)

engineExtensions/graphic/GraphicsLayer.js, line 1624
Name Type Description
options Object

跳转参数,参见Camera#flyToBoundingSphere

getAllGraphic(){Array.<Object>}

engineExtensions/graphic/GraphicsLayer.js, line 1461
Returns:
Type Description
Array.<Object> 返回所有图形对象

getGraphicByGroupName(name){Array.<Object>|Undefined}

engineExtensions/graphic/GraphicsLayer.js, line 1418
Name Type Description
name String

图形ID

Returns:
Type Description
Array.<Object> | Undefined 返回对象组

getGraphicByID(id){Object|Undefined}

engineExtensions/graphic/GraphicsLayer.js, line 1359
Name Type Description
id String

图形ID

Returns:
Type Description
Object | Undefined 返回图层对象或者返回false查询失败

getGraphicByIndex(index){Object}

engineExtensions/graphic/GraphicsLayer.js, line 1436
Name Type Description
index String

图形序号

Returns:
Type Description
Object 返回图形对象

getGraphicByName(name, type){Array.<Object>|Undefined}

engineExtensions/graphic/GraphicsLayer.js, line 1385
Name Type Description
name String

图形ID

type String

类型,equal、like

Returns:
Type Description
Array.<Object> | Undefined 返回对象组

getIndexByGraphic(){Boolean}

engineExtensions/graphic/GraphicsLayer.js, line 1445
Returns:
Type Description
Boolean

getTransformEditor(Graphic, getViewModel)

engineExtensions/graphic/GraphicsLayer.js, line 1471
Name Type Description
Graphic Object

模型对象

getViewModel function

模型编辑器回调函数

Returns:
Object 返回标绘模型编辑器

initGraphic(options){Graphi}

engineExtensions/graphic/GraphicsLayer.js, line 1719

初始化Graphic对象

Name Type Description
options Object

初始化参数

Returns:
Type Description
Graphi 初始化的Graphi对象

loadJson(json)

engineExtensions/graphic/GraphicsLayer.js, line 1636
Name Type Description
json String

json格式的字符串。

removeAllGraphic(){Boolean}

engineExtensions/graphic/GraphicsLayer.js, line 1558
Returns:
Type Description
Boolean 移除是否成功

removeGraphicByGroupName(name)

engineExtensions/graphic/GraphicsLayer.js, line 1496
Name Type Description
name String

组名

removeGraphicByID(id, noRemove)

engineExtensions/graphic/GraphicsLayer.js, line 1482
Name Type Description
id String

图形ID

noRemove Boolean

不使用自带的remove

removeGraphicByIndex(index)

engineExtensions/graphic/GraphicsLayer.js, line 1523
Name Type Description
index String

图形序号

removeLastGraphic()

engineExtensions/graphic/GraphicsLayer.js, line 1542

removePickingGraphic()

engineExtensions/graphic/GraphicsLayer.js, line 1549

startDrawing(options)

engineExtensions/graphic/GraphicsLayer.js, line 278
Name Type Description
options Object
Name Type Default Description
type String 'none' 可选

绘制类型:参照Graphic.graphicType

isContinued Boolean true 可选

是否连续绘制

drawWithHeight Boolean false 可选

是否绘制高度,当为true时使用鼠标绘制高度,当为false时使用参数设置的统一高度

style Object 可选

图元样式信息 详情参见Style

editPointStyle Object 可选

编辑点样式信息 详情参见Style.EditPointStyle

attributes Object 可选

图元属性

name String 可选

图元名称

show Boolean true 可选

图元是否显示

asynchronous Boolean false 可选

默认为阻塞式更新,true为异步更新,false为阻塞式更新。

heading Number 0.0 可选

偏航角,弧度。

pitch Number 0.0 可选

俯仰角,弧度。

roll Number 0.0 可选

翻滚角,弧度。

transformX Number 0.0 可选

局部坐标系X方向平移量,单位米,X方向为纬线方向

transformY Number 0.0 可选

局部坐标系Y方向平移量,单位米,Y方向为经线方向

transformZ Number 0.0 可选

局部坐标系Z方向平移量,单位米,Z方向为垂直地表方向

Example
//初始化标绘图层
var graphicsLayer = new zonndy.cesium.GraphicsLayer(viewer, {});
viewer.scene.layers.appendGraphicsLayer(graphicsLayer);
//开始绘制Marker
graphicsLayer.startDrawing({
    type: 'marker',
    style: {
      //文字相对于图片方位
      labelPlaceType: 'topCenter',
      //文字相对于图片间距
      labelPadding: 20,
      //字体
      font: '30px sans-serif',
      //文字内容
      text: '这是Marker',
      //文字颜色
      fillColor: Cesium.Color.RED,
      //billboard图片链接
      image: 'http://webclient.smaryun.com:8200/NoneSpatialData/image/icon.png',
      //离地高度
      offsetHeight: 100
    }
});
-----------------------------------------------------------------------------------
//绘制div
graphicsLayer.startDrawing({
    //类型
    type: 'div',
    //样式
    style: {
       //html字符串或标签对象
       html: "你的html",
       //html相对原始位置的屏幕像素偏移
       pixelOffset: new Cesium.Cartesian2(0, 0),
       //额外抬升高度
       offsetHeight: 0
    },
    //开启时,当对象在模型内部时,会隐藏,开启此功能会有性能损耗
    enableVFC: false,
    //当div对象和主相机的距离超过20000000米时,隐藏div对象
    disappearByDistance: 20000000
});

startEdit()

engineExtensions/graphic/GraphicsLayer.js, line 1340

stopDrawing()

engineExtensions/graphic/GraphicsLayer.js, line 1273

stopEdit()

engineExtensions/graphic/GraphicsLayer.js, line 1347