Class: MapView

Extends

• BaseView

Members

allLayerViewsCollection

所有图层视图

basemapLayerViewsCollection

图层视图

centerArray

视图中心点

cursorString

鼠标样式，参考css的cursor样式

extendPropsObject

当前图层对象上不支持的属性，二次开发用户希望挂在图层对像上的属性可以存储到该属性中

Default Value:

{}

Events

inherited 图层比例尺显示隐藏状态更新事件。当前仅支持非组图层以及场景子图层

view/BaseView.js, line 340

Properties:

Name	Type	Description
event	Object	事件对象 Properties Name Type Default Description type LayerEventType 'layerview-created-error' 可选 事件类型 layer Layer 可选 事件接收对象 view BaseView 可选 事件地图视图对象 error String 可选 错误消息
event	LayerViewScaleVisibleEvent	事件对象 Properties Name Type Default Description type LayerEventType 'layerview-scale-visible' 可选 事件类型 view.on('layerview-scale-visible', (event) => { console.log("图层比例尺显示隐藏状态更新事件:", event) })

Example

视图图层创建错误事件

view.on('layerview-created-error', (event) => {
  console.log("添加地图图层事件:", event)
})
 
/**

inherited 地图大小变化事件

view/BaseView.js, line 238

Properties:

Name	Type	Description
event	Object	事件对象 Properties Name Type Default Description type LayerEventType 'resize' 可选 事件类型 oldWidth Number 可选 变化前的视图宽度，单位px oldHeight Number 可选 变化前的视图高度，单位px width Number 可选 变化后的视图高度，单位px height Number 可选 变化后的视图高度，单位px sourceTarget BaseView 可选 事件发起对象 target Map 可选 事件接收对象 event Object 可选 事件对象

Example

地图大小变化事件

view.on('resize', (event) => {
  console.log("地图大小变化事件:", event)
})

inherited 地图视图加载完毕事件

view/BaseView.js, line 92

Properties:

Name	Type	Description
event	Object	事件对象

Example

地图视图加载完毕事件

view.on('loaded', (event) => {
  console.log("点击事件:", event)
})

inherited 地图视图改变事件

view/BaseView.js, line 299

Properties:

Name	Type	Description
event	Object	事件对象 Properties Name Type Default Description type LayerEventType 'view-change' 可选 事件类型 target BaseView 可选 事件接收对象 mapView BaseView 可选 事件地图视图对象 scale Number 可选 事件地图比例尺 zoom Number 可选 事件地图层级 center Point 可选 事件地图视图中心

Example

地图视野改变事件

view.on('view-change', (event) => {
  console.log("地图视图改变事件:", event)
})

inherited 引擎视图创建完毕事件

view/BaseView.js, line 285

Properties:

Name	Type	Description
event	Object	事件对象 Properties Name Type Default Description type ViewEventType 'innerView-created' 可选 事件类型 innerView Object 可选 引擎地图对象 sourceTarget BaseView 可选 事件发起对象 target Map 可选 事件接收对象 event Object 可选 事件对象

Example

引擎视图创建完毕事件

view.on('innerView-created', (event) => {
  console.log("引擎视图创建完毕事件:", event)
})

inherited 视图图层创建事件

view/BaseView.js, line 314

Properties:

Name	Type	Description
event	Object	事件对象 Properties Name Type Default Description type LayerEventType 'layerview-created' 可选 事件类型 layer Layer 可选 事件接收对象 layerView LayerView 可选 事件地图视图中心 view BaseView 可选 事件地图视图对象

Example

视图图层创建事件

view.on('layerview-created', (event) => {
  console.log("添加地图图层事件:", event)
})

inherited 视图图层移除事件

view/BaseView.js, line 327

Properties:

Name	Type	Description
event	Object	事件对象 Properties Name Type Default Description type LayerEventType 'layerview-remove' 可选 事件类型 layer Layer 可选 事件接收对象 layerView LayerView 可选 事件地图视图中心 view BaseView 可选 事件地图视图对象

Example

视图图层移除事件

view.on('layerview-remove', (event) => {
  console.log("销毁地图图层事件:", event)
})

inherited 键盘抬起事件

view/BaseView.js, line 270

Properties:

Name	Type	Description
event	Object	事件对象 Properties Name Type Default Description type LayerEventType 'key-up' 可选 事件类型 key String 可选 变化后的视图高度，单位px timeStamp Number 可选 时间戳，单位ms sourceTarget BaseView 可选 事件发起对象 target Map 可选 事件接收对象 event Object 可选 事件对象

Example

键盘抬起事件

view.on('key-up', (event) => {
  console.log("键盘抬起事件:", event)
})

inherited 键盘按下事件

view/BaseView.js, line 255

Properties:

Name	Type	Description
event	Object	事件对象 Properties Name Type Default Description type LayerEventType 'key-down' 可选 事件类型 key String 可选 变化后的视图高度，单位px timeStamp Number 可选 时间戳，单位ms sourceTarget BaseView 可选 事件发起对象 target Map 可选 事件接收对象 event Object 可选 事件对象

Example

键盘按下事件

view.on('key-down', (event) => {
  console.log("键盘按下事件:", event)
})

inherited 鼠标双击事件

view/BaseView.js, line 141

Properties:

Name	Type	Description
event	Object	事件对象 Properties Name Type Default Description type LayerEventType 'double-click' 可选 事件类型 mapPoint Object 可选 鼠标在地图上的经纬度位置 longitude Object 可选 鼠标的经度坐标，单位度 latitude Object 可选 鼠标的纬度坐标，单位度 x Object 可选 鼠标的像素x坐标，单位px y Object 可选 鼠标的像素y坐标，单位px timeStamp Object 可选 时间戳，单位ms sourceTarget BaseView 可选 事件发起对象 target Map 可选 事件接收对象 event Object 可选 事件对象

Example

鼠标双击事件

view.on('double-click', (event) => {
  console.log("双击事件:", event)
})

inherited 鼠标抬起事件

view/BaseView.js, line 179

Properties:

Name	Type	Description
event	Object	事件对象 Properties Name Type Default Description type LayerEventType 'pointer-up' 可选 事件类型 mapPoint Object 可选 鼠标在地图上的经纬度位置 longitude Object 可选 鼠标的经度坐标，单位度 latitude Object 可选 鼠标的纬度坐标，单位度 x Object 可选 鼠标的像素x坐标，单位px y Object 可选 鼠标的像素y坐标，单位px timeStamp Object 可选 时间戳，单位ms sourceTarget BaseView 可选 事件发起对象 target Map 可选 事件接收对象 event Object 可选 事件对象

Example

鼠标抬起事件

view.on('pointer-up', (event) => {
  console.log("鼠标抬起事件:", event)
})

inherited 鼠标拖拽事件

view/BaseView.js, line 217

Properties:

Name	Type	Description
event	Object	事件对象 Properties Name Type Default Description type LayerEventType 'drag' 可选 事件类型 x Object 可选 鼠标的像素x坐标，单位px y Object 可选 鼠标的像素y坐标，单位px button Number 可选 buttons Number 可选 cancelable Boolean 可选 origin Object 可选 拖拽起点 stopPropagation function 可选 阻止事件捕获或冒泡 timeStamp Object 可选 时间戳，单位ms native Object 可选 事件对象 action String 可选 拖拽状态 type String 可选 事件类型

Example

鼠标拖拽事件

view.on('drag', (event) => {
  console.log("鼠标拖拽事件:", event)
})

inherited 鼠标按下事件

view/BaseView.js, line 160

Properties:

Name	Type	Description
event	Object	事件对象 Properties Name Type Default Description type LayerEventType 'pointer-down' 可选 事件类型 mapPoint Object 可选 鼠标在地图上的经纬度位置 longitude Object 可选 鼠标的经度坐标，单位度 latitude Object 可选 鼠标的纬度坐标，单位度 x Object 可选 鼠标的像素x坐标，单位px y Object 可选 鼠标的像素y坐标，单位px timeStamp Object 可选 时间戳，单位ms sourceTarget BaseView 可选 事件发起对象 target Map 可选 事件接收对象 event Object 可选 事件对象

Example

鼠标按下事件

view.on('pointer-down', (event) => {
  console.log("鼠标按下事件:", event)
})

inherited 鼠标点击事件

view/BaseView.js, line 101

Properties:

Name	Type	Description
event	Object	事件对象 Properties Name Type Default Description type LayerEventType 'click' 可选 事件类型 mapPoint Object 可选 鼠标在地图上的经纬度位置 x Object 可选 鼠标的像素x坐标，单位px y Object 可选 鼠标的像素y坐标，单位px button Number 可选 buttons Number 可选 stopPropagation function 可选 阻止事件捕获或冒泡 timeStamp Object 可选 时间戳，单位ms native Object 可选 事件对象 sourceTarget BaseView 可选 事件发起对象 target Map 可选 事件接收对象

Example

鼠标点击事件

view.on('click', (event) => {
  console.log("点击事件:", event)
})

inherited 鼠标点击立即响应事件

view/BaseView.js, line 121

Properties:

Name	Type	Description
event	Object	事件对象 Properties Name Type Default Description type LayerEventType 'immediate-click' 可选 事件类型 mapPoint Object 可选 鼠标在地图上的经纬度位置 x Object 可选 鼠标的像素x坐标，单位px y Object 可选 鼠标的像素y坐标，单位px button Number 可选 buttons Number 可选 stopPropagation function 可选 阻止事件捕获或冒泡 timeStamp Object 可选 时间戳，单位ms native Object 可选 事件对象 sourceTarget BaseView 可选 事件发起对象 target Map 可选 事件接收对象

Example

鼠标立即点击事件

view.on('immediate-click', (event) => {
  console.log("点击事件:", event)
})

inherited 鼠标移动事件

view/BaseView.js, line 198

Properties:

Name	Type	Description
event	Object	事件对象 Properties Name Type Default Description type LayerEventType 'pointer-move' 可选 事件类型 mapPoint Object 可选 鼠标在地图上的经纬度位置 longitude Object 可选 鼠标的经度坐标，单位度 latitude Object 可选 鼠标的纬度坐标，单位度 x Object 可选 鼠标的像素x坐标，单位px y Object 可选 鼠标的像素y坐标，单位px timeStamp Object 可选 时间戳，单位ms sourceTarget BaseView 可选 事件发起对象 target Map 可选 事件接收对象 event Object 可选 事件对象

Example

鼠标移动事件

view.on('pointer-move', (event) => {
  console.log("鼠标移动事件:", event)
})

Methods

MapView.fromJSON(json){MapView}

view/MapView.js, line 336

通过一个配置生成一个场景视图对象

Name	Type	Description
json	Object	场景视图配置

Returns:

Type	Description
MapView

inherited _processSpatialReferenceChange(event){*}

view/BaseView.js, line 1013

空间参考系改变

Name	Type	Description
event	LayerEvent

Returns:

Type	Description
*

inherited destroy()

view/BaseView.js, line 616

销毁视图方法

inherited getInnerLayer(layerDef, sublayerDef){Object|null}

view/BaseView.js, line 577

获取图层或子图层对应的实际图层对象

Name	Type	Description
layerDef	Object | String	图层对象或者图层id
sublayerDef	SubLayer | String | null	默认为null,子图层对象或者子图层id,设置后会查询图层内对应子图层的实际对象。当前仅支持场景子图层。

Returns:

Type	Description
Object | null	实际图层对象

Example

根据基础图层对象或者图层id查询并返回实际图层

// ES5引入方式
const { IGSSceneLayer } = zondy.layer
// ES6引入方式
import { IGSSceneLayer } from "@mapgis/webclient-cesium-plugin"
// 添加一个场景图层
const igsSceneLayer = new IGSSceneLayer({
  url: 'http://192.168.82.89:8089/igs/rest/g3d/Scene:DaYanTa-M3D'
});
map.add(igsSceneLayer);
// 添加完毕后，过去实际图层对象
igsSceneLayer.on("layerview-created", function (result) {
  console.log("加载完毕:", result.layer)
  const innerLayer = view.getInnerLayer(igsSceneLayer)
  console.log("innerLayer:", innerLayer)
})

inherited getInnerView(){Object}

view/BaseView.js, line 551

获取引擎视图对象,在leaflet引擎上返回leafelt map,在cesium引擎上返回cesium viewer

Returns:

Type	Description
Object

inherited getLayer(layerId){Layer}

view/BaseView.js, line 608

根据基础图层id查询并返回基础图层对象

Name	Type	Description
layerId	String	基础图层ID

Returns:

Type	Description
Layer	基础图层对象

inherited setMap(map)

view/BaseView.js, line 519

添加图层管理容器

Name	Type	Description
map	Map	图层管理容器

toJSON(){Object}

view/MapView.js, line 324

转换为json对象

Returns:

Type	Description
Object	json对象