Common Cesium-Plugin MapboxGL-Plugin Leaflet-Plugin OpenLayers-Plugin Video-Plugin
API文档
类名 GraphicsLayer

# new GraphicsLayer(viewer, options)

标绘图层
请参考以下示例:
1、初始化标绘图层
2、重写提示框对象
3、更多示例

参数:

名称 类型 默认值 描述
viewer Cesium.Viewer

场景视图对象，详见Cesium.Viewer
options Object

图层初始化参数
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

是否显示提示框

支持如下方法：
[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、移除整个图层]

示例

初始化标绘图层

// 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对象"
});

成员变量

EditTool

# readonly editTool

图层编辑工具

HashMap

# readonly graphicList

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

方法

# addGraphic(graphic, options)

添加绘制图形

参数:

名称 类型 描述
graphic Object

不同类型实体参考：参见Graphic.graphicType
options Object

额外参数

反回添加的图形

Graphic

# calculateBoundingSphere()

计算当前标绘图层的外包围球

外包围球。

Cesium.BoundingSphere

# destroy()

移除整个图层

# exportToJson()

整个图层导出为json文件

json格式的字符串。

String

# flyTo(options)

跳转到该图层

参数:

名称 类型 描述
options Object

跳转参数，参见Camera#flyToBoundingSphere

# getAllGraphic()

获取图层所有标绘图形

返回所有图形对象

Array.<Object>

# getGraphicByGroupName(name)

根据GroupName获取标绘图形对象

参数:

名称 类型 描述
name String

图形ID

返回对象组

Array.<Object> | Undefined

# getGraphicByID(id)

根据ID获取标绘图形对象

参数:

名称 类型 描述
id String

图形ID

返回图层对象或者返回false查询失败

Object | Undefined

# getGraphicByIndex(index)

根据序号获取标绘图形对象

参数:

名称 类型 描述
index String

图形序号

返回图形对象

Object

# getGraphicByName(name, type)

根据name获取标绘图形对象

参数:

名称 类型 描述
name String

图形ID
type String

类型，equal、like

返回对象组

Array.<Object> | Undefined

# getIndexByGraphic()

根据对象获取index

Boolean

# getTransformEditor(Graphic, getViewModel)

获取标绘模型编辑器

参数:

名称 类型 描述
Graphic Object

模型对象
getViewModel function

模型编辑器回调函数

Object 返回标绘模型编辑器

# loadJson(json)

加载json文件

参数:

名称 类型 描述
json String

json格式的字符串。

# removeAllGraphic()

移除图层所有标绘图形

移除是否成功

Boolean

# removeGraphicByGroupName(name)

根据GroupName移除一组标绘图形

参数:

名称 类型 描述
name String

组名

# removeGraphicByID(id, noRemove)

根据ID移除标绘图形

参数:

名称 类型 描述
id String

图形ID
noRemove Boolean

不使用自带的remove

# removeGraphicByIndex(index)

根据序号移除标绘图形

参数:

名称 类型 描述
index String

图形序号

# removeLastGraphic()

移除最后一个标绘图形

# removePickingGraphic()

移除选中标绘图形

# startDrawing(options)

开始绘制图形 (注意：内部会开始地形深度检测功能)

参数:

名称 类型 默认值 描述
options Object
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方向为垂直地表方向
示例
//初始化标绘图层
var graphicsLayer = new 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()

开始编辑

# stopDrawing()

移除所有鼠标事件，停止绘制

# stopEdit()

停止编辑

构造函数
成员变量
方法
事件