@mapgis/webclient-leaflet-plugin
Version:
3,473 lines • 95.8 kB
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title> SketchEditor2D</title>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="styles/app.min.css">
<link type="text/css" rel="stylesheet" href="styles/iframe.css">
<link type="text/css" rel="stylesheet" href="">
</head>
<body class="layout small-header">
<div id="stickyNavbarOverlay"></div>
<div class="top-nav">
<div class="inner">
<a id="hamburger" role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
<div class="logo">
<h1> MapGIS Client for JavaScript API</h1>
</div>
<div class="menu">
<div class="navigation">
<a
class="link user-link "
href="/docs/cesium/index.html"
>
Cesium
</a>
<a
class="link user-link "
href="/docs/mapboxgl/index.html"
>
MapboxGL
</a>
<a
class="link user-link "
href="/docs/leaflet/index.html"
>
Leaflet
</a>
<a
class="link user-link "
href="/docs/openlayers/index.html"
>
OpenLayers
</a>
</div>
</div>
</div>
</div>
<div id="main">
<div
class="sidebar "
id="sidebarNav"
>
<div>
<span class="mapgis-api-document-span"><a href="index.html">API文档</a></span>
</div>
<div class="search-wrapper">
<input id="search" type="text" placeholder="搜索文档..." class="input">
</div>
<nav>
<div class="category"><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">服务模块</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="AddressServer.html">AddressServer</a><span style="display: none;"><p>地址服务，基地址：/igs/rest/services/{folder}/{serviceName}/AddressServer</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="ArcGISFeatureServer.html">ArcGISFeatureServer</a><span style="display: none;"><p>ArcGIS的FeatureServer服务</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="ArcGISGeometryServer.html">ArcGISGeometryServer</a><span style="display: none;"><p>ArcGIS的GeometryServer服务</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="ArcGISMapServer.html">ArcGISMapServer</a><span style="display: none;"><p>ArcGIS的MapServer服务</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="ArcGISVectorTileServer.html">ArcGISVectorTileServer</a><span style="display: none;"><p>ArcGIS的VectorTileServer服务</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="BaseServer.html">BaseServer</a><span style="display: none;"><p>服务查询基类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Cesium3DTilesServer.html">Cesium3DTilesServer</a><span style="display: none;"><p>3DTiles服务，基地址：/igs/rest/services/{folder}/{serviceName}/3DTilesServer</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Config.html">Config</a><span style="display: none;"><p>全局配置信息<br/>
示例如下：<br/>
<a href='#config1'>[1、设置全局token]</a><br/>
<a href='#config2'>[2、设置全局headers]</a><br/>
<a href='#config3'>[3、设置拦截器 - 在所有链接上设置拦截器]</a><br/>
<a href='#config4'>[4、设置拦截器 - 指定拦截器应用的url]</a><br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="FeatureServer.html">FeatureServer</a><span style="display: none;"><p>要素服务</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="GeometryServer.html">GeometryServer</a><span style="display: none;"><p>地理几何服务</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="ImageServer.html">ImageServer</a><span style="display: none;"><p>影像服务，服务地址：/igs/rest/services/{folder}/{serviceName}/ImageServer</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Interceptor.html">Interceptor</a><span style="display: none;"><p>请求拦截和相应拦截器参数</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="M3DServer.html">M3DServer</a><span style="display: none;"><p>M3d服务，服务地址:/igs/rest/services/{folder}/{serviceName}/M3dServer</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="MapServer.html">MapServer</a><span style="display: none;"><p>地图服务</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="PlotServer.html">PlotServer</a><span style="display: none;"><p>标绘服务</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="PoiServer.html">PoiServer</a><span style="display: none;"><p>兴趣点服务,服务地址：/igs/rest/services/{folder}/{serviceName}/PoiServer</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="RequestConfig.html">RequestConfig</a><span style="display: none;"><p>请求配置参数</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="RequestInterceptor.html">RequestInterceptor</a><span style="display: none;"><p>请求拦截器对象</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="ResourceServer.html">ResourceServer</a><span style="display: none;"><p>资源服务，基地址为http://{ip}:{port}/igs/rest/services/system/ResourceServer</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="ResponseInterceptor.html">ResponseInterceptor</a><span style="display: none;"><p>响应拦截器对象</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="RootServer.html">RootServer</a><span style="display: none;"><p>根目录服务</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SceneServer.html">SceneServer</a><span style="display: none;"><p>场景服务</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SecurityServer.html">SecurityServer</a><span style="display: none;"><p>安全服务,服务地址:/igs/rest/services/SecurityServer</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="TerrainServer.html">TerrainServer</a><span style="display: none;"><p>地形缓存服务，基地址:/igs/rest/services/{folder}/{serviceName}/TerrainServer</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="ThemeServer.html">ThemeServer</a><span style="display: none;"><p>专题图服务</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="TileServer.html">TileServer</a><span style="display: none;"><p>瓦片服务,基地址：/igs/rest/services/{folder}/{serviceName}/TileServer</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="VectorTileServer.html">VectorTileServer</a><span style="display: none;"><p>矢量瓦片服务</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="WFSServer.html">WFSServer</a><span style="display: none;"><p>IGS的WFS服务</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="WMSServer.html">WMSServer</a><span style="display: none;"><p>IGS的WMS服务</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="WMTSServer.html">WMTSServer</a><span style="display: none;"><p>IGS的WMTS服务</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="WorkFlowServer.html">WorkFlowServer</a><span style="display: none;"><p>工作流服务,基地址http://{ip}:{port}/igs/rest/services/workflow/{serviceName}/WorkflowServer</p></span></li></ul><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">图层模块</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="ArcGISMapImageLayer.html">ArcGISMapImageLayer</a><span style="display: none;"><p>ArcGIS地图图片图层，<br/>
目前二维上支持4326(包括4490，4214以及4610)，3857以及EPSG支持的自定义坐标系，三维上仅支持4326(包括4490，4214以及4610)以及3857坐标系，会自动读取元信息上的坐标系，不需要用户指定
<br><br>[ES5引入方式]：<br/>
Zondy.Layer.ArcGISMapImageLayer() <br/>
[ES6引入方式]：<br/>
import { ArcGISMapImageLayer } from "@mapgis/webclient-common" <br/>
<br/>
针对图层的操作请在图层加载完毕事件中进行<br/>
Layer.on('layerview-created', function (result) {<br/>
console.log("加载完毕:", result.layer)<br/>
});<br/>
如果不想在该事件中放入业务代码，则请确认图层资源已加载完毕后再进行操作<br/>
if(layer.loadStatus === 'loaded') {<br/>
// 你的业务逻辑<br/>
}</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="ArcGISMapImageSubLayer.html">ArcGISMapImageSubLayer</a><span style="display: none;"><p>ArcGIS地图图片子图层</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="ArcGISTileLayer.html">ArcGISTileLayer</a><span style="display: none;"><p>ArcGIS瓦片图层，<br>
目前二维上支持4326(包括4490，4214以及4610)，3857以及EPSG支持的自定义坐标系，三维上仅支持4326(包括4490，4214以及4610)以及3857坐标系，会自动读取元信息上的坐标系，不需要用户指定，
<br><br>[ES5引入方式]：<br/>
Zondy.Layer.ArcGISTileLayer() <br/>
[ES6引入方式]：<br/>
import { ArcGISTileLayer } from "@mapgis/webclient-common" <br/>
<br/>
针对图层的操作请在图层加载完毕事件中进行<br/>
Layer.on('layerview-created', function (result) {<br/>
console.log("加载完毕:", result.layer)<br/>
});<br/>
如果不想在该事件中放入业务代码，则请确认图层资源已加载完毕后再进行操作<br/>
if(layer.loadStatus === 'loaded') {<br/>
// 你的业务逻辑<br/>
}</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Cesium3DTilesCacheLayer.html">Cesium3DTilesCacheLayer</a><span style="display: none;"><p>Cesium3DTiles图层</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="EchartsLayer.html">EchartsLayer</a><span style="display: none;"><p>Echarts图层</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="FeatureLayer.html">FeatureLayer</a><span style="display: none;"><p>要素图层基类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="GeoJSONLayer.html">GeoJSONLayer</a><span style="display: none;"><p>geojson图层，仅支持文件服务<br/>
目前二维和三维上支持4326(包括4490，4214以及4610)，3857以及EPSG支持的自定义坐标系，若是想要绘制源数据为非4326坐标系几何数据，需要在初始化时指定具体坐标系<br/>
参考示例：<br/>
<a href='#add-GeoJSONLayer'>[加载GeoJSON图层]</a>
<br><br>[ES5引入方式]：<br/>
Zondy.Layer.GraphicsLayer() <br/>
[ES6引入方式]：<br/>
import { GraphicsLayer } from "@mapgis/webclient-common"</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="GraphicsLayer.html">GraphicsLayer</a><span style="display: none;"><p>几何图形图层，不支持在线数据，仅支持传入多个几何对象并绘制<br/>
目前二维和三维上支持4326(包括4490，4214以及4610)，3857以及EPSG支持的自定义坐标系，若是想要绘制非4326坐标系几何，需要在初始化要素对象的几何时，指定具体坐标系
<br><br>[ES5引入方式]：<br/>
Zondy.Layer.GraphicsLayer() <br/>
[ES6引入方式]：<br/>
import { GraphicsLayer } from "@mapgis/webclient-common" <br/>
<br/>
针对图层的操作请在图层加载完毕事件中进行<br/>
Layer.on('layerview-created', function (result) {<br/>
console.log("加载完毕:", result.layer)<br/>
});<br/>
如果不想在该事件中放入业务代码，则请确认图层资源已加载完毕后再进行操作<br/>
if(layer.loadStatus === 'loaded') {<br/>
// 你的业务逻辑<br/>
}</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="GroupLayer.html">GroupLayer</a><span style="display: none;"><p>组图层，支持的图层类型有：WMS图层、WMTS图层、地图图层、瓦片图层、cesium3DTiles图层、echarts图层、
M3D图层、场景图层、矢量瓦片图层、mapv图层、地形图层
<br><br>[ES5引入方式]：<br/>
Zondy.Layer.GroupLayer() <br/>
[ES6引入方式]：<br/>
import { GroupLayer } from "@mapgis/webclient-common" <br/>
<br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="IGSFeatureLayer.html">IGSFeatureLayer</a><span style="display: none;"><p>IGS要素图层，<br>
目前二维和三维上支持4326(包括4490，4214以及4610)，3857以及EPSG支持的自定义坐标系，要素服务会自动读取元信息上的坐标系，不需要用户指定
<br><br>[ES5引入方式]：<br/>
Zondy.Layer.IGSFeatureLayer() <br/>
[ES6引入方式]：<br/>
import { IGSFeatureLayer } from "@mapgis/webclient-common" <br/>
<br/>
针对图层的操作请在图层加载完毕事件中进行<br/>
Layer.on('layerview-created', function (result) {<br/>
console.log("加载完毕:", result.layer)<br/>
});<br/>
如果不想在该事件中放入业务代码，则请确认图层资源已加载完毕后再进行操作<br/>
if(layer.loadStatus === 'loaded') {<br/>
// 你的业务逻辑<br/>
}</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="IGSImageLayer.html">IGSImageLayer</a><span style="display: none;"><p>IGS影像图层</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="IGSMapImageLayer.html">IGSMapImageLayer</a><span style="display: none;"><p>IGS地图图片图层，<br/>
支持IGS1.0和2.0两个服务版本，目前二维上支持4326(包括4490，4214以及4610)，3857以及EPSG支持的自定义坐标系，三维上仅支持4326(包括4490，4214以及4610)以及3857坐标系，会自动读取元信息上的坐标系，不需要用户指定<br/>
<br><br>[ES5引入方式]：<br/>
Zondy.Layer.IGSMapImageLayer() <br/>
[ES6引入方式]：<br/>
import { IGSMapImageLayer } from "@mapgis/webclient-common" <br/>
<br/>
针对图层的操作请在图层加载完毕事件中进行<br/>
Layer.on('layerview-created', function (result) {<br/>
console.log("加载完毕:", result.layer)<br/>
});<br/>
如果不想在该事件中放入业务代码，则请确认图层资源已加载完毕后再进行操作<br/>
if(layer.loadStatus === 'loaded') {<br/>
// 你的业务逻辑<br/>
}</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="IGSMapImageSubLayer.html">IGSMapImageSubLayer</a><span style="display: none;"><p>IGS地图图片图层的子图层</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="IGSSceneLayer.html">IGSSceneLayer</a><span style="display: none;"><p>IGS的SceneLayer图层</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="IGSTileLayer.html">IGSTileLayer</a><span style="display: none;"><p>IGS瓦片图层，<br>
支持IGS1.0和2.0两个服务版本，目前二维上支持4326(包括4490，4214以及4610)，3857以及EPSG支持的自定义坐标系，三维上仅支持4326(包括4490，4214以及4610)以及3857坐标系，会自动读取元信息上的坐标系，不需要用户指定，
<br><br>[ES5引入方式]：<br/>
Zondy.Layer.IGSTileLayer() <br/>
[ES6引入方式]：<br/>
import { IGSTileLayer } from "@mapgis/webclient-common" <br/>
<br/>
针对图层的操作请在图层加载完毕事件中进行<br/>
Layer.on('layerview-created', function (result) {<br/>
console.log("加载完毕:", result.layer)<br/>
});<br/>
如果不想在该事件中放入业务代码，则请确认图层资源已加载完毕后再进行操作<br/>
if(layer.loadStatus === 'loaded') {<br/>
// 你的业务逻辑<br/>
}</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="IGSVectorTileLayer.html">IGSVectorTileLayer</a><span style="display: none;"><p>IGS矢量瓦片图层
支持IGS1.0和2.0两个服务版本，目前二维和三维上支持4326(包括4490，4214以及4610)，3857，会自动读取元信息上的坐标系，不需要用户指定，
<br><br>[ES5引入方式]：<br/>
Zondy.Layer.IGSVectorTileLayer() <br/>
[ES6引入方式]：<br/>
import { IGSVectorTileLayer } from "@mapgis/webclient-common" <br/>
<br/>
针对图层的操作请在图层加载完毕事件中进行<br/>
Layer.on('layerview-created', function (result) {<br/>
console.log("加载完毕:", result.layer)<br/>
});<br/>
如果不想在该事件中放入业务代码，则请确认图层资源以加载完毕后再进行操作<br/>
if(layer.loadStatus === 'loaded') {<br/>
// 你的业务逻辑<br/>
}
<br/>
<br/>
注意:三维上,不支持简单Marker样式设定;二维上,简单Marker的颜色,外边线样式,旋转角度无法在图层初始化和初始化后修改,须在制作数据时进行指定</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="IGSVectorTileSubLayer.html">IGSVectorTileSubLayer</a><span style="display: none;"><p>IGS矢量瓦片子图层</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Layer.html">Layer</a><span style="display: none;"><p>图层基类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="M3DModelCacheLayer.html">M3DModelCacheLayer</a><span style="display: none;"><p>M3D缓存图层</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="MapImageLayer.html">MapImageLayer</a><span style="display: none;"><p>影像图层基类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="MapVLayer.html">MapVLayer</a><span style="display: none;"><p>MapV图层</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="OGCLayer.html">OGCLayer</a><span style="display: none;"><p>OGS图层基类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="OverlayLayer.html">OverlayLayer</a><span style="display: none;"><p>覆盖物图层</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Scene.html">Scene</a><span style="display: none;"><p>场景对象</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SceneLayer.html">SceneLayer</a><span style="display: none;"><p>场景图层基类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SubLayer.html">SubLayer</a><span style="display: none;"><p>子图层基类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="TerrainCacheLayer.html">TerrainCacheLayer</a><span style="display: none;"><p>地形图层</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="TileLayer.html">TileLayer</a><span style="display: none;"><p>瓦片图层基类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="UnknownLayer.html">UnknownLayer</a><span style="display: none;"><p>未定义图层</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="VectorTileLayer.html">VectorTileLayer</a><span style="display: none;"><p>图层基类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="WFSLayer.html">WFSLayer</a><span style="display: none;"><p>WFS图层，<br>
目前二维和三维上支持4326(包括4490，4214以及4610)，3857以及EPSG支持的自定义坐标系，WFS服务会自动读取元信息上的坐标系，不需要用户指定
<br><br>[ES5引入方式]：<br/>
Zondy.Layer.WMTSLayer() <br/>
[ES6引入方式]：<br/>
import { WMTSLayer } from "@mapgis/webclient-common" <br/>
<br/>
针对图层的操作请在图层加载完毕事件中进行<br/>
Layer.on('layerview-created', function (result) {<br/>
console.log("加载完毕:", result.layer)<br/>
});<br/>
如果不想在该事件中放入业务代码，则请确认图层资源已加载完毕后再进行操作<br/>
if(layer.loadStatus === 'loaded') {<br/>
// 你的业务逻辑<br/>
}</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="WMSLayer.html">WMSLayer</a><span style="display: none;"><p>WMS图层，<br/>
目前二维上支持4326(包括4490，4214以及4610)，3857以及EPSG支持的自定义坐标系，三维上仅支持4326(包括4490，4214以及4610)以及3857坐标系，会自动读取元信息上的坐标系，不需要用户指定，同时所有的WMS服务都支持动态投影，用户也可指定任意该服务支持的坐标系<br/>
<br>[ES5引入方式]：<br/>
Zondy.Layer.WMSLayer() <br/>
[ES6引入方式]：<br/>
import { WMSLayer } from "@mapgis/webclient-common" <br/>
<br/>
针对图层的操作请在图层加载完毕事件中进行<br/>
Layer.on('layerview-created', function (result) {<br/>
console.log("加载完毕:", result.layer)<br/>
});<br/>
如果不想在该事件中放入业务代码，则请确认图层资源已加载完毕后再进行操作<br/>
if(layer.loadStatus === 'loaded') {<br/>
// 你的业务逻辑<br/>
}</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="WMSSubLayer.html">WMSSubLayer</a><span style="display: none;"><p>WMS子图层</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="WMTSLayer.html">WMTSLayer</a><span style="display: none;"><p>WMTS图层，<br>
目前二维上支持4326(包括4490，4214以及4610)，3857以及EPSG支持的自定义坐标系，三维上仅支持4326(包括4490，4214以及4610)以及3857坐标系，WMTS服务会自动读取元信息上的坐标系，不需要用户指定
<br><br>[ES5引入方式]：<br/>
Zondy.Layer.WMTSLayer() <br/>
[ES6引入方式]：<br/>
import { WMTSLayer } from "@mapgis/webclient-common" <br/>
<br/>
针对图层的操作请在图层加载完毕事件中进行<br/>
Layer.on('layerview-created', function (result) {<br/>
console.log("加载完毕:", result.layer)<br/>
});<br/>
如果不想在该事件中放入业务代码，则请确认图层资源已加载完毕后再进行操作<br/>
if(layer.loadStatus === 'loaded') {<br/>
// 你的业务逻辑<br/>
}</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="WMTSSubLayer.html">WMTSSubLayer</a><span style="display: none;"><p>IGS地图服务图层</p></span></li></ul><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">渲染器模块</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="BaseRenderer.html">BaseRenderer</a><span style="display: none;"><p>专题图渲染基类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="ClassBreakInfo.html">ClassBreakInfo</a><span style="display: none;"><p>三维专题图-分段信息</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="ClassBreakRenderer.html">ClassBreakRenderer</a><span style="display: none;"><p>分段专题图渲染样式，支持的图层如下：<br/>
<a href="IGSMapImageLayer.html"><code>IGS地图图片图层</code></a>、<a href="GraphicsLayer.html"><code>几何图形图层</code></a>、<a href="IGSFeatureLayer.html"><code>IGS要素图层</code></a>、
<a href="GeoJSONLayer.html"><code>geojson图层</code></a>、<a href="WFSLayer.html"><code>OGC-WFS图层</code></a></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="ColorStop.html">ColorStop</a><span style="display: none;"><p>颜色分段</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="ColorVariable.html">ColorVariable</a><span style="display: none;"><p>color视觉变量</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="OpacityStop.html">OpacityStop</a><span style="display: none;"><p>透明度分段</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="OpacityVariable.html">OpacityVariable</a><span style="display: none;"><p>opacity视觉变量</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SimpleRenderer.html">SimpleRenderer</a><span style="display: none;"><p>统一专题图渲染样式，支持的图层如下：<br/>
<a href="GraphicsLayer.html"><code>几何图形图层</code></a>、<a href="IGSFeatureLayer.html"><code>IGS要素图层</code></a>、
<a href="GeoJSONLayer.html"><code>geojson图层</code></a>、<a href="WFSLayer.html"><code>OGC-WFS图层</code></a></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SizeStop.html">SizeStop</a><span style="display: none;"><p>size视觉变量</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SizeVariable.html">SizeVariable</a><span style="display: none;"><p>color视觉变量</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="UniqueValueInfo.html">UniqueValueInfo</a><span style="display: none;"><p>三维专题图-单值信息</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="UniqueValueRenderer.html">UniqueValueRenderer</a><span style="display: none;"><p>单值专题图渲染样式，支持的图层如下：<br/>
<a href="IGSMapImageLayer.html"><code>IGS地图图片图层</code></a>、<a href="GraphicsLayer.html"><code>几何图形图层</code></a>、<a href="IGSFeatureLayer.html"><code>IGS要素图层</code></a>、
<a href="GeoJSONLayer.html"><code>geojson图层</code></a>、<a href="WFSLayer.html"><code>OGC-WFS图层</code></a></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="VisualVariable.html">VisualVariable</a><span style="display: none;"><p>视觉变量基类</p></span></li></ul><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">视图模块</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="BaseView.html">BaseView</a><span style="display: none;"><p>视图类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="MapView.html">MapView</a><span style="display: none;"><p>二维场景视图(leaflet引擎)，对地图引擎进行管理，如果要对地图图层进行管理请参考<a href="Map.html"><code>Map</code></a>，<br/>
参考示例：
<a href='#MapView'>[初始化二维场景视图]</a>
<br>[ES5引入方式]：<br/>
Zondy.MapView() <br/>
[ES6引入方式]：<br/>
import { MapView } from '@mapgis/webclient-leaflet-plugin' <br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="VideoMapView.html">VideoMapView</a><span style="display: none;">undefined</span></li></ul><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">几何模块</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Circle.html">Circle</a><span style="display: none;"><p>几何圆，参考示例：<a href='#Circle'>[几何圆对象]</a>
<br><br>[ES5引入方式]：<br/>
Zondy.Geometry.Circle() <br/>
[ES6引入方式]：<br/>
import { Circle } from "@mapgis/webclient-common" <br/>
<br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Extent.html">Extent</a><span style="display: none;"><p>几何范围对象，即左下角和右上角组成的矩形范围几何对象，参考示例：<a href='#Extent'>[几何范围对象]</a>
<br><br>[ES5引入方式]：<br/>
Zondy.Geometry.Extent() <br/>
[ES6引入方式]：<br/>
import { Extent } from "@mapgis/webclient-common" <br/>
<br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Geometry.html">Geometry</a><span style="display: none;"><p>几何图形对象基类
<br><br>[ES5引入方式]：<br/>
Zondy.Geometry.Geometry() <br/>
[ES6引入方式]：<br/>
import { Geometry } from "@mapgis/webclient-common" <br/>
<br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="GeometryEngine.html">GeometryEngine</a><span style="display: none;"><p>几何分析工具</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="LineString.html">LineString</a><span style="display: none;"><p>线几何对象
<br><br>[ES5引入方式]：<br/>
Zondy.Geometry.LineString() <br/>
[ES6引入方式]：<br/>
import { LineString } from "@mapgis/webclient-common" <br/>
<br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="MultiLineString.html">MultiLineString</a><span style="display: none;"><p>多线段几何
<br><br>[ES5引入方式]：<br/>
Zondy.Geometry.MultiLineString() <br/>
[ES6引入方式]：<br/>
import { MultiLineString } from "@mapgis/webclient-common" <br/>
<br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="MultiPoint.html">MultiPoint</a><span style="display: none;"><p>多点几何对象
<br><br>[ES5引入方式]：<br/>
Zondy.Geometry.MultiPoint() <br/>
[ES6引入方式]：<br/>
import { MultiPoint } from "@mapgis/webclient-common" <br/>
<br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="MultiPolygon.html">MultiPolygon</a><span style="display: none;"><p>多区几何
<br><br>[ES5引入方式]：<br/>
Zondy.Geometry.MultiPolygon() <br/>
[ES6引入方式]：<br/>
import { MultiPolygon } from "@mapgis/webclient-common" <br/>
<br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Point.html">Point</a><span style="display: none;"><p>点几何对象
<br><br>[ES5引入方式]：<br/>
Zondy.Geometry.Point() <br/>
[ES6引入方式]：<br/>
import { Point } from "@mapgis/webclient-common" <br/>
<br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Polygon.html">Polygon</a><span style="display: none;"><p>区几何，由多个环(ring)构成的几何对象，仅支持带洞区和非带洞区，不支持带岛区，即三个圈重叠<br/>
多边形的第一个环(ring)即外圈，从第二个环开始为内圈，内圈可以重合、相交、自相交，但是不能超过外圈
<br><br>[ES5引入方式]：<br/>
Zondy.Geometry.Polygon() <br/>
[ES6引入方式]：<br/>
import { Polygon } from "@mapgis/webclient-common" <br/>
<br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SpatialReference.html">SpatialReference</a><span style="display: none;"><p>空间参考系
<br><br>[ES5引入方式]：<br/>
Zondy.SpatialReference() <br/>
[ES6引入方式]：<br/>
import { SpatialReference } from "@mapgis/webclient-common" <br/>
<br/></p></span></li></ul><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">undefined</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="DrawControl.html">DrawControl</a><span style="display: none;"><p>绘制工具</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="PrintControl.html">PrintControl</a><span style="display: none;"><p>打印工具</p></span></li></ul><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">基础对象模块</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Evented.html">Evented</a><span style="display: none;"><p>事件基类,所有可接收或者发送的对象继承于此</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="UpdateContent.html">UpdateContent</a><span style="display: none;"><p>更新内容对象</p></span></li></ul><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">要素模块</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Feature.html">Feature</a><span style="display: none;"><p>要素对象，示例如下：<a id='add-Feature'>[初始化要素对象]</a>
<br><br>[ES5引入方式]：<br/>
Zondy.Feature() <br/>
[ES6引入方式]：<br/>
import { Feature } from "@mapgis/webclient-common" <br/>
<br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="FeatureSet.html">FeatureSet</a><span style="display: none;"><p>要素集合类，示例如下：<a id='add-FeatureSet'>[初始化要素集合对象]</a>
<br><br>[ES5引入方式]：<br/>
Zondy.FeatureSet() <br/>
[ES6引入方式]：<br/>
import { FeatureSet } from "@mapgis/webclient-common" <br/>
<br/></p></span></li></ul><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">符号模块</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="FillSymbol.html">FillSymbol</a><span style="display: none;"><p>填充符号基类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="LineSymbol.html">LineSymbol</a><span style="display: none;"><p>线符号基类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="LineSymbolMarker.html">LineSymbolMarker</a><span style="display: none;"><p>标记符号</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="MapGISTextSymbol.html">MapGISTextSymbol</a><span style="display: none;"><p>文本符号，支持点几何对象，参考示例：<a href='#new-MapGISTextSymbol'>[创建文本样式]</a>
<br><br>[ES5引入方式]：<br/>
Zondy.Symbol.MapGISTextSymbol() <br/>
[ES6引入方式]：<br/>
import { MapGISTextSymbol } from "@mapgis/webclient-common" <br/>
<br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="MarkerSymbol.html">MarkerSymbol</a><span style="display: none;"><p>Marker符号基类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="PictureFillSymbol.html">PictureFillSymbol</a><span style="display: none;"><p>简单标记符号</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="PictureMarkerSymbol.html">PictureMarkerSymbol</a><span style="display: none;"><p>图片Marker符号，支持点几何对象，参考示例：<a href='#new-PictureMarkerSymbol'>[图片Marker样式]</a>
<br><br>[ES5引入方式]：<br/>
Zondy.Symbol.PictureMarkerSymbol() <br/>
[ES6引入方式]：<br/>
import { PictureMarkerSymbol } from "@mapgis/webclient-common" <br/>
<br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SimpleFillSymbol.html">SimpleFillSymbol</a><span style="display: none;"><p>简单填充符号，参考示例：<a href='#new-SimpleFillSymbol'>[填充符号样式]</a>
<br><br>[ES5引入方式]：<br/>
Zondy.Symbol.SimpleFillSymbol() <br/>
[ES6引入方式]：<br/>
import { SimpleFillSymbol } from "@mapgis/webclient-common" <br/>
<br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SimpleLineSymbol.html">SimpleLineSymbol</a><span style="display: none;"><p>简单线符号，支持线几何对象，参考示例：<a href='#new-SimpleLineSymbol'>[线符号样式]</a>
<br><br>[ES5引入方式]：<br/>
Zondy.Symbol.SimpleLineSymbol() <br/>
[ES6引入方式]：<br/>
import { SimpleLineSymbol } from "@mapgis/webclient-common" <br/>
<br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SimpleMarkerSymbol.html">SimpleMarkerSymbol</a><span style="display: none;"><p>简单Marker符号，支持点几何对象，参考示例：<a href='#new-SimpleMarkerSymbol'>[简单Marker样式]</a>
<br><br>[ES5引入方式]：<br/>
Zondy.Symbol.SimpleMarkerSymbol() <br/>
[ES6引入方式]：<br/>
import { SimpleMarkerSymbol } from "@mapgis/webclient-common" <br/>
<br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Symbol.html">Symbol</a><span style="display: none;"><p>符号基类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Symbol3DLayer.html">Symbol3DLayer</a><span style="display: none;"><p>三维符号图层</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="TextSymbol.html">TextSymbol</a><span style="display: none;"><p>文本符号，支持点几何对象，参考示例：<a href='#new-TextSymbol'>[创建文本样式]</a>
<br><br>[ES5引入方式]：<br/>
Zondy.Symbol.TextSymbol() <br/>
[ES6引入方式]：<br/>
import { TextSymbol } from "@mapgis/webclient-common" <br/>
<br/></p></span></li></ul><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">地图模块</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Map.html">Map</a><span style="display: none;"><p>图层管理容器，和地图引擎无关，通过此对象而不是地图引擎来对图层进行管理
<br>[ES5引入方式]：<br/>
Zondy.Map() <br/>
[ES6引入方式]：<br/>
import { Map } from "@mapgis/webclient-common" <br/></p></span></li></ul><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">undefined</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Popup.html">Popup</a><span style="display: none;"><p>二维场景信息弹窗(leaflet引擎)
参考示例：
<a href='#MapView'>[初始化二维场景视图]</a>
<br>[ES5引入方式]：<br/>
Zondy.MapView() <br/>
[ES6引入方式]：<br/>
import { MapView } from '@mapgis/webclient-leaflet-plugin' <br/></p></span></li></ul><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">草图编辑模块</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SketchBaseDrawTool.html">SketchBaseDrawTool</a><span style="display: none;"><p>草图基础绘图工具类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SketchEditor.html">SketchEditor</a><span style="display: none;">undefined</span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SketchEditor2D.html">SketchEditor2D</a><span style="display: none;"><p>二维场景草图编辑类<br/>
<br>[ES5引入方式]：<br/>
const { SketchEditor2D } = Zondy <br/>
[ES6引入方式]：<br/>
import { SketchEditor2D } from "@mapgis/webclient-leaflet-plugin" <br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SketchEditorNew.html">SketchEditorNew</a><span style="display: none;"><p>草图编辑基类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SketchPointDrawTool.html">SketchPointDrawTool</a><span style="display: none;"><p>点绘图工具类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SketchPolygonDrawTool.html">SketchPolygonDrawTool</a><span style="display: none;"><p>面绘图工具类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SketchPolylineDrawTool.html">SketchPolylineDrawTool</a><span style="display: none;"><p>面绘图工具类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SketchStage.html">SketchStage</a><span style="display: none;"><p>草图图形集合</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SketchStyle.html">SketchStyle</a><span style="display: none;"><p>草图样式管理类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="VideoSketchEditor.html">VideoSketchEditor</a><span style="display: none;">undefined</span></li></ul></div>
</nav>
</div>
<div class="core" id="main-content-wrapper">
<div class="content">
<header id="page-title" class="page-title">
<span class="page-title-main">类名</span>
<span class="page-title-sub">SketchEditor2D</span>
</header>
<section>
<article>
<div class="container-overview">
<div class='vertical-section'>
<div class="members">
<div class="member">
<h4 class="name" id="SketchEditor2D">
<a class="href-link" href="#SketchEditor2D">#</a>
<span class="code-name" style="font-size:30px">
new SketchEditor2D<span class="signature">(options)</span>
</span>
</h4>
<div class="description">
<p>二维场景草图编辑类<br/>
<br>[ES5引入方式]：<br/>
const { SketchEditor2D } = Zondy <br/>
[ES6引入方式]：<br/>
import { SketchEditor2D } from "@mapgis/webclient-leaflet-plugin" <br/></p>
</div>
<h4>参数:</h4>
<div class="table-container">
<table class="params table">
<thead>
<tr>
<th>名称</th>
<th>类型</th>
<th class="last">描述</th>
</tr>
</thead>
<tbody>
<tr class="deep-level-0">
<td class="name"><code>options</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="description last"><p>构造参数</p></td>
</tr>
<tr class="deep-level-1">
<td class="name"><code>mapView</code></td>
<td class="type">
<span class="param-type"><a href="MapView.html">MapView</a></span>
</td>
<td class="description last"><p>地图视图对象</p></td>
</tr>
<tr class="deep-level-1">
<td class="name"><code>layer</code></td>
<td class="type">
<span class="param-type"><a href="GraphicsLayer.html">GraphicsLayer</a></span>
</td>
<td class="description last"><p>草图图层管对象</p></td>
</tr>
<tr class="deep-level-1">
<td class="name"><code>sketchStyle</code></td>
<td class="type">
<span class="param-type"><a href="SketchStyle.html">SketchStyle</a></span>
</td>
<td class="description last"><p>草图符号</p></td>
</tr>
<tr class="deep-level-1">
<td class="name"><code>snappingOption</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="description last"><p>草图捕获配置项</p></td>
</tr>
</tbody>
</table>
</div>
<dl class="details">
<p class="tag-source">
<a href="leaflet_sketchEditor_SketchEditor2D.js.html" class="button">查看源代码</a>
<span>
<a href="leaflet_sketchEditor_SketchEditor2D.js.html">leaflet/sketchEditor/SketchEditor2D.js</a>, <a href="leaflet_sketchEditor_SketchEditor2D.js.html#line10">line 10</a>
</span>
</p>
</dl>
<div class="method-parameter columns">
<div class="column is-2"><label>绑定事件:</label></div>
<div class="column is-10">
<ul>
<li><a href="SketchEditorNew.html#event:%25E8%258D%2589%25E5%259B%25BE%25E7%25BB%2598%25E5%2588%25B6%25E5%25AE%258C%25E6%2588%2590%25E4%25BA%258B%25E4%25BB%25B6">SketchEditorNew#event:草图绘制完成事件</a></li>
<li><a href="SketchEditorNew.html#event:%25E8%258D%2589%25E5%259B%25BE%25E8%25A2%25AB%25E9%2580%2589%25E4%25B8%25AD%25E4%25BA%258B%25E4%25BB%25B6">SketchEditorNew#event:草图被选中事件</a></li>
</ul>
</div>
</div>
<p class="summary"><h5>支持如下方法：</h5>
<a href='#start'>[1、开始绘制草图]</a><br/>
<a href='#stop'>[2、停止绘制]</a><br/>
<a href='#remove'>[3、移除当前草图]</a><br/>
<a href='#addVertex'>[4、向草线或面草图中插入新的顶点]</a><br/>
<a href='#updateVertex'>[5、更新草图图形的某个顶点]</a><br/>
<a href='#removeVertex'>[6、移除草图图形的某个顶点]</a><br/>
<a href='#getSketchDataType'>[7、获取草图图形类型]</a><br/>
<a href='#setSketchStyle'>[8、设置草图样式]</a><br/>
<a href='#getSketchStyle'>[9、获取草图样式]</a><br/>
<a href='#getGeometry'>[10、获取草图几何对象]</a><br/>
<a href='#union'>[11、合并多个区几何]</a><br/>
<a href='#split'>[12、分割草图对象或区几何对象]</a><br/>
<a href='#undo'>[13、撤销当前编辑操作]</a><br/>
<a href='#redo'>[14、恢复被撤销的草图]</a><br/></p>
<h5>示例</h5>
<p class="code-caption"><h7 id='MapView'>初始化一个二维场景草图编辑类</h7></p>
<pre class="prettyprint"><code>// [ES5引入方式]：
const { SketchEditor2D } = Zondy
[ES6引入方式]：
import { MapView, SketchEditor2D } from "@mapgis/webclient-leaflet-plugin" <br/>
import { SketchStyle, SimpleMarkerSymbol, Color, SketchDataType} from "@mapgis/webclient-common" <br/>
var map = new Map()
var mapView = new MapView({
viewId: "mapgis-2d-viewer",
map: this.map,
})
var simpleMarkerSymbol = new SimpleMarkerSymbol({
color: new Color(24, 144, 255, 1),
size: 10,
});
var sketchStyle = new SketchStyle({
vertexStyle: simpleMarkerSymbol,
lineStyle: undefined,
fillStyle: undefined
})
var sketchEditor2D = new SketchEditor2D({
mapView: this.mapView,
layer: new GraphicsLayer(),
vertexStyle: vertexStyle
})
SketchEditor2D.start(SketchDataType.POINT) // 绘制点
SketchEditor2D.start(SketchDataType.POLYLINE) // 绘制线
SketchEditor2D.start(SketchDataType.POLYGON) // 绘制区
*</code></pre>
</div>
</div>
</div>
</div>
<h3 class="subsection-title">继承关系</h3>
<ul>
<li><a href="SketchEditorNew.html">SketchEditorNew</a></li>
</ul>
<div class='vertical-section'>
<h3 id='function'>方法</h3>
<div class="members">
<div class="member">
<h4 class="name" id="addVertex">
<a class="href-link" href="#addVertex">#</a>
<span class="code-name" style="font-size:30px">
addVertex<span class="signature">(point, index)</span>
</span>
</h4>
<div class="description">
<p>向当前线或区草图中插入新的顶点<a id='addVertex'></a></p>
</div>
<h4>参数:</h4>
<div class="table-container">
<table class="params table">
<thead>
<tr>
<th>名称</th>
<th>类型</th>
<th class="last">描述</th>
</tr>
</thead>
<tbody>
<tr class="deep-level-0">
<td class="name"><code>point</code></td>
<td class="type">
<span class="param-type"><a href="Point.html">Point</a></span>
</td>
<td class="description last"><p>新增/插入顶点</p></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code>index</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="description last"><p>新增/新增点的序号</p></td>
</tr>
</tbody>
</table>
</div>
<dl class="details">
<dt class="tag-overrides">Overrides:</dt>
<dd class="tag-overrides"><ul class="dummy"><li>
<a href="SketchEditorNew.html#addVertex">SketchEditorNew#addVertex</a>
</li></ul></dd>
<p class="tag-source">
<a href="leaflet_sketchEditor_SketchEditor2D.js.html" class="button">查看源代码</a>
<span>
<a href="leaflet_sketchEditor_SketchEditor2D.js.html">leaflet/sketchEditor/SketchEditor2D.js</a>, <a href="leaflet_sketchEditor_SketchEditor2D.js.html#line188">line 188</a>
</span>
</p>
</dl>
</div>
<div class="member">
<h4 class="name" id="canRedo">
<a class="href-link" href="#canRedo">#</a>
<span class="code-name" style="font-size:30px">
canRedo<span class="signature">()</span>
</span>
</h4>
<div class="description">
<p>草图是否可执行恢复操作<a id='canRedo'></a></p>
</div>
<dl class="details">
<dt class="tag-overrides">Overrides:</dt>
<dd class="tag-overrides"><ul class="dummy"><li>
<a href="SketchEditorNew.html#canRedo">SketchEditorNew#canRedo</a>
</li></ul></dd>
<p class="tag-source">
<a href="leaflet_sketchEditor_SketchEditor2D.js.html" class="button">查看源代码</a>
<span>
<a href="leaflet_sketchEditor_SketchEditor2D.js.html">leaflet/sketchEditor/SketchEditor2D.js</a>, <a href="leaflet_sketchEditor_SketchEditor2D.js.html#line454">line 454</a>
</span>
</p>
</dl>
<div class='columns method-parameter'>
<div class="column is-2"><label>返回值:</label></div>
<div class="column is-10">
<div class="columns">
<div class='column is-5 has-text-left'>
<label>类型: </label>
<span class="param-type">Boolean</span>
</div>
</div>
</div>
</div>
</div>
<div class="member">
<h4 class="name" id="canUndo">
<a class="href-link" href="#canUndo">#</a>
<span class="code-name" style="font-size:30px">
canUndo<span class="signature">()</span>
</span>
</h4>
<div class="description">
<p>草图是否可执行撤销操作<a id='canUndo'></a></p>
</div>
<dl class="details">
<dt class="tag-overrides">Overrides:</dt>
<dd class="tag-overrides"><ul class="dummy"><li>
<a href="SketchEditorNew.html#canUndo">SketchEditorNew#canUndo</a>
</li></ul></dd>
<p class="tag-source">
<a href="leaflet_sketchEditor_SketchEditor2D.js.html" class="button">查看源代码</a>
<span>
<a href="leaflet_sketchEditor_SketchEditor2D.js.html">leaflet/sketchEditor/SketchEditor2D.js</a>, <a href="leaflet_sketchEditor_SketchEditor2D.js.html#line446">line 446</a>
</span>
</p>
</dl>
<div class='columns method-parameter'>
<div class="column is-2"><label>返回值:</label></div>
<div class="column is-10">
<div class="columns">
<div class='column is-5 has-text-left'>
<label>类型: </label>
<span class="param-type">Boolean</span>
</div>
</div>
</div>
</div>
</div>
<div class="member">
<h4 class="name" id="getGeometry">
<a class="href-link" href="#getGeometry">#</a>
<span class="code-name" style="font-size:30px">
getGeometry<span class="signature">()</span>
</span>
</h4>
<div class="description">
<p>获取草图几何对象<a id='getGeometry'></a></p>
</div>
<dl class="details">
<dt class="tag-overrides">Overrides:</dt>
<dd class="tag-overrides"><ul class="dummy"><li>
<a href="SketchEditorNew.html#getGeometry">SketchEditorNew#getGeometry</a>
</li></ul></dd>
<p class="tag-source">
<a href="leaflet_sketchEditor_SketchEditor2D.js.html" class="button">查看源代码</a>
<span>
<a href="leaflet_sketchEditor_SketchEditor2D.js.html">leaflet/sketchEditor/SketchEditor2D.js</a>, <a href="leaflet_sketchEditor_SketchEditor2D.js.html#line261">line 261</a>
</span>
</p>
</dl>
<div class='columns method-parameter'>
<div class="column is-2"><label>返回值:</label></div>
<div class="column is-10">
<div class="columns">
<div class='column is-5 has-text-left'>
<label>类型: </label>
<span class="param-type"><a href="Geometry.html">Geometry</a></span>
</div>
</div>
</div>
</div>
</div>
<div class="member">
<h4 class="name" id="getSketchStyle">
<a class="href-link" href="#getSketchStyle">#</a>
<span class="code-name" style="font-size:30px">
getSketchStyle<span class="signature">()</span>
</span>
</h4>
<div class="description">
<p>获取草图样式<a id='getSketchStyle'></a></p>
</div>
<dl class="details">
<dt class="tag-overrides">Overrides:</dt>
<dd class="tag-overrides"><ul class="dummy"><li>
<a href="SketchEditorNew.html#getSketchStyle">SketchEditorNew#getSketchStyle</a>
</li></ul></dd>
<p class="tag-source">
<a href="leaflet_sketchEditor_SketchEditor2D.js.html" class="button">查看源代码</a>
<span>
<a href="leaflet_sketchEditor_SketchEditor2D.js.html">leaflet/sketchEditor/SketchEditor2D.js</a>, <a href="leaflet_sketchEditor_SketchEditor2D.js.html#line253">line 253</a>
</span>
</p>
</dl>
<div class='columns method-parameter'>
<div class="column is-2"><label>返回值:</label></div>
<div class="column is-10">
<div class="columns">
<div class='column is-5 has-text-left'>
<label>类型: </label>
<span class="param-type"><a href="SketchStyle.html">SketchStyle</a></span>
</div>
</div>
</div>
</div>
</div>
<div class="member">
<h4 class="name" id="redo">
<a class="href-link" href="#redo">#</a>
<span class="code-name" style="font-size:30px">
redo<span class="signature">()</span>
</span>
</h4>
<div class="description">
<p>恢复被撤销的草图<a id='redo'></a></p>
</div>
<dl class="details">
<dt class="tag-overrides">Overrides:</dt>
<dd class="tag-overrides"><ul class="dummy"><li>
<a href="SketchEditorNew.html#redo">SketchEditorNew#redo</a>
</li></ul></dd>
<p class="tag-source">
<a href="leaflet_sketchEditor_SketchEditor2D.js.html" class="button">查看源代码</a>
<span>
<a href="leaflet_sketchEditor_SketchEditor2D.js.html">leaflet/sketchEditor/SketchEditor2D.js</a>, <a href="leaflet_sketchEditor_SketchEditor2D.js.html#line438">line 438</a>
</span>
</p>
</dl>
<div class='columns method-parameter'>
<div class="column is-2"><label>返回值:</label></div>
<div class="column is-10">
<div class="columns">
<div class='column is-5 has-text-left'>
<label>类型: </label>
<span class="param-type"><a href="Geometry.html">Geometry</a></span>
</div>
</div>
</div>
</div>
<h5>示例</h5>
<p class="code-caption"><h7 id='MapView'>二维草图几何分割</h7></p>
<pre class="prettyprint"><code>// [ES5引入方式]：
const { SketchEditor2D } = Zondy
[ES6引入方式]：
import { MapView, SketchEditor2D } from "@mapgis/webclient-leaflet-plugin" <br/>
import { Polygon, LineString } from "@mapgis/webclient-common" <br/>
var map = new Map()
var mapView = new MapView({
viewId: "mapgis-2d-viewer",
map: this.map,
})
var sketchEditor2D = new SketchEditor2D({
mapView: this.mapView,
layer: new GraphicsLayer()
})
sketchEditor2D.start(SketchDataType.POLYGON)
console.log("是否可以进行恢复操作：" + this.sketchEditor2D.canRedo())
const geometry = this.sketchEditor2D.redo()
console.log("恢复后的几何对象" + geometry)</code></pre>
</div>
<div class="member">
<h4 class="name" id="remove">
<a class="href-link" href="#remove">#</a>
<span class="code-name" style="font-size:30px">
remove<span class="signature">()</span>
</span>
</h4>
<div class="description">
<p>移除当前草图<a id='remove'></a></p>
</div>
<dl class="details">
<dt class="tag-overrides">Overrides:</dt>
<dd class="tag-overrides"><ul class="dummy"><li>
<a href="SketchEditorNew.html#remove">SketchEditorNew#remove</a>
</li></ul></dd>
<p class="tag-source">
<a href="leaflet_sketchEditor_SketchEditor2D.js.html" class="button">查看源代码</a>
<span>
<a href="leaflet_sketchEditor_SketchEditor2D.js.html">leaflet/sketchEditor/SketchEditor2D.js</a>, <a href="leaflet_sketchEditor_SketchEditor2D.js.html#line171">line 171</a>
</span>
</p>
</dl>
</div>
<div class="member">
<h4 class="name" id="removeVertex">
<a class="href-link" href="#removeVertex">#</a>
<span class="code-name" style="font-size:30px">
removeVertex<span class="signature">(index)</span>
</span>
</h4>
<div class="description">
<p>移除草图图形的某个顶点<a id='removeVertex'></a></p>
</div>
<h4>参数:</h4>
<div class="table-container">
<table class="params table">
<thead>
<tr>
<th>名称</th>
<th>类型</th>
<th class="last">描述</th>
</tr>
</thead>
<tbody>
<tr class="deep-level-0">
<td class="name"><code>index</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="description last"><p>需更新的顶点的序号</p></td>
</tr>
</tbody>
</table>
</div>
<dl class="details">
<dt class="tag-overrides">Overrides:</dt>
<dd class="tag-overrides"><ul class="dummy"><li>
<a href="SketchEditorNew.html#removeVertex">SketchEditorNew#removeVertex</a>
</li></ul></dd>
<p class="tag-source">
<a href="leaflet_sketchEditor_SketchEditor2D.js.html" class="button">查看源代码</a>
<span>
<a href="leaflet_sketchEditor_SketchEditor2D.js.html">leaflet/sketchEditor/SketchEditor2D.js</a>, <a href="leaflet_sketchEditor_SketchEditor2D.js.html#line205">line 205</a>
</span>
</p>
</dl>
</div>
<div class="member">
<h4 class="name" id="setSketchStyle">
<a class="href-link" href="#setSketchStyle">#</a>
<span class="code-name" style="font-size:30px">
setSketchStyle<span class="signature">(sketchStyle)</span>
</span>
</h4>
<div class="description">
<p>设置草图样式<a id='setSketchStyle'></a></p>
</div>
<h4>参数:</h4>
<div class="table-container">
<table class="params table">
<thead>
<tr>
<th>名称</th>
<th>类型</th>
<th class="last">描述</th>
</tr>
</thead>
<tbody>
<tr class="deep-level-0">
<td class="name"><code>sketchStyle</code></td>
<td class="type">
<span class="param-type"><a href="SketchStyle.html">SketchStyle</a></span>
</td>
<td class="description last"></td>
</tr>
</tbody>
</table>
</div>
<dl class="details">
<dt class="tag-overrides">Overrides:</dt>
<dd class="tag-overrides"><ul class="dummy"><li>
<a href="SketchEditorNew.html#setSketchStyle">SketchEditorNew#setSketchStyle</a>
</li></ul></dd>
<p class="tag-source">
<a href="leaflet_sketchEditor_SketchEditor2D.js.html" class="button">查看源代码</a>
<span>
<a href="leaflet_sketchEditor_SketchEditor2D.js.html">leaflet/sketchEditor/SketchEditor2D.js</a>, <a href="leaflet_sketchEditor_SketchEditor2D.js.html#line245">line 245</a>
</span>
</p>
</dl>
<h5>示例</h5>
<pre class="prettyprint"><code>// ES5引入方式
const { SimpleFillSymbol, SimpleLineSymbol } = Zondy.Symbol
const { Color, SketchStyle } = Zondy
// ES6引入方式
import { SimpleFillSymbol, SimpleLineSymbol, Color, SketchStyle } from "@mapgis/webclient-common"
// 新建一个填充样式
const fillStyle = new SimpleFillSymbol({
color: new Color(0, 255, 255, 1),
outline: new SimpleLineSymbol({
color: new Color(255, 0, 0, 1),
width: 2
})
})
// 新建一个草图样式
const sketchStyle = new SketchStyle({
// 传入填充样式给区注记使用
fillStyle: fillStyle,
// 绘制线注记时显示分段长度
isShowSegmentLength: true,
// 绘制区注记时显示面积
isShowArea: true
})
sketchEditor2D.setSketchStyle(sketchStyle)</code></pre>
</div>
<div class="member">
<h4 class="name" id="split">
<a class="href-link" href="#split">#</a>
<span class="code-name" style="font-size:30px">
split<span class="signature">(target, splitPolyline)</span>
</span>
</h4>
<div class="description">
<p>分割草图对象或区几何对象<a id='split'></a></p>
</div>
<h4>参数:</h4>
<div class="table-container">
<table class="params table">
<thead>
<tr>
<th>名称</th>
<th>类型</th>
<th class="last">描述</th>
</tr>
</thead>
<tbody>
<tr class="deep-level-0">
<td class="name"><code>target</code></td>
<td class="type">
<span class="param-type"><a href="Polygon.html">Polygon</a></span>
|
<span class="param-type"><a href="SketchEditorNew.html">SketchEditorNew</a></span>
</td>
<td class="description last"><p>被分割的几何/草图对象</p></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code>splitPolyline</code></td>
<td class="type">
<span class="param-type">Polyline</span>
</td>
<td class="description last"><p>线几何对象</p></td>
</tr>
</tbody>
</table>
</div>
<dl class="details">
<dt class="tag-overrides">Overrides:</dt>
<dd class="tag-overrides"><ul class="dummy"><li>
<a href="SketchEditorNew.html#split">SketchEditorNew#split</a>
</li></ul></dd>
<p class="tag-source">
<a href="leaflet_sketchEditor_SketchEditor2D.js.html" class="button">查看源代码</a>
<span>
<a href="leaflet_sketchEditor_SketchEditor2D.js.html">leaflet/sketchEditor/SketchEditor2D.js</a>, <a href="leaflet_sketchEditor_SketchEditor2D.js.html#line352">line 352</a>
</span>
</p>
</dl>
<div class='columns method-parameter'>
<div class="column is-2"><label>返回值:</label></div>
<div class="column is-10">
<div class="columns">
<div class='param-desc column is-7'><p>合并后的几何对象</p></div>
<div class='column is-5 has-text-left'>
<label>类型: </label>
<span class="param-type">Array.<<a href="SketchEditorNew.html">SketchEditorNew</a>></span>
</div>
</div>
</div>
</div>
<h5>示例</h5>
<p class="code-caption"><h7 id='MapView'>二维草图几何分割</h7></p>
<pre class="prettyprint"><code>// [ES5引入方式]：
const { MapView, SketchEditor2D, Polygon, LineString } = Zondy
[ES6引入方式]：
import { MapView, SketchEditor2D } from "@mapgis/webclient-leaflet-plugin" <br/>
import { Polygon, LineString } from "@mapgis/webclient-common" <br/>
var map = new Map()
var mapView = new MapView({
viewId: "mapgis-2d-viewer",
map: this.map,
})
var sketchEditor2D = new SketchEditor2D({
mapView: this.mapView,
layer: new GraphicsLayer()
})
const polygon = new Polygon({
coordinates: [
[
[108, 29],
[116, 29],
[116, 33],
[108, 33],
[108, 29]
]
]
})
const polyline = new LineString({
coordinates: [
[100, 30],
[120, 30]
]
})
const newSketchEditors = sketchEditor2D.split(polygon,polyline)</code></pre>
</div>
<div class="member">
<h4 class="name" id="start">
<a class="href-link" href="#start">#</a>
<span class="code-name" style="font-size:30px">
start<span class="signature">(dataType)</span>
</span>
</h4>
<div class="description">
<p>开始绘制草图<a id='start'></a></p>
</div>
<h4>参数:</h4>
<div class="table-container">
<table class="params table">
<thead>
<tr>
<th>名称</th>
<th>类型</th>
<th class="last">描述</th>
</tr>
</thead>
<tbody>
<tr class="deep-level-0">
<td class="name"><code>dataType</code></td>
<td class="type">
<span class="param-type"><a href="global.html#SketchDataType">SketchDataType</a></span>
</td>
<td class="description last"><p>草图编辑类型</p></td>
</tr>
</tbody>
</table>
</div>
<dl class="details">
<dt class="tag-overrides">Overrides:</dt>
<dd class="tag-overrides"><ul class="dummy"><li>
<a href="SketchEditorNew.html#start">SketchEditorNew#start</a>
</li></ul></dd>
<p class="tag-source">
<a href="leaflet_sketchEditor_SketchEditor2D.js.html" class="button">查看源代码</a>
<span>
<a href="leaflet_sketchEditor_SketchEditor2D.js.html">leaflet/sketchEditor/SketchEditor2D.js</a>, <a href="leaflet_sketchEditor_SketchEditor2D.js.html#line157">line 157</a>
</span>
</p>
</dl>
<h5>示例</h5>
<p class="code-caption"><h7 id='MapView'>初始化一个二维场景草图编辑类</h7></p>
<pre class="prettyprint"><code>// [ES5引入方式]：
const { SketchEditor2D } = Zondy
[ES6引入方式]：
import { MapView, SketchEditor2D } from "@mapgis/webclient-leaflet-plugin" <br/>
import { SketchStyle, SimpleMarkerSymbol, Color, SketchDataType} from "@mapgis/webclient-common" <br/>
var map = new Map()
var mapView = new MapView({
viewId: "mapgis-2d-viewer",
map: this.map,
})
var simpleMarkerSymbol = new SimpleMarkerSymbol({
color: new Color(24, 144, 255, 1),
size: 10,
});
var sketchStyle = new SketchStyle({
vertexStyle: simpleMarkerSymbol,
lineStyle: undefined,
fillStyle: undefined
})
var sketchEditor2D = new SketchEditor2D({
mapView: this.mapView,
layer: new GraphicsLayer(),
vertexStyle: vertexStyle
})
SketchEditor2D.start(SketchDataType.POINT) // 绘制点
SketchEditor2D.start(SketchDataType.POLYLINE) // 绘制线
SketchEditor2D.start(SketchDataType.POLYGON) // 绘制区</code></pre>
</div>
<div class="member">
<h4 class="name" id="stop">
<a class="href-link" href="#stop">#</a>
<span class="code-name" style="font-size:30px">
stop<span class="signature">()</span>
</span>
</h4>
<div class="description">
<p>停止绘制<a id='stop'></a></p>
</div>
<dl class="details">
<dt class="tag-overrides">Overrides:</dt>
<dd class="tag-overrides"><ul class="dummy"><li>
<a href="SketchEditorNew.html#stop">SketchEditorNew#stop</a>
</li></ul></dd>
<p class="tag-source">
<a href="leaflet_sketchEditor_SketchEditor2D.js.html" class="button">查看源代码</a>
<span>
<a href="leaflet_sketchEditor_SketchEditor2D.js.html">leaflet/sketchEditor/SketchEditor2D.js</a>, <a href="leaflet_sketchEditor_SketchEditor2D.js.html#line164">line 164</a>
</span>
</p>
</dl>
</div>
<div class="member">
<h4 class="name" id="undo">
<a class="href-link" href="#undo">#</a>
<span class="code-name" style="font-size:30px">
undo<span class="signature">()</span>
</span>
</h4>
<div class="description">
<p>撤销当前编辑操作<a id='undo'></a></p>
</div>
<dl class="details">
<dt class="tag-overrides">Overrides:</dt>
<dd class="tag-overrides"><ul class="dummy"><li>
<a href="SketchEditorNew.html#undo">SketchEditorNew#undo</a>
</li></ul></dd>
<p class="tag-source">
<a href="leaflet_sketchEditor_SketchEditor2D.js.html" class="button">查看源代码</a>
<span>
<a href="leaflet_sketchEditor_SketchEditor2D.js.html">leaflet/sketchEditor/SketchEditor2D.js</a>, <a href="leaflet_sketchEditor_SketchEditor2D.js.html#line411">line 411</a>
</span>
</p>
</dl>
<div class='columns method-parameter'>
<div class="column is-2"><label>返回值:</label></div>
<div class="column is-10">
<div class="columns">
<div class='column is-5 has-text-left'>
<label>类型: </label>
<span class="param-type"><a href="Geometry.html">Geometry</a></span>
</div>
</div>
</div>
</div>
<h5>示例</h5>
<p class="code-caption"><h7 id='MapView'>二维草图几何分割</h7></p>
<pre class="prettyprint"><code>// [ES5引入方式]：
const { MapView, SketchEditor2D, Polygon, LineString, SketchDataType } = Zondy
[ES6引入方式]：
import { MapView, SketchEditor2D } from "@mapgis/webclient-leaflet-plugin" <br/>
import { Polygon, LineString, SketchDataType } from "@mapgis/webclient-common" <br/>
var map = new Map()
var mapView = new MapView({
viewId: "mapgis-2d-viewer",
map: this.map,
})
var sketchEditor2D = new SketchEditor2D({
mapView: this.mapView,
layer: new GraphicsLayer()
})
sketchEditor2D.start(SketchDataType.POLYGON)
console.log("是否可以进行撤销操作：" + this.sketchEditor2D.canUndo())
const geometry = this.sketchEditor2D.undo()
console.log("恢复后的几何对象" + geometry)</code></pre>
</div>
<div class="member">
<h4 class="name" id="union">
<a class="href-link" href="#union">#</a>
<span class="code-name" style="font-size:30px">
union<span class="signature">(polygons)</span>
</span>
</h4>
<div class="description">
<p>合并多个区几何<a id='union'></a></p>
</div>
<h4>参数:</h4>
<div class="table-container">
<table class="params table">
<thead>
<tr>
<th>名称</th>
<th>类型</th>
<th class="last">描述</th>
</tr>
</thead>
<tbody>
<tr class="deep-level-0">
<td class="name"><code>polygons</code></td>
<td class="type">
<span class="param-type"><a href="Polygon.html">Polygon</a></span>
</td>
<td class="description last"><p>被合并的区几何对象</p></td>
</tr>
</tbody>
</table>
</div>
<dl class="details">
<dt class="tag-overrides">Overrides:</dt>
<dd class="tag-overrides"><ul class="dummy"><li>
<a href="SketchEditorNew.html#union">SketchEditorNew#union</a>
</li></ul></dd>
<p class="tag-source">
<a href="leaflet_sketchEditor_SketchEditor2D.js.html" class="button">查看源代码</a>
<span>
<a href="leaflet_sketchEditor_SketchEditor2D.js.html">leaflet/sketchEditor/SketchEditor2D.js</a>, <a href="leaflet_sketchEditor_SketchEditor2D.js.html#line309">line 309</a>
</span>
</p>
</dl>
<div class='columns method-parameter'>
<div class="column is-2"><label>返回值:</label></div>
<div class="column is-10">
<div class="columns">
<div class='param-desc column is-7'><p>合并后的几何对象</p></div>
<div class='column is-5 has-text-left'>
<label>类型: </label>
<span class="param-type"><a href="Polygon.html">Polygon</a></span>
</div>
</div>
</div>
</div>
<h5>示例</h5>
<p class="code-caption"><h7 id='MapView'>二维草图几何合并</h7></p>
<pre class="prettyprint"><code>// [ES5引入方式]：
const { MapView, SketchEditor2D, polygon } = Zondy
[ES6引入方式]：
import { MapView, SketchEditor2D } from "@mapgis/webclient-leaflet-plugin" <br/>
import { polygon } from "@mapgis/webclient-common" <br/>
var map = new Map()
var mapView = new MapView({
viewId: "mapgis-2d-viewer",
map: this.map,
})
var sketchEditor2D = new SketchEditor2D({
mapView: this.mapView,
layer: new GraphicsLayer()
})
const polygon = new Polygon({
coordinates: [
[
[0, -60],
[0, 60],
[160, 60],
[160, -60],
[0, -60]
]
]
})
const polygon1 = new Polygon({
coordinates: [
[
[10, -60],
[10, 60],
[170, 60],
[170, -60],
[10, -60]
]
]
})
const polygons = [polygon,polygon1]
sketchEditor2D.union(polygons)</code></pre>
</div>
<div class="member">
<h4 class="name" id="updateVertex">
<a class="href-link" href="#updateVertex">#</a>
<span class="code-name" style="font-size:30px">
updateVertex<span class="signature">(point, index)</span>
</span>
</h4>
<div class="description">
<p>更新当前草图图形的某个顶点<a id='updateVertex'></a></p>
</div>
<h4>参数:</h4>
<div class="table-container">
<table class="params table">
<thead>
<tr>
<th>名称</th>
<th>类型</th>
<th class="last">描述</th>
</tr>
</thead>
<tbody>
<tr class="deep-level-0">
<td class="name"><code>point</code></td>
<td class="type">
<span class="param-type"><a href="Point.html">Point</a></span>
</td>
<td class="description last"><p>新的顶点</p></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code>index</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="description last"><p>需更新的顶点的序号</p></td>
</tr>
</tbody>
</table>
</div>
<dl class="details">
<dt class="tag-overrides">Overrides:</dt>
<dd class="tag-overrides"><ul class="dummy"><li>
<a href="SketchEditorNew.html#updateVertex">SketchEditorNew#updateVertex</a>
</li></ul></dd>
<p class="tag-source">
<a href="leaflet_sketchEditor_SketchEditor2D.js.html" class="button">查看源代码</a>
<span>
<a href="leaflet_sketchEditor_SketchEditor2D.js.html">leaflet/sketchEditor/SketchEditor2D.js</a>, <a href="leaflet_sketchEditor_SketchEditor2D.js.html#line197">line 197</a>
</span>
</p>
</dl>
</div>
</div>
</div>
<div class='vertical-section' style='margin-top: 10px'>
<h3 id='event'>事件</h3>
<div class="members">
<div class="member">
<h4 class="name" id="event:%E8%8D%89%E5%9B%BE%E7%BB%98%E5%88%B6%E5%AE%8C%E6%88%90%E4%BA%8B%E4%BB%B6">
<a class="href-link" href="#event:%E8%8D%89%E5%9B%BE%E7%BB%98%E5%88%B6%E5%AE%8C%E6%88%90%E4%BA%8B%E4%BB%B6">#</a>
<span class="code-name" style="font-size:30px">
草图绘制完成事件
</span>
</h4>
<h5 class="subsection-title">属性:</h5>
<div class="table-container">
<table class="props table">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Attributes</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr class="deep-level-0">
<td class="name"><code>event</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="attributes">
</td>
<td class="default">
</td>
<td class="description last"><p>事件对象</p></td>
</tr>
<tr class="deep-level-1">
<td class="name"><code>type</code></td>
<td class="type">
<span class="param-type"><a href="global.html#LayerEventType">LayerEventType</a></span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
'drawn'
</td>
<td class="description last"><p>事件类型</p></td>
</tr>
<tr class="deep-level-1">
<td class="name"><code>geometry</code></td>
<td class="type">
<span class="param-type"><a href="Geometry.html">Geometry</a></span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last"><p>绘制的几何对象</p></td>
</tr>
</tbody>
</table>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="SketchEditorNew.html#event:%25E8%258D%2589%25E5%259B%25BE%25E7%25BB%2598%25E5%2588%25B6%25E5%25AE%258C%25E6%2588%2590%25E4%25BA%258B%25E4%25BB%25B6">SketchEditorNew#event:草图绘制完成事件</a>
</li></ul></dd>
<p class="tag-source">
<a href="common_sketchEditor_base_SketchEditorNew.js.html" class="button">查看源代码</a>
<span>
<a href="common_sketchEditor_base_SketchEditorNew.js.html">common/sketchEditor/base/SketchEditorNew.js</a>, <a href="common_sketchEditor_base_SketchEditorNew.js.html#line49">line 49</a>
</span>
</p>
</dl>
<h5>示例</h5>
<p class="code-caption"><h7>鼠标绘制完成事件</h7></p>
<pre class="prettyprint"><code>sketchEditor.on('drawn', (event) => {
console.log("绘制的几何对象:", event.geometry)
})</code></pre>
</div>
<div class="member">
<h4 class="name" id="event:%E8%8D%89%E5%9B%BE%E8%A2%AB%E9%80%89%E4%B8%AD%E4%BA%8B%E4%BB%B6">
<a class="href-link" href="#event:%E8%8D%89%E5%9B%BE%E8%A2%AB%E9%80%89%E4%B8%AD%E4%BA%8B%E4%BB%B6">#</a>
<span class="code-name" style="font-size:30px">
草图被选中事件
</span>
</h4>
<h5 class="subsection-title">属性:</h5>
<div class="table-container">
<table class="props table">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Attributes</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr class="deep-level-0">
<td class="name"><code>event</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="attributes">
</td>
<td class="default">
</td>
<td class="description last"><p>事件对象</p></td>
</tr>
<tr class="deep-level-1">
<td class="name"><code>type</code></td>
<td class="type">
<span class="param-type"><a href="global.html#LayerEventType">LayerEventType</a></span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
'selected'
</td>
<td class="description last"><p>事件类型</p></td>
</tr>
<tr class="deep-level-1">
<td class="name"><code>selectedSketch</code></td>
<td class="type">
<span class="param-type"><a href="SketchEditor2D.html">SketchEditor2D</a></span>
|
<span class="param-type">SketchEditor3D</span>
</td>
<td class="attributes">
<optional><br>
</td>
<td class="default">
</td>
<td class="description last"><p>被选中的草图对象</p></td>
</tr>
</tbody>
</table>
</div>
<dl class="details">
<dt class="inherited-from">Inherited From:</dt>
<dd class="inherited-from"><ul class="dummy"><li>
<a href="SketchEditorNew.html#event:%25E8%258D%2589%25E5%259B%25BE%25E8%25A2%25AB%25E9%2580%2589%25E4%25B8%25AD%25E4%25BA%258B%25E4%25BB%25B6">SketchEditorNew#event:草图被选中事件</a>
</li></ul></dd>
<p class="tag-source">
<a href="common_sketchEditor_base_SketchEditorNew.js.html" class="button">查看源代码</a>
<span>
<a href="common_sketchEditor_base_SketchEditorNew.js.html">common/sketchEditor/base/SketchEditorNew.js</a>, <a href="common_sketchEditor_base_SketchEditorNew.js.html#line59">line 59</a>
</span>
</p>
</dl>
<h5>示例</h5>
<p class="code-caption"><h7>草图被鼠标选中事件</h7></p>
<pre class="prettyprint"><code>sketchEditor.on('selected', (event) => {
console.log("被选中事件:", event.selectedSketch)
})</code></pre>
</div>
</div>
</div>
</article>
</section>
</div>
<footer class="footer">
<div class="content has-text-centered">
<p>文档生成<a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.11</a></p>
<p class="sidebar-created-by">
<a href="http://www.smaryun.com" target="_blank">司马云</a> <span>© 2023 云生态圈</span>
<a href="http://webclient.smaryun.com/#/index" target="_blank">MapGIS Client for JavaScript</a>
</p>
</div>
</footer>
</div>
<div id="side-nav" class="side-nav">
<div style="margin-bottom: 10px;">
<img style="vertical-align: middle;margin-right: 10px;width: 30px;" src="./styles/anchor.png"/><a href="#page-title">构造函数</a>
</div>
<div style="margin-bottom: 10px;">
<img style="vertical-align: middle;margin-right: 10px;width: 30px;" src="./styles/anchor.png"/><a href="#member">成员变量</a>
</div>
<div style="margin-bottom: 10px;">
<img style="vertical-align: middle;margin-right: 10px;width: 30px;" src="./styles/anchor.png"/><a href="#function">方法</a>
</div>
<div>
<img style="vertical-align: middle;margin-right: 10px;width: 30px;" src="./styles/anchor.png"/><a href="#event">事件</a>
</div>
</div>
</div>
<script src="scripts/linenumber.js"> </script>
<script src="scripts/search.js"> </script>
</body>
</html>