@mapgis/webclient-leaflet-plugin
Version:
1,165 lines • 85.1 kB
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title> common/base/geometry/Extent.js</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="ArcGISVectorTileLayer.html">ArcGISVectorTileLayer</a><span style="display: none;"><p>ArcGIS矢量瓦片图层
支持通过加载矢量瓦片服务、加载矢量瓦片样式文件和设置矢量瓦片样式的方式创建矢量瓦片图层
<br><br>[ES5引入方式]:<br/>
Zondy.Layer.ArcGISVectorTileLayer() <br/>
[ES6引入方式]:<br/>
import { ArcGISVectorTileLayer } 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/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="ArcGISVectorTileSubLayer.html">ArcGISVectorTileSubLayer</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="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两个服务版本,支持自定义坐标系,当IGS版本是1.0时,需要手动设置图层坐标系,当IGS版本是2.0时,会自动读取元信息上的坐标系,不需要用户指定<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="IGSSceneSubLayer.html">IGSSceneSubLayer</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两个服务版本,支持自定义坐标系,当IGS版本是1.0时,需要手动设置图层坐标系,当IGS版本是2.0时,会自动读取元信息上的坐标系,不需要用户指定,
<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="Basemap.html">Basemap</a><span style="display: none;"><p>基础地图对象
<br>[ES5引入方式]:<br/>
Zondy.Basemap() <br/>
[ES6引入方式]:<br/>
import { Map } from "@mapgis/webclient-common" <br/></p></span></li><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="">渲染器模块</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/>
[IGS地图图片图层]{@link IGSMapImageLayer}、[几何图形图层]{@link GraphicsLayer}、[IGS要素图层]{@link IGSFeatureLayer}、
[geojson图层]{@link GeoJSONLayer}、[OGC-WFS图层]{@link WFSLayer}</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="ClusterInfo.html">ClusterInfo</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="ClusterRenderer.html">ClusterRenderer</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="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="HeatmapColorStop.html">HeatmapColorStop</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="HeatmapRenderer.html">HeatmapRenderer</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="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="RandomRenderer.html">RandomRenderer</a><span style="display: none;"><p>随机渲染器,将随机颜色赋予要素,根据zoom等级颜色也将发生变化</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="RankRenderer.html">RankRenderer</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="SimpleRenderer.html">SimpleRenderer</a><span style="display: none;"><p>统一专题图渲染样式,支持的图层如下:<br/>
[几何图形图层]{@link GraphicsLayer}、[IGS要素图层]{@link IGSFeatureLayer}、
[geojson图层]{@link GeoJSONLayer}、[OGC-WFS图层]{@link WFSLayer}</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>size视觉变量</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/>
[IGS地图图片图层]{@link IGSMapImageLayer}、[几何图形图层]{@link GraphicsLayer}、[IGS要素图层]{@link IGSFeatureLayer}、
[geojson图层]{@link GeoJSONLayer}、[OGC-WFS图层]{@link WFSLayer}</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><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Zondy.ThemeLayer.GraphThemeLayer.html">GraphThemeLayer</a><span style="display: none;"><p>统计专题图通过为每个要素绘制统计图表来反映其对应的专题值的大小。它可同时表示多个字段属性信息,在区域本身与各区域之间形成横向和纵向的对比。<br>统计专题图多用于具有相关数量特征的地图上,比如表示不同地区多年的粮食产量、GDP、人口等,不同时段客运量、地铁流量等。目前提供的统计图类型有:柱状图(Bar),折线图(Line),饼图(Pie),三维柱状图(Bar3D),点状图(Point),环状图(Ring)。</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引擎),对地图引擎进行管理,如果要对地图图层进行管理请参考[Map]{@link Map},<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="Callout3D.html">Callout3D</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="ColorMaterial.html">ColorMaterial</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="Edges3D.html">Edges3D</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="ExtrudeSymbol3DLayer.html">ExtrudeSymbol3DLayer</a><span style="display: none;"><p>三维拉伸区符号图层,用来在三维场景中绘制拉伸的区几何,不支持二维地图视图<br/>
示例如下:<br/>
<a href='#ExtrudeSymbol3DLayer'>[1、创建三维拉伸区符号图层]</a><br/></p></span></li><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="FillSymbol3DLayer.html">FillSymbol3DLayer</a><span style="display: none;"><p>三维区符号图层,用于在三维场景中绘制平面区对象,不支持二维视图<br/>
示例如下:<br/>
<a href='#FillSymbol3DLayer'>[1、创建三维区符号图层]</a><br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="FillSymbol3DOutline.html">FillSymbol3DOutline</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="IconResource.html">IconResource</a><span style="display: none;"><p>图标资源,如果没有设置href,则使用系统自带的图标</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="IconSymbol3DLayer.html">IconSymbol3DLayer</a><span style="display: none;"><p>三维图标符号图层,用来在三维场景中绘制图标,不支持二维地图视图<br/>
支持使用网络图片资源或者使用系统自带的图标资源<br/>
是一个始终朝向屏幕,并且立起来的图标<br/>
示例如下:<br/>
<a href='#IconSymbol3DLayer-href'>[1、使用网络资源创建一个三维图标图层对象]</a><br/>
<a href='#IconSymbol3DLayer-primitive'>[2、使用系统自带资源创建一个三维图标图层对象]</a><br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="LabelSymbol3D.html">LabelSymbol3D</a><span style="display: none;"><p>三维注记符号,用于在三维场景中渲染线几何要素,不支持在二维视图中使用;<br/>
三维注记符号必须包含如下符号图层中的一个或多个,才能在三维场景中显示要素:<br/>
[三维文字符号图层]{@link TextSymbol3DLayer}<br/>
示例如下:<br/>
<a href='#LabelSymbol3D'>[1、创建一个三维注记符号对象]</a><br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="LineCallout3D.html">LineCallout3D</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="LineStyleMarker3D.html">LineStyleMarker3D</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="LineStylePattern3D.html">LineStylePattern3D</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="LineSymbol3D.html">LineSymbol3D</a><span style="display: none;"><p>三维线符号,用于在三维场景中渲染线几何要素,不支持在二维视图中使用;<br/>
三维线符号必须包含如下符号图层中的一个或多个,才能在三维场景中显示要素:<br/>
[三维线符号图层]{@link LineSymbol3DLayer}、[三维管道符号图层]{@link PathSymbol3DLayer}<br/>
示例如下:<br/>
<a href='#LineSymbol3D'>[1、创建线三维符号]</a><br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="LineSymbol3DLayer.html">LineSymbol3DLayer</a><span style="display: none;"><p>三维线符号图层,用来在三维场景中绘制二维线,不支持二维地图视图<br/>
示例如下:<br/>
<a href='#LineSymbol3DLayer'>[1、创建三维线符号图层]</a><br/></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="ObjectSymbol3DLayer.html">ObjectSymbol3DLayer</a><span style="display: none;"><p>三维体对象符号图层,使用三维体符号来绘制一个点几何要素<br/>
通过设置resource的primitive属性来设置符号形状,支持如下形状:<br/>
sphere、cylinder、cube、cone、inverted-cone、diamond、tetrahedron<br/>
也可通过设置resource中的href属性,来加载gltf数据<br/>
同时通过设置material属性来设置符号的外观<br/>
示例如下:<br/>
<a href='#ObjectSymbol3DLayer-href'>[1、使用网络资源创建一个三维体对象符号图层对象]</a><br/>
<a href='#ObjectSymbol3DLayer-primitive'>[2、使用系统自带资源创建一个三维体对象符号图层对象]</a><br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="PathSymbol3DLayer.html">PathSymbol3DLayer</a><span style="display: none;"><p>三维管道符号图层,定义如何在三维场景视图中绘制一个管道线<br/>
示例如下:<br/>
<a href='#PathSymbol3DLayer'>[1、创建三维管道符号图层]</a><br/></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="PointSymbol3D.html">PointSymbol3D</a><span style="display: none;"><p>三维点符号,在三维场景中渲染点几何要素,不支持二维视图;<br/>
三维点符号必须包含如下符号图层中的一个或多个,才能在三维场景中显示要素:<br/>
[三维图标符号图层]{@link IconSymbol3DLayer}、[三维对象符号图层]{@link ObjectSymbol3DLayer}、[三维文字符号图层]{@link TextSymbol3DLayer}<br/>
示例如下:<br/>
<a href='#PointSymbol3D'>[1、创建一个三维点符号对象]</a><br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="PointSymbol3DOutline.html">PointSymbol3DOutline</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="PolygonSymbol3D.html">PolygonSymbol3D</a><span style="display: none;"><p>三维体符号,用于在三维场景视图中渲染几何要素,不支持二维视图<br/>
三维体符号必须包含如下符号图层中的一个或多个,才能在三维场景中显示要素:<br/>
[三维区符号图层]{@link FillSymbol3DLayer}、[三维拉伸区符号图层]{@link ExtrudeSymbol3DLayer}、[三维线符号图层]{@link LineSymbol3DLayer}、[三维图标符号图层]{@link IconSymbol3DLayer}、[三维体对象符号图层]{@link ObjectSymbol3DLayer}、[三维注记符号图层]{@link TextSymbol3DLayer}<br/>
示例如下:<br/>
<a href='#PolygonSymbol3D'>[1、创建一个三维体符号对象]</a><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="StylePattern3D.html">StylePattern3D</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="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>三维符号图层基类,用来定义在三维中展示的点、线、区几何以及gltf的样式<br/>
所有的三维符号都有一个symbolLayers属性,是一个Symbol3DLayer的集合对象,所有的符号必须至少拥有一个或多个三维符号图层,才能进行正常显示<br/>
现有如下类型的三维符号图层:<br/>
IconSymbol3DLayer、ObjectSymbol3DLayer、LineSymbol3DLayer、PathSymbol3DLayer、FillSymbol3DLayer、WaterSymbol3DLayer、ExtrudeSymbol3DLayer、TextSymbol3DLayer<br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Symbol3DVerticalOffset.html">Symbol3DVerticalOffset</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="TextHalo.html">TextHalo</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><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="TextSymbol3DLayer.html">TextSymbol3DLayer</a><span style="display: none;"><p>三维注记符号图层,定义如何在三维场景中显示文字,不支持二维视图<br/>
示例如下:<br/>
<a href='#TextSymbol3DLayer'>[1、创建一个三维注记符号图层对象]</a><br/></p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="WaterSymbol3DLayer.html">WaterSymbol3DLayer</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="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="Projection.html">Projection</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="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="Screenshot.html">Screenshot</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="">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>
[ES6引入方式]:<br/>
import { Popup } from '@mapgis/webclient-leaflet-plugin' <br/>
自定义样式说明:<br/>
zondy-popup__content 弹窗容器样式<br/>
zondy-popup__tip 弹窗对话框箭头样式<br/>
zondy-popup__header 弹窗头部样式<br/>
zondy-popup__content 弹窗主体样式<br/>
zondy-popup__footer 弹窗底部样式<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="SketchCircleDrawTool.html">SketchCircleDrawTool</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;"><p>草图编辑基类</p></span></li><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SketchEditorLeaflet.html">SketchEditorLeaflet</a><span style="display: none;"><p>二维场景草图编辑类<br/>
<br>[ES5引入方式]:<br/>
const { SketchEditorLeaflet } = Zondy <br/>
[ES6引入方式]:<br/>
import { SketchEditorLeaflet } 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="SketchEditorVideo.html">SketchEditorVideo</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="SketchEditorVideoBase.html">SketchEditorVideoBase</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="SketchExtentDrawTool.html">SketchExtentDrawTool</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></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">common/base/geometry/Extent.js</span>
</header>
<section>
<article>
<pre class="prettyprint source linenums"><code>import * as T from '@turf/turf'
import Geometry from './Geometry'
import {defaultValue, Log, isNumber, toJSON} from '../../util'
import Zondy from '../Zondy'
import Point from './Point'
import { GeometryType, IGSGeometryType } from '../enum'
import Projection from '../Projection'
import SpatialReference from './SpatialReference'
import GeometryEngine from './GeometryEngine'
/**
* 几何范围对象,即左下角和右上角组成的矩形范围几何对象,参考示例:<a href='#Extent'>[几何范围对象]</a>
* <br><br>[ES5引入方式]:<br/>
* Zondy.Geometry.Extent() <br/>
* [ES6引入方式]:<br/>
* import { Extent } from "@mapgis/webclient-common" <br/>
* <br/>
* @class Extent
* @moduleEX GeometryModule
* @extends Geometry
* @param {Object} options 构造参数
* @param {Number} [options.xmin = 0] x轴最小坐标
* @param {Number} [options.ymin = 0] y轴最小坐标
* @param {Number} [options.xmax = 0] x轴最大坐标
* @param {Number} [options.ymax = 0] y轴最大坐标
* @param {Number} [options.zmin0] Z轴最小坐标
* @param {Number} [options.zmax0] Z轴最大坐标
* @param {SpatialReference} [options.spatialReference = new Zondy.SpatialReference('EPSG:4326')] 几何点的空间参考系,默认4326,当不是4326时请指定坐标系,方便进行投影转换,参考示例:<a href='#SpatialReference'>[指定坐标系]</a>
*
* @summary <h5>支持如下方法:</h5>
* <a href='#centerAt'>[1、根据中心点生成新的范围]</a><br/>
* <a href='#contains'>[2、输入的几何是否包含在范围内]</a><br/>
* <a href='#intersection'>[3、将原始范围与输入范围求交]</a><br/>
* <a href='#intersects'>[4、输入的几何图形是否与范围相交]</a><br/>
* <a href='#equals'>[5、是否和输入范围相等]</a><br/>
* <a href='#expand'>[6、按给定的因子扩大范围]</a><br/>
* <a href='#offset'>[7、平移extent]</a><br/>
* <a href='#union'>[8、求并]</a><br/>
* <a href='#toString'>[9、返回字符串]</a><br/>
* <a href='#toIGSOldString'>[10、返回IGS1.0的字符串]</a><br/>
* <a href='#getIGSType'>[11、返回IGS所对应的GeometryModule型]</a><br/>
* <a href='#fromJSON'>[12、通过传入的json构造并返回一个新的几何对象]</a><br/>
* <a href='#toJSON'>[13、导出为json对象]</a><br/>
* [14、克隆几何对象]{@link Geometry#clone}
*
* @example <caption><h7 id='Extent'>创建几何对象</h7></caption>
* // ES5引入方式
* const { Extent } = Zondy.Geometry
* // ES6引入方式
* import { Extent } from "@mapgis/webclient-common"
* new Extent({
* xmin: 10,
* xmax: 210,
* ymin: 0,
* ymax: 100
* })
*
* @example <caption><h7 id='spatialReference'>指定坐标系</h7></caption>
* // ES5引入方式
* const { Extent } = Zondy.Geometry
* const { SpatialReference } = Zondy
* // ES6引入方式
* import { Extent, SpatialReference } from "@mapgis/webclient-common"
* new Extent({
* // 3857坐标系的点
* xmin: 12060733.232006868,
* xmax: 12929863.44711455,
* ymin: 3377247.5680546067,
* ymax: 3934286.575385226,
* // 当不是4326时请指定坐标系,方便进行投影转换
* spatialReference: new SpatialReference('EPSG:3857')
* })
*/
class Extent extends Geometry {
constructor(options) {
super(options)
options = defaultValue(options, {})
/**
* x坐标最小值
* @default 0
* @member {Number} Extent.prototype.xmin
*/
this.xmin = defaultValue(options.xmin, 0)
/**
* y坐标最小值
* @default 0
* @member {Number} Extent.prototype.ymin
*/
this.ymin = defaultValue(options.ymin, 0)
/**
* x坐标最大值
* @default 0
* @member {Number} Extent.prototype.xmax
*/
this.xmax = defaultValue(options.xmax, 0)
/**
* y坐标最大值
* @default 0
* @member {Number} Extent.prototype.ymax
*/
this.ymax = defaultValue(options.ymax, 0)
/**
* z坐标最小值
* @member {Number} Extent.prototype.zmin
*/
this.zmin = defaultValue(options.zmin, undefined)
/**
* z坐标最大值
* @member {Number} Extent.prototype.zmax
*/
this.zmax = defaultValue(options.zmax, undefined)
this.type = GeometryType.extent
// 判断hasZ
this.hasZ = !(!isNumber(this.zmin) || !isNumber(this.zmax))
// 判断坐标是否为数字
if (
!isNumber(this.xmin) ||
!isNumber(this.ymin) ||
!isNumber(this.xmax) ||
!isNumber(this.ymax) ||
(typeof this.zmin !== 'undefined' && !isNumber(this.zmin)) ||
(typeof this.zmax !== 'undefined' && !isNumber(this.zmax))
) {
throw new Error('坐标必须为数字')
}
}
/**
* 根据中心点生成新的范围,新范围的宽高为当前范围的宽高
* @param {Point} point 中心点
* @returns {Extent} 以点为中心的新范围。
* @example <caption><h7 id='centerAt'>根据中心点生成新的范围</h7></caption>
* // ES5引入方式
* const { Extent, Point } = Zondy.Geometry
* // ES6引入方式
* import { Extent, Point } from "@mapgis/webclient-common"
* const extent = new Extent({
* xmin: 10,
* xmax: 210,
* ymin: 0,
* ymax: 100
* })
* const point = new Point({
* coordinates: [100.0, 0.0]
* })
* const newConst = extent.centerAt(point)
*/
centerAt(point) {
if (!point) throw new Error('传入参数错误')
// 对传入参数为Number[]或者Point的处理
const coordinates = Point.toCoordinates(point)
const { width } = this
const { height } = this
this.xmin = coordinates[0] - width / 2
this.xmax = coordinates[0] + width / 2
this.ymin = coordinates[1] - height / 2
this.ymax = coordinates[1] + height / 2
if (this.hasZ && point.hasZ) {
const zlength = this.zmax - this.zmin
this.zmin = coordinates[2] - zlength / 2
this.zmax = coordinates[2] + zlength / 2
}
return this
}
/**
* 输入的几何是否包含在范围内
* @param {Point|Extent} geometry 输入的几何图形
* @returns {Boolean} 如果输入几何图形包含在范围内,则返回true
* @example <caption><h7 id='contains'>输入的几何是否包含在范围内</h7></caption>
* // ES5引入方式
* const { Extent, Point } = Zondy.Geometry
* // ES6引入方式
* import { Extent, Point } from "@mapgis/webclient-common"
* const extent = new Extent({
* xmin: 10,
* xmax: 210,
* ymin: 0,
* ymax: 100
* })
* const point = new Point({
* coordinates: [100.0, 0.0]
* })
* const isIn = extent.contains(point)
*/
contains(geometry) {
// 使用turf判断面与面,面与点的包含关系
if (!(geometry instanceof Point) && !(geometry instanceof Extent)) {
return false
}
// 因为turf的精度问题,将几何转为4326进行比较
let _geometry = geometry
if (!_geometry.isGeographic) {
_geometry = Projection.project(
geometry,
new SpatialReference({ wkid: 4326 })
)
}
let _extent = this
if (!_extent.isGeographic) {
_extent = Projection.project(this, new SpatialReference({ wkid: 4326 }))
}
const extentPolygonOri = T.polygon([
[
[_extent.xmin, _extent.ymin],
[_extent.xmin, _extent.ymax],
[_extent.xmax, _extent.ymax],
[_extent.xmax, _extent.ymin],
[_extent.xmin, _extent.ymin]
]
])
let currentGeometry
if (_geometry instanceof Point) {
currentGeometry = T.point(_geometry._cloneCoordinates())
} else {
currentGeometry = T.polygon([
[
[_geometry.xmin, _geometry.ymin],
[_geometry.xmin, _geometry.ymax],
[_geometry.xmax, _geometry.ymax],
[_geometry.xmax, _geometry.ymin],
[_geometry.xmin, _geometry.ymin]
]
])
}
return T.booleanContains(extentPolygonOri, currentGeometry)
}
/**
* 将原始范围与输入范围求交
* @param {Extent} extent 输入的范围,用于相交。
* @returns {Extent} 返回输入Extent与原始Extent的交集,没有交集返回 null
* @example <caption><h7 id='intersection'>将原始范围与输入范围求交</h7></caption>
* // ES5引入方式
* const { Extent } = Zondy.Geometry
* // ES6引入方式
* import { Extent } from "@mapgis/webclient-common"
* const extent = new Extent({
* xmin: 10,
* xmax: 210,
* ymin: 0,
* ymax: 100
* })
* const extent2 = new Extent({
* xmin: 10,
* xmax: 210,
* ymin: 0,
* ymax: 100
* })
* const newExtent = extent.intersection(extent2)
*/
intersection(extent) {
if (!extent) Log.error('传入参数错误!')
if (!(extent instanceof Extent)) Log.error('extent不是Extent几何!')
if (!this.spatialReference.equals(extent.spatialReference)) {
Log.error('不是同一个坐标系!')
}
// 因为turf的精度问题,将几何转为4326进行比较
let _geometry = extent
if (!_geometry.isGeographic) {
_geometry = Projection.project(
extent,
new SpatialReference({ wkid: 4326 })
)
}
let _extent = this
if (!_extent.isGeographic) {
_extent = Projection.project(this, new SpatialReference({ wkid: 4326 }))
}
const extentPolygonOri = T.polygon([
[
[_extent.xmin, _extent.ymin],
[_extent.xmin, _extent.ymax],
[_extent.xmax, _extent.ymax],
[_extent.xmax, _extent.ymin],
[_extent.xmin, _extent.ymin]
]
])
const extentPolygonAdd = T.polygon([
[
[_geometry.xmin, _geometry.ymin],
[_geometry.xmin, _geometry.ymax],
[_geometry.xmax, _geometry.ymax],
[_geometry.xmax, _geometry.ymin],
[_geometry.xmin, _geometry.ymin]
]
])
let result = null
const geoJSON = T.intersect(extentPolygonOri, extentPolygonAdd)
if (geoJSON && geoJSON.geometry) {
let bbox
if (geoJSON.geometry.type === 'Polygon') {
bbox = T.bbox(T.polygon(geoJSON.geometry.coordinates))
} else if (geoJSON.geometry.type === 'MultiPolygon') {
bbox = T.bbox(T.multiPolygon(geoJSON.geometry.coordinates))
}
if (bbox) {
result = new Extent({
xmin: bbox[0],
ymin: bbox[1],
xmax: bbox[2],
ymax: bbox[3]
})
if (!this.spatialReference.isGeographic) {
result = Projection.project(
result,
SpatialReference.fromJSON(this.spatialReference)
)
}
}
}
return result
}
/**
* 输入的几何图形是否与范围相交
* @param {Geometry} geometry 用于测试相交的几何图形。可以是 Point, Polyline, Polygon, Extent or Multipoint
* @returns {Boolean} 如果输入几何图形与区段相交,则返回true
* @example <caption><h7 id='intersects'>输入的几何图形是否与范围相交</h7></caption>
* // ES5引入方式
* const { Extent, Point } = Zondy.Geometry
* // ES6引入方式
* import { Extent, Point } from "@mapgis/webclient-common"
* const extent = new Extent({
* xmin: 10,
* xmax: 210,
* ymin: 0,
* ymax: 100
* })
* const point = new Point({
* coordinates: [100.0, 0.0]
* })
* const isIntersect = extent.intersects(point)
*/
intersects(geometry) {
return GeometryEngine.intersects(this, geometry)
}
/**
* 是否和输入范围相等
* @param {Extent} extent 输入的外包范围
* @returns {Boolean} 如果输入范围等于调用equals()的范围,则返回true
* @example <caption><h7 id='equals'>是否和输入范围相等</h7></caption>
* // ES5引入方式
* const { Extent } = Zondy.Geometry
* // ES6引入方式
* import { Extent } from "@mapgis/webclient-common"
* const extent = new Extent({
* xmin: 10,
* xmax: 210,
* ymin: 0,
* ymax: 100
* })
* const extent2 = new Extent({
* xmin: 10,
* xmax: 210,
* ymin: 0,
* ymax: 100
* })
* const isEqual = extent.equals(extent2)
*/
equals(extent) {
if (!extent) throw new Error('传入参数错误')
const condition1 = !!Math.abs(this.xmax - extent.xmax) <= 10e-8
const condition2 = !!Math.abs(this.xmin - extent.xmin) <= 10e-8
const condition3 = !!Math.abs(this.ymax - extent.ymax) <= 10e-8
const condition4 = !!Math.abs(this.ymin - extent.ymin) <= 10e-8
if (!this.hasZ) {
return condition1 && condition2 && condition3 && condition4
}
const condition5 = !!Math.abs(this.zmax - extent.zmax) <= 10e-8
const condition6 = !!Math.abs(this.zmin - extent.zmin) <= 10e-8
return (
condition1 &&
condition2 &&
condition3 &&
condition4 &&
condition5 &&
condition6
)
}
/**
* 按给定的因子扩大范围。例如,值为1.5将将范围扩展到比原始范围大50%。
* @param {Number} factor 乘数的值,必须大于等于1
* @returns {Extent} 返回扩大的范围
* @example <caption><h7 id='expand'>按给定的因子扩大范围</h7></caption>
* // ES5引入方式
* const { Extent } = Zondy.Geometry
* // ES6引入方式
* import { Extent } from "@mapgis/webclient-common"
* const extent = new Extent({
* xmin: 10,
* xmax: 210,
* ymin: 0,
* ymax: 100
* })
* extent.expand(1.5)
*/
expand(factor) {
if (typeof factor === 'number') {
if (factor >= 1) {
factor = Math.abs(factor)
const width = this.width * factor
const height = this.height * factor
const widthSub = width - this.width
const heightSub = height - this.height
this.xmin -= widthSub / 2
this.xmax += widthSub / 2
this.ymin -= heightSub / 2
this.ymax += heightSub / 2
}
return this
} else {
throw new Error('按照给定的因子扩大范围,需要的是一个num值')
}
}
/**
* 根据输入的dx, dy, dz值,平移extent
* @param {Number} dx 要平移的x值
* @param {Number} dy 要平移的y值
* @param {Number} dz 要平移的z值
* @returns {Extent} 偏移后的范围
* @example <caption><h7 id='offset'>平移extent</h7></caption>
* // ES5引入方式
* const { Extent } = Zondy.Geometry
* // ES6引入方式
* import { Extent } from "@mapgis/webclient-common"
* const extent = new Extent({
* xmin: 10,
* xmax: 210,
* ymin: 0,
* ymax: 100
* })
* extent.offset(0, 1, 0)
*/
offset(dx, dy, dz) {
if (!isNumber(dx) || !isNumber(dy) || (this.hasZ && !isNumber(dz))) {
throw new Error('传入参数错误')
}
this.xmax += dx
this.xmin += dx
this.ymax += dy
this.ymin += dy
if (this.hasZ) {
this.zmax += dz
this.zmin += dz
}
return this
}
/**
* 求并
* @param {Extent} extent 输入的范围,用于并集
* @returns {Extent} 返回输入Extent与原始Extent的并集
* @example <caption><h7 id='union'>求并</h7></caption>
* // ES5引入方式
* const { Extent } = Zondy.Geometry
* // ES6引入方式
* import { Extent } from "@mapgis/webclient-common"
* const extent = new Extent({
* xmin: 10,
* xmax: 210,
* ymin: 0,
* ymax: 100
* })
* const extent2 = new Extent({
* xmin: 10,
* xmax: 210,
* ymin: 0,
* ymax: 100
* })
* const newExtent = extent.union(extent2)
*/
union(extent) {
if (!extent) throw new Error('传入参数错误')
if (!this.hasZ) {
return new Extent({
xmin: extent.xmin < this.xmin ? extent.xmin : this.xmin,
xmax: extent.xmax > this.xmax ? extent.xmax : this.xmax,
ymin: extent.ymin < this.ymin ? extent.ymin : this.ymin,
ymax: extent.ymax > this.ymax ? extent.ymax : this.ymax
})
}
return new Extent({
xmin: extent.xmin < this.xmin ? extent.xmin : this.xmin,
xmax: extent.xmax > this.xmax ? extent.xmax : this.xmax,
ymin: extent.ymin < this.ymin ? extent.ymin : this.ymin,
ymax: extent.ymax > this.ymax ? extent.ymax : this.ymax,
zmin: extent.zmin < this.zmin ? extent.zmin : this.zmin,
zmax: extent.zmax > this.zmax ? extent.zmax : this.zmax
})
}
/**
* 返回如下格式的字符串:"xmin,ymin,xmax,ymax"<a id='toString'></a>
* @returns string
*/
toString() {
if (this.hasZ) {
return `${this.xmin},${this.ymin},${this.zmin},${this.xmax},${this.ymax},${this.zmax}`
}
return `${this.xmin},${this.ymin},${this.xmax},${this.ymax}`
}
/**
* 通过传入的json构造并返回一个新的几何对象
* @param {Object} [json] JSON对象
* @example <caption><h7 id='fromJSON'>通过传入的json构造并返回一个新的几何对象</h7></caption>
* // ES5引入方式
* const { Extent } = Zondy.Geometry
* // ES6引入方式
* import { Extent } from "@mapgis/webclient-common"
* const json = {
* xmin: 10,
* xmax: 210,
* ymin: 0,
* ymax: 100
* }
* const extent = Extent.fromJSON(json)
*/
static fromJSON(json) {
json = defaultValue(json, {})
return new Extent(json)
}
/**
* <a id='toJSON'></a>
* 导出为json对象
* @return {Object} json对象
*/
toJSON() {
const json = super.toJSON()
json.xmin = this.xmin
json.ymin = this.ymin
json.xmax = this.xmax
json.ymax = this.ymax
json.zmin = this.zmin
json.zmax = this.zmax
json.width = this.width
json.height = this.height
return json
}
/**
* 返回如下格式的字符串:"xmin$ymin$xmax$ymax"<a id='toIGSOldString'></a>
* @returns string
*/
toIGSOldString() {
return `${this.xmin}$${this.ymin}$${this.xmax}$${this.ymax}`
}
/**
* 返回IGS所对应的GeometryModule型<a id='getIGSType'></a>
* @returns string GeometryModule型
*/
getIGSType() {
if (this.hasZ) {
return IGSGeometryType.extent3D
}
return IGSGeometryType.extent
}
/**
* 归一化计算
* @returns {Extent} 归一化后的点对象
* @example <caption><h7 id='normalize'>归一化计算</h7></caption>
* // ES5引入方式
* const { Extent } = Zondy.Geometry
* // ES6引入方式
* import { Extent } from "@mapgis/webclient-common"
* const extent = new Extent({
* xmin: 10,
* xmax: 210,
* ymin: 0,
* ymax: 100
* })
* const normalize = extent.normalize()
*/
normalize() {
let pointMin = new Point({
coordinates: [this.xmin, this.ymin]
})
let pointMax = new Point({
coordinates: [this.xmax, this.ymax]
})
pointMin = pointMin.normalize()
pointMax = pointMax.normalize()
const extent = new Extent({
xmin: pointMin.coordinates[0],
ymin: pointMin.coordinates[1],
xmax: pointMax.coordinates[0],
ymax: pointMax.coordinates[1]
})
return extent
}
/**
* 克隆几何对象
* @return {Geometry} 克隆后的几何对象
*/
clone() {
return new Extent(this.toJSON())
}
}
Object.defineProperties(Extent.prototype, {
/**
* 宽度
* @member {Number} Extent.prototype.width
* */
width: {
configurable: false,
get() {
return this.xmax - this.xmin
}
},
/**
* 高度
* @member {Number} Extent.prototype.height
* */
height: {
configurable: false,
get() {
return this.ymax - this.ymin
}
},
/**
* 中心点
* @member {Number[]} Extent.prototype.center
* */
center: {
configurable: false,
set(center) {
this.centerAt(center)
},
get() {
if (!this.hasZ) {
return new Point({
coordinates: [
(this.xmax - this.xmin) / 2 + this.xmin,
(this.ymax - this.ymin) / 2 + this.ymin
]
})
}
return new Point({
coordinates: [
(this.xmax - this.xmin) / 2 + this.xmin,
(this.ymax - this.ymin) / 2 + this.ymin,
(this.zmax - this.zmin) / 2 + this.zmin
]
})
}
}
})
Zondy.Geometry.Extent = Extent
export default Extent
</code></pre>
</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://192.168.82.89:8086/#/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>