@mapgis/webclient-common
Version:
mapgis ES6 format for igserver
2,247 lines (1,251 loc) • 179 kB
HTML
<header id="page-title" class="page-title">
<span class="page-title-main">类名</span>
<span class="page-title-sub">GeometryEngine</span>
</header>
<section>
<article>
<div class="container-overview">
<div class='vertical-section'>
<div class="members">
<div class="member">
<h4 class="name" id="GeometryEngine">
<a class="href-link" href="#GeometryEngine">#</a>
<span class="code-name" id="GeometryEngine" style="font-size:30px">
new GeometryEngine<span class="signature">()</span>
</span>
</h4>
<div class="description">
<p>几何分析工具</p>
</div>
<dl class="details">
</dl>
<p class="summary"><h5>支持如下方法：</h5>
<a href='#contains'>[1、是否包含(contains)]</a><br/>
<a href='#crosses'>[2、是否穿过]</a><br/>
<a href='#cut'>[3、几何切割]</a><br/>
<a href='#difference'>[4、几何求差]</a><br/>
<a href='#disjoint'>[5、是否相离]</a><br/>
<a href='#equals'>[6、是否相等]</a><br/>
<a href='#intersects'>[7、是否相交]</a><br/>
<a href='#intersect'>[8、返回两个几何对象的相交部分]</a><br/>
<a href='#nearestCoordinate'>[9、距离最近的点]</a><br/>
<a href='#overlaps'>[10、是否重叠]</a><br/>
<a href='#planarArea'>[11、计算平面面积]</a><br/>
<a href='#planarLength'>[12、计算平面长度]</a><br/>
<a href='#geodesicLength'>[13、计算地理长度]</a><br/>
<a href='#rotate'>[14、旋转]</a><br/>
<a href='#distance'>[15、计算距离]</a><br/>
<a href='#touches'>[16、是否相邻]</a><br/>
<a href='#union'>[17、求并]</a><br/>
<a href='#within'>[18、是否被包含(within)]</a><br/>
<a href='#buffer'>[19、缓冲区分析]</a><br/>
<a href='#isSimple'>[20、拓扑检查]</a><br/>
<a href='#getPositionsFromArc'>[21、通过三点弧段构造一组离散的点坐标]</a><br/>
<a href='#getArcFromGeometry'>[22、通过几何中的三点弧段数据，构造离散后的几何对象]</a><br/>
<a href='#getCenter'>[23、通过三个点求圆心]</a><br/>
<a href='#getAngleFromPoints'>[24、计算三点之间的夹角]</a><br/>
<a href='#simplify'>[25、拓扑矫正]</a><br/>
<a href='#getCenterOID'>[26、获取几何中心点]</a><br/></p>
</div>
</div>
</div>
</div>
<div class='vertical-section'>
<h3 id='function'>方法</h3>
<h4 style="margin-top: 20px;margin-bottom: 20px;">方法概述</h4>
<div class="members">
<div class="table-container">
<table class="params table">
<thead>
<tr>
<th>名称</th>
<th>返回值类型</th>
<th>描述</th>
</tr>
</thead>
<tbody>
<tr class="deep-level-0">
<td class="name"><code><a href="#buffer">buffer</a></code></td>
<td class="name">
<code>
<span class="param-type">
<a link="Geometry.html" onclick="getTypeHTML(event)" href="Geometry.html">Geometry</a>
</span>
|
<span class="param-type">
Array.<<a onclick="getTypeHTML(event)" link="Geometry.html">Geometry</a>>
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#contains">contains</a></code></td>
<td class="name">
<code>
<span class="param-type">
Boolean
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#crosses">crosses</a></code></td>
<td class="name">
<code>
<span class="param-type">
Boolean
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#cut">cut</a></code></td>
<td class="name">
<code>
<span class="param-type">
Array.<<a onclick="getTypeHTML(event)" link="Geometry.html">Geometry</a>>
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#difference">difference</a></code></td>
<td class="name">
<code>
<span class="param-type">
<a link="Polygon.html" onclick="getTypeHTML(event)" href="Polygon.html">Polygon</a>
</span>
|
<span class="param-type">
<a link="MultiPolygon.html" onclick="getTypeHTML(event)" href="MultiPolygon.html">MultiPolygon</a>
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#disjoint">disjoint</a></code></td>
<td class="name">
<code>
<span class="param-type">
Boolean
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#distance">distance</a></code></td>
<td class="name">
<code>
<span class="param-type">
Number
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#equals">equals</a></code></td>
<td class="name">
<code>
<span class="param-type">
Boolean
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#geodesicLength">geodesicLength</a></code></td>
<td class="name">
<code>
<span class="param-type">
Number
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#getAngleFromPoints">getAngleFromPoints</a></code></td>
<td class="name">
<code>
<span class="param-type">
Number
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#getArcFromGeometry">getArcFromGeometry</a></code></td>
<td class="name">
<code>
<span class="param-type">
<a link="LineString.html" onclick="getTypeHTML(event)" href="LineString.html">LineString</a>
</span>
|
<span class="param-type">
<a link="MultiLineString.html" onclick="getTypeHTML(event)" href="MultiLineString.html">MultiLineString</a>
</span>
|
<span class="param-type">
<a link="Polygon.html" onclick="getTypeHTML(event)" href="Polygon.html">Polygon</a>
</span>
|
<span class="param-type">
<a link="MultiPolygon.html" onclick="getTypeHTML(event)" href="MultiPolygon.html">MultiPolygon</a>
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#getCenter">getCenter</a></code></td>
<td class="name">
<code>
<span class="param-type">
Array.<Number>
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#getCenterOID">getCenterOID</a></code></td>
<td class="name">
<code>
<span class="param-type">
<a link="Point.html" onclick="getTypeHTML(event)" href="Point.html">Point</a>
</span>
</code>
</td>
<td class="name"><code><p>获取几何中心点
</code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#getEllipseCoordinates">getEllipseCoordinates</a></code></td>
<td class="name">
<code>
<span class="param-type">
Array
</span>
</code>
</td>
<td class="name"><code><p>获取椭圆离散化点坐标
</code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#getPositionsFromArc">getPositionsFromArc</a></code></td>
<td class="name">
<code>
<span class="param-type">
Array
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#intersect">intersect</a></code></td>
<td class="name">
<code>
<span class="param-type">
<a link="Geometry.html" onclick="getTypeHTML(event)" href="Geometry.html">Geometry</a>
</span>
|
<span class="param-type">
Array.<<a onclick="getTypeHTML(event)" link="Geometry.html">Geometry</a>>
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#intersects">intersects</a></code></td>
<td class="name">
<code>
<span class="param-type">
Boolean
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#isSimple">isSimple</a></code></td>
<td class="name">
<code>
<span class="param-type">
Boolean
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#nearestCoordinate">nearestCoordinate</a></code></td>
<td class="name">
<code>
<span class="param-type">
Project.<<a onclick="getTypeHTML(event)" link="Point.html">Point</a>>
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#overlaps">overlaps</a></code></td>
<td class="name">
<code>
<span class="param-type">
Boolean
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#planarArea">planarArea</a></code></td>
<td class="name">
<code>
<span class="param-type">
Number
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#planarLength">planarLength</a></code></td>
<td class="name">
<code>
<span class="param-type">
Number
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#rotate">rotate</a></code></td>
<td class="name">
<code>
<span class="param-type">
<a link="Geometry.html" onclick="getTypeHTML(event)" href="Geometry.html">Geometry</a>
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#simplify">simplify</a></code></td>
<td class="name">
<code>
<span class="param-type">
<a link="Geometry.html" onclick="getTypeHTML(event)" href="Geometry.html">Geometry</a>
</span>
</code>
</td>
<td class="name"><code><p>拓扑矫正
</code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#touches">touches</a></code></td>
<td class="name">
<code>
<span class="param-type">
Boolean
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#union">union</a></code></td>
<td class="name">
<code>
<span class="param-type">
<a link="Geometry.html" onclick="getTypeHTML(event)" href="Geometry.html">Geometry</a>
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code><a href="#within">within</a></code></td>
<td class="name">
<code>
<span class="param-type">
Boolean
</span>
</code>
</td>
<td class="name"><code><p></code></td>
</tr>
</tbody>
</table>
</div>
<h4 style="margin-top: 20px;margin-bottom: 20px;">方法详情</h4>
<div class="member">
<h4 class="name" id=".buffer">
<a class="href-link" href="#.buffer">#</a>
<span class='tag'>static</span>
<span class="code-name" id="buffer" style="font-size:30px">
buffer<span class="signature">(geometry<span class="signature-attributes">opt</span>, distance<span class="signature-attributes">opt</span>, unit<span class="signature-attributes">opt</span>, unionResults<span class="signature-attributes">opt</span>)</span>
</span>
</h4>
<div class="description">
<p><a id='buffer'></a>
缓冲区分析;<br/>
支持点几何、多点几何、线几何、多线几何、区几何、多区几何、矩形几何、圆形几何或任意几何组成的几何数组;<br/>
忽略三维高度，当geometry为几何数组时，其子元素的坐标系必须相同;<br/>
如果distance是数字，则可以为正值或负值，是正值则向外扩张，是负值，则表示向内收缩;<br/>
如果distance是数字，且geometry为几何数组，则该数字会应用到所有geometry数组的子元素;<br/>
如果distance是数组且geometry是数组，当distance的长度小于geometry数组的长度时，会以distance的最后一个子元素扩充distance数组，使其长度和geometry数组的长度相同，之后将distance数组和geometry数组根据下标一一对应，执行缓冲区分析;<br/>
如果distance是数组，但geometry不是数组，则使distance数组的第一个子元素做为缓冲距离来执行缓冲区分析;<br/>
注意一个或多个几何执行缓冲区分析后，由于缓冲后几何扩大，可能导致一个或多个几何出现重合的情况;;<br/>
示例如下：<br/>
<a href='#buffer1'>[1、区缓冲分析]</a><br/>
<a href='#buffer2'>[2、多区缓冲分析]</a><br/>
<a href='#buffer3'>[3、几何数组缓冲区分析]</a><br/>
<a href='#buffer4'>[4、几何数组缓冲区分析 - 结果几何合并]</a><br/>
<a href='#buffer5'>[5、区缓冲分析 - 自定义坐标系]</a><br/>
<a href='#buffer6'>[6、点缓冲分析]</a><br/>
<a href='#buffer7'>[7、线缓冲分析]</a><br/>
<a href='#buffer8'>[8、矩形缓冲分析]</a><br/>
<a href='#buffer9'>[9、圆形缓冲分析]</a><br/></p>
</div>
<h4>参数</h4>
<div class="table-container">
<table class="params table">
<thead>
<tr>
<th>名称</th>
<th>类型</th>
<th style="min-width: 100px;">默认值</th>
<th class="last">描述</th>
</tr>
</thead>
<tbody>
<tr class="deep-level-0">
<td class="name"><code>geometry</code></td>
<td class="type">
<span class="param-type">
<a link="Geometry.html" onclick="getTypeHTML(event)" href="Geometry.html">Geometry</a>
</span>
|
<span class="param-type">
Array.<<a onclick="getTypeHTML(event)" link="Geometry.html">Geometry</a>>
</span>
</td>
<td class="default">
null
</td>
<td class="description last"><p>要进行缓冲区分析的几何对象</p></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code>distance</code></td>
<td class="type">
<span class="param-type">
Number
</span>
|
<span class="param-type">
Array.<Number>
</span>
</td>
<td class="default">
1000
</td>
<td class="description last"><p>缓冲距离</p></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code>unit</code></td>
<td class="type">
<span class="param-type">
<a link="LengthUnit.html" onclick="getTypeHTML(event)" href="global.html#LengthUnit">LengthUnit</a>
</span>
</td>
<td class="default">
LengthUnit.meter
</td>
<td class="description last"><p>单位，默认米</p></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code>unionResults</code></td>
<td class="type">
<span class="param-type">
Boolean
</span>
</td>
<td class="default">
false
</td>
<td class="description last"><p>是否将返回的多个几何对象合并为单几何对象，默认为false，即不合并几何</p></td>
</tr>
</tbody>
</table>
</div>
<dl class="details">
</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 link="Geometry.html" onclick="getTypeHTML(event)" href="Geometry.html">Geometry</a>
</span>
|
<span class="param-type">
Array.<<a onclick="getTypeHTML(event)" link="Geometry.html">Geometry</a>>
</span>
</div>
</div>
</div>
</div>
<h5>示例</h5>
<p class="code-caption"><h5 id='buffer1'>区缓冲分析</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { Polygon, GeometryEngine } = zondy.geometry
// ES6引入方式
import { Polygon, GeometryEngine } from "@mapgis/webclient-common"
// 构造多边形
const polygon = new Polygon({
coordinates: [
[
[108.36341, 29.032578],
[116.13094, 29.032578],
[116.13094, 33.273224],
[108.36341, 33.273224],
[108.36341, 29.032578],
]
]
})
// 执行缓冲区分析
const bufferedPolygon = GeometryEngine.buffer(polygon, 100000)</code></pre>
<p class="code-caption"><h5 id='rotate2'>多区缓冲分析</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { MultiPolygon, GeometryEngine } = zondy.geometry
// ES6引入方式
import { MultiPolygon, GeometryEngine } from "@mapgis/webclient-common"
// 构造多边形
const polygon = new MultiPolygon({
coordinates: [
[
[
[108.36341, 29.032578],
[112.13094, 29.032578],
[112.13094, 33.273224],
[108.36341, 33.273224],
[108.36341, 29.032578],
]
],
[
[
[113.36341, 29.032578],
[116.13094, 29.032578],
[116.13094, 33.273224],
[113.36341, 33.273224],
[113.36341, 29.032578],
]
]
]
})
// 执行缓冲区分析
const bufferedPolygon = GeometryEngine.buffer(polygon, 30000)</code></pre>
<p class="code-caption"><h5 id='buffer3'>几何对象数组的缓冲区分析</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { Polygon, MultiPolygon, GeometryEngine } = zondy.geometry
// ES6引入方式
import { Polygon, MultiPolygon, GeometryEngine } from "@mapgis/webclient-common"
// 构造多边形
const polygon1 = new MultiPolygon({
coordinates: [
[
[
[110.36341, 29.032578],
[112.13094, 29.032578],
[112.13094, 33.273224],
[110.36341, 33.273224],
[110.36341, 29.032578],
]
],
[
[
[113.36341, 29.032578],
[116.13094, 29.032578],
[116.13094, 33.273224],
[113.36341, 33.273224],
[113.36341, 29.032578],
]
]
]
})
// 构造多边形2
const polygon2 = new Polygon({
coordinates: [
[
[108.36341, 29.032578],
[109.13094, 29.032578],
[109.13094, 33.273224],
[108.36341, 33.273224],
[108.36341, 29.032578],
]
]
})
// 执行缓冲区分析，distance可谓数字或数组
const bufferedPolygon = GeometryEngine.buffer([polygon1, polygon2], [30000, 30000])</code></pre>
<p class="code-caption"><h5 id='buffer4'>几何数组缓冲区分析 - 分析结果几何求并</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { Polygon, MultiPolygon, LengthUnit, GeometryEngine } = zondy.geometry
// ES6引入方式
import { Polygon, MultiPolygon, LengthUnit, GeometryEngine } from "@mapgis/webclient-common"
// 构造多边形
const polygon1 = new MultiPolygon({
coordinates: [
[
[
[110.36341, 29.032578],
[112.13094, 29.032578],
[112.13094, 33.273224],
[110.36341, 33.273224],
[110.36341, 29.032578],
]
],
[
[
[113.36341, 29.032578],
[116.13094, 29.032578],
[116.13094, 33.273224],
[113.36341, 33.273224],
[113.36341, 29.032578],
]
]
]
})
// 构造多边形2
const polygon2 = new Polygon({
coordinates: [
[
[108.36341, 29.032578],
[109.13094, 29.032578],
[109.13094, 33.273224],
[108.36341, 33.273224],
[108.36341, 29.032578],
]
]
})
// 执行缓冲区分析，设置unionResults参数为true
const bufferedPolygon = GeometryEngine.buffer([polygon1, polygon2], [30000], LengthUnit.meter, true)</code></pre>
<p class="code-caption"><h5 id='buffer5'>区缓冲分析 - 自定义坐标系</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { Polygon, SpatialReference, GeometryEngine } = zondy.geometry
// ES6引入方式
import { Polygon, SpatialReference, GeometryEngine } from "@mapgis/webclient-common"
// 构造多边形
const polygon = new Polygon({
coordinates: [
[
[-45257.10778559791, 3212885.1836444484],
[705989.8953363781, 3212885.1836444484],
[705989.8953363781, 3691623.86404564],
[-45257.10778559791, 3691623.86404564],
[-45257.10778559791, 3212885.1836444484],
]
],
// 注意要指定坐标系
spatialReference: new SpatialReference({
wkid: 4547
})
})
// 执行缓冲区分析
const bufferedPolygon = GeometryEngine.buffer(polygon, 100000)</code></pre>
<p class="code-caption"><h5 id='buffer6'>点缓冲分析</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { Point, GeometryEngine } = zondy.geometry
// ES6引入方式
import { Point, GeometryEngine } from "@mapgis/webclient-common"
// 构造点几何
const point = new Point({
coordinates: [108.36341, 29.032578]
})
// 执行缓冲区分析
const bufferedPolygon = GeometryEngine.buffer(point, 100000)</code></pre>
<p class="code-caption"><h5 id='buffer7'>线缓冲分析</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { LineString, GeometryEngine } = zondy.geometry
// ES6引入方式
import { LineString, GeometryEngine } from "@mapgis/webclient-common"
// 构造线
const lineString = new LineString({
coordinates: [
[108.36341, 29.032578],
[109.36341, 29.032578]
]
})
// 执行缓冲区分析
const bufferedPolygon = GeometryEngine.buffer(lineString, 10000)</code></pre>
<p class="code-caption"><h5 id='buffer8'>矩形缓冲分析</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { LineString, GeometryEngine } = zondy.geometry
// ES6引入方式
import { LineString, GeometryEngine } from "@mapgis/webclient-common"
// 构造矩形
const extent = new Extent({
xmin: 112,
xmax: 114,
ymin: 30,
ymax: 32
})
// 执行缓冲区分析
const bufferedPolygon = GeometryEngine.buffer(extent, 10000)</code></pre>
<p class="code-caption"><h5 id='buffer9'>圆形缓冲分析</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { Circle, GeometryEngine } = zondy.geometry
// ES6引入方式
import { Circle, GeometryEngine } from "@mapgis/webclient-common"
// 构造圆形
const circle = new Circle({
center: [112, 30],
radius: 3
})
// 执行缓冲区分析
const bufferedPolygon = GeometryEngine.buffer(circle, 10000)</code></pre>
</div>
<div class="member">
<h4 class="name" id=".contains">
<a class="href-link" href="#.contains">#</a>
<span class='tag'>static</span>
<span class="code-name" id="contains" style="font-size:30px">
contains<span class="signature">(containerGeometry<span class="signature-attributes">opt</span>, insideGeometry<span class="signature-attributes">opt</span>)</span>
</span>
</h4>
<div class="description">
<p><a id='contains'></a>
判断containerGeometry对象是否完全包含insideGeometry对象;<br/>
忽略三维高度;<br/>
支持自定义坐标系的几何对象，几何的坐标系必须相同;<br/>
包含标准如下：
点包含点的标准为：两个点几何坐标是否相等;<br/>
线包含线的标准为：一条线上的点都在另一条线上，或两条线的点坐标相同;<br/>
区包含线的标准为：线在区几何内，但线不全部在区几何边线上(包括内圈和外圈的边线);<br/>
区包含线的标准为：点在区几何内，不在边线上(包括内圈和外圈的边线);<br/>
区包含区的标准为：一个区在另一个区内(如果有带洞区域，则不能在带洞区域内，可以挨着边线)，边线可以重合;<br/>
其他情况为上述标准的组合;<br/>
由于包含的情况太多，这里仅列举部分示例，示例如下：<br/>
<a href='#intersects1'>[1、区包含点]</a><br/>
<a href='#intersects2'>[2、多点包含点]</a><br/>
<a href='#intersects3'>[3、区包含线]</a><br/>
<a href='#intersects4'>[4、圆包含矩形]</a><br/>
<a href='#intersects5'>[5、几何包含 - 自定义坐标系]</a><br/></p>
</div>
<h4>参数</h4>
<div class="table-container">
<table class="params table">
<thead>
<tr>
<th>名称</th>
<th>类型</th>
<th style="min-width: 100px;">默认值</th>
<th class="last">描述</th>
</tr>
</thead>
<tbody>
<tr class="deep-level-0">
<td class="name"><code>containerGeometry</code></td>
<td class="type">
<span class="param-type">
<a link="Geometry.html" onclick="getTypeHTML(event)" href="Geometry.html">Geometry</a>
</span>
</td>
<td class="default">
null
</td>
<td class="description last"><p>包含几何对象</p></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code>insideGeometry</code></td>
<td class="type">
<span class="param-type">
<a link="Geometry.html" onclick="getTypeHTML(event)" href="Geometry.html">Geometry</a>
</span>
</td>
<td class="default">
null
</td>
<td class="description last"><p>被包含的几何对象</p></td>
</tr>
</tbody>
</table>
</div>
<dl class="details">
</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">
Boolean
</span>
</div>
</div>
</div>
</div>
<h5>示例</h5>
<p class="code-caption"><h5 id='contains1'>区包含点</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { Polygon, Point, GeometryEngine } = zondy.geometry
// ES6引入方式
import { GeometryEngine, Polygon, Point } from "@mapgis/webclient-common"
// 初始点几何，可以是任意几何
const point = new Point({
coordinates: [1, 1]
})
// 初始化区几何，可以是任意几何
const polygon = new Polygon({
coordinates: [
[
[1, 0],
[10, 0],
[10, 20],
[1, 20],
[1, 0]
]
]
})
// 判断区几何是否包含点几何对象
const isContains = GeometryEngine.contains(polygon, point)
console.log("区是否包含点:", isContains)</code></pre>
<p class="code-caption"><h5 id='contains2'>多点包含点</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { MultiPoint, Point, GeometryEngine } = zondy.geometry
// ES6引入方式
import { MultiPoint, Point, GeometryEngine } from "@mapgis/webclient-common"
// 初始点几何
const point = new Point({
coordinates: [1, 1]
})
// 初始化多点几何
const multiPoint = new MultiPoint({
coordinates: [
[1, 1],
[1, 2]
]
})
// 判断多点几何是否包含点几何对象
const isContains = GeometryEngine.contains(multiPoint, point)
console.log("多点是否包含点:", isContains)</code></pre>
<p class="code-caption"><h5 id='contains3'>区包含线</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { Polygon, LineString, GeometryEngine } = zondy.geometry
// ES6引入方式
import { Polygon, LineString, GeometryEngine } from "@mapgis/webclient-common"
// 初始化区几何
const polygon = new Polygon({
coordinates: [
[
[1, 0],
[10, 0],
[10, 20],
[1, 20],
[1, 0]
]
]
})
// 初始化线几何
const lineString = new LineString({
coordinates: [
[1, 0],
[1, 6]
]
})
// 判断多点几何是否包含点几何对象
const isContains = GeometryEngine.contains(polygon, lineString)
console.log("区是否包含线:", isContains)</code></pre>
<p class="code-caption"><h5 id='contains4'>圆包含矩形</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { Circle, LineString, GeometryEngine } = zondy.geometry
// ES6引入方式
import { Circle, LineString, GeometryEngine } from "@mapgis/webclient-common"
// 初始化圆几何
const circle = new Circle({
center: [5, 5],
radius: 2
})
// 初始化矩几何
const extent = new Extent({
xmin: 2,
ymin: 2,
xmax: 4,
ymax: 4
})
// 判断多点几何是否包含点几何对象
const isContains = GeometryEngine.contains(circle, extent)
console.log("圆是否包含矩形:", isContains)</code></pre>
<p class="code-caption"><h5 id='contains5'>几何包含 - 自定义坐标系</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { Polygon, LineString, SpatialReference, GeometryEngine } = zondy.geometry
// ES6引入方式
import { Polygon, LineString, SpatialReference, GeometryEngine } from "@mapgis/webclient-common"
// 初始化线几何对象
const line = new LineString({
coordinates: [
[60000, 3426025],
[598545, 3426025]
],
// 要设置坐标系
spatialReference: new SpatialReference({
wkid: 4547
})
})
// 初始化区几何对象
const polygon = new Polygon({
coordinates: [
[
[0, 3226025],
[698545, 3226025],
[698545, 3685076],
[0, 3685076],
[0, 3226025]
],
[
[100000, 3326025],
[598545, 3326025],
[598545, 3485076],
[100000, 3485076],
[100000, 3326025]
]
],
// 要设置坐标系
spatialReference: new SpatialReference({
wkid: 4547
})
})
// 判断多点几何是否包含点几何对象
const isContains = GeometryEngine.contains(circle, extent)
console.log("圆是否包含矩形:", isContains)</code></pre>
</div>
<div class="member">
<h4 class="name" id=".crosses">
<a class="href-link" href="#.crosses">#</a>
<span class='tag'>static</span>
<span class="code-name" id="crosses" style="font-size:30px">
crosses<span class="signature">(geometry1, geometry2)</span>
</span>
</h4>
<div class="description">
<p><a id='crosses'></a>
判断一个几何对象是否穿过另一个几何对象;<br/>
要穿过的几何类型为：线、多线，忽略三维高度;<br/>
被穿过的几何类型为：线、多线、矩形、圆、区以及多区，忽略三维高度，穿线和被穿过几何的坐标系必须相同;<br/>
要穿过的几何与被穿过的几何（geometry1和geometry2）可以调换输入，但其中一个geometry必须是LineString、MultiLineString中的一类;<br/>
当被穿过的几何类型为MultiLineString、MultiPolygon时，只要MultiLineString和MultiPolygon中有一个要素被穿过，就算穿过，返回true;<br/>
当要穿过的几何类型为MultiLineString时，只要MultiLineString中有一条线穿过geometry2（被穿过的几何体），就算穿过，返回true;<br/>
如果两条线出现重叠，此种情况不算穿过，返回false;<br/
如果两条线出现“入”型、“L”型，此种情况不算穿过，返回false;<br/>
线与圆相切的情况不算穿过，返回false;<br/>
线和多边形的一条边重叠，算穿过，返回true;<br/>
当polygon有内圈时，只要穿过外圈就算穿过，返回true;<br/>
示例如下：<br/>
<a href='#cross1'>[1、线穿过线]</a><br/>
<a href='#cross2'>[2、线穿过多线]</a><br/>
<a href='#cross3'>[3、线穿过区]</a><br/>
<a href='#cross4'>[4、多线穿过区]</a><br/>
<a href='#cross5'>[5、多线穿过多区]</a><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>geometry1</code></td>
<td class="type">
<span class="param-type">
<a link="LineString.html" onclick="getTypeHTML(event)" href="LineString.html">LineString</a>
</span>
|
<span class="param-type">
<a link="MultiLineString.html" onclick="getTypeHTML(event)" href="MultiLineString.html">MultiLineString</a>
</span>
</td>
<td class="description last"><p>第一个几何体，支持线、多线；</p></td>
</tr>
<tr class="deep-level-0">
<td class="name"><code>geometry2</code></td>
<td class="type">
<span class="param-type">
<a link="LineString.html" onclick="getTypeHTML(event)" href="LineString.html">LineString</a>
</span>
|
<span class="param-type">
<a link="Polygon.html" onclick="getTypeHTML(event)" href="Polygon.html">Polygon</a>
</span>
|
<span class="param-type">
<a link="MultiLineString.html" onclick="getTypeHTML(event)" href="MultiLineString.html">MultiLineString</a>
</span>
|
<span class="param-type">
<a link="MultiPolygon.html" onclick="getTypeHTML(event)" href="MultiPolygon.html">MultiPolygon</a>
</span>
|
<span class="param-type">
<a link="Circle.html" onclick="getTypeHTML(event)" href="Circle.html">Circle</a>
</span>
|
<span class="param-type">
<a link="Extent.html" onclick="getTypeHTML(event)" href="Extent.html">Extent</a>
</span>
</td>
<td class="description last"><p>第二个几何体，支持线、多线、面、多面、圆、矩形，两个参数可以调换输入，但其中一个geometry必须是LineString、MultiLineString中的一类；</p></td>
</tr>
</tbody>
</table>
</div>
<dl class="details">
</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">
Boolean
</span>
</div>
</div>
</div>
</div>
<h5>示例</h5>
<p class="code-caption"><h5 id='cross1'>线穿过线</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { LineString, GeometryEngine } = zondy.geometry
// ES6引入方式
import { LineString, GeometryEngine } from "@mapgis/webclient-common"
// 构造要穿过的线对象
const line1 = new LineString({
coordinates: [
[108.36341, 29.032578],
[116.13094, 29.032578]
]
})
// 构造被穿过的线对象
const line2 = new LineString({
coordinates: [
[110, 28],
[110, 30],
[111, 30],
[111, 28]
]
})
// 开始判断穿过
const cross = GeometryEngine.crosses(line1, line2)
console.log("线是否穿过线:", cross)</code></pre>
<p class="code-caption"><h5 id='cross2'>线穿过多线</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { LineString, MultiLineString, GeometryEngine } = zondy.geometry
// ES6引入方式
import { LineString, MultiLineString, GeometryEngine } from "@mapgis/webclient-common"
// 构造要穿过的线对象
const line1 = new LineString({
coordinates: [
[108.36341, 29.032578],
[116.13094, 29.032578]
]
})
// 构造被穿过的多线对象
const multiLineString = new MultiLineString({
coordinates: [
[
[108.36341, 29.032578],
[116.13094, 29.032578]
],
[
[108.36341, 29.332578],
[116.13094, 29.332578]
]
]
})
// 开始判断穿过
const cross = GeometryEngine.crosses(line1, multiLineString)
console.log("线是否穿过多线:", cross)</code></pre>
<p class="code-caption"><h5 id='cross3'>线穿过区</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { LineString, Polygon, GeometryEngine } = zondy.geometry
// ES6引入方式
import { LineString, Polygon, GeometryEngine } from "@mapgis/webclient-common"
// 构造要穿过的线对象
const line = new LineString({
coordinates: [
[110, 28],
[110, 34],
[111, 34],
[112, 28]
]
})
// 构造被穿过的区对象
const polygon = new Polygon({
coordinates: [
[
[108.36341, 29.032578],
[116.13094, 29.032578],
[116.13094, 33.273224],
[108.36341, 33.273224],
[108.36341, 29.032578],
],
[
[109, 29.5],
[112, 29.5],
[112, 32],
[109, 32],
[109, 29.5],
]
]
})
// 开始判断穿过
const cross = GeometryEngine.crosses(line,polygon)
console.log("线是否穿过区:", cross)</code></pre>
<p class="code-caption"><h5 id='cross4'>多线穿过区</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { MultiLineString, Polygon, GeometryEngine } = zondy.geometry
// ES6引入方式
import { MultiLineString, Polygon, GeometryEngine } from "@mapgis/webclient-common"
// 构造要穿过的多线对象
const multiLineString = new MultiLineString({
coordinates: [
[
[108.36341, 29.032578],
[116.13094, 29.032578]
],
[
[108.36341, 29.332578],
[116.13094, 29.332578]
]
]
})
// 构造被穿过的区对象
const polygon = new Polygon({
coordinates: [
[
[108.36341, 29.032578],
[116.13094, 29.032578],
[116.13094, 33.273224],
[108.36341, 33.273224],
[108.36341, 29.032578],
],
[
[109, 29.5],
[112, 29.5],
[112, 32],
[109, 32],
[109, 29.5],
]
]
})
// 开始判断穿过
const cross = GeometryEngine.crosses( multiLineString,polygon)
console.log("多线是否穿过区:", cross)</code></pre>
<p class="code-caption"><h5 id='cross5'>多线穿过多区</h5></p>
<pre class="prettyprint"><code>// ES5引入方式
const { MultiLineString, MultiPolygon, SpatialReference, GeometryEngine } = zondy.geometry
// ES6引入方式
import { MultiLineString, MultiPolygon, SpatialReference, GeometryEngine } from "@mapgis/webclient-common"
// 构造要穿过的多线对象
const multiLineString = new MultiLineString({
coordinates: [
[
[-49522.6942635386, 3226025.20474049],
[707596.826929215, 3214754.20105]
],
[
[-47918.3624481045, 3259361.82328017],
[707596.826929215, 3259361.82328017]
]
],
// 必须指定坐标系
spatialReference: new SpatialReference({
wkid: 4547
})
})
// 构造被穿过的多区
const multiPolygon = new MultiPolygon({
coordinates: [
[
[
[-47918.3624481045, 3214754.20105],
[707596.826929215, 3214754.20105],
[707596.826929215, 3685076.66188228],
[-47918.3624481045, 3685076.66188228],
[-47918.3624481045, 3214754.20105]
],
[
[14849.3479447439, 3275130.08942507],
[310996.760637403, 3275130.08942507],
[310996.760637403, 3543600.9315051],
[14849.3479447439, 3543600.9315051],
[14849.3479447439, 3275130.08942507],
]
],
[
[
[813421.283605543, 3214754.20105],
[1071620.19329204, 3214754.20105],
[1071620.19329204, 3685076.66188228],
[813421.283605543, 3685076.66188228],
[813421.283605543, 3214754.20105]
]
]
],
// 必须指定坐标系
spatialReference: new SpatialReference({
wkid: 4547
})
})
// 开始判断穿过
const cross = GeometryEngine.crosses(multiLineString, multiPolygon)
console.log("多线是否穿过多区:", cross)</code></pre>
</div>
<div class="member">
<h4 class="name" id=".cut">
<a class="href-link" href="#.cut">#</a>
<span class='tag'>static</span>
<span class="code-name" id="cut" style="font-size:30px">
cut<span class="signature">(geometry, cutter)</span>
</span>
</h4>
<div class="description">
<p><a id='cut'></a>
使用一条线来切割几何，将其分割为多个几何对象;<br/>
被切割的几何类型为：线、多线、区以及多区，忽略三维高度，切线和被切割几何的坐标系必须相同;<br/>
此接口不会像arcgis的geometryEngine.cut方法那样，返回切割线左右两边的几何对象数组，而是把所有的被切割好的几何组成一个数组并返回;<br/>
如果切割线和被切割几何没有相交，则会返回一个空数组;<br/>
线切割线会返回被切割后的线几何数组;<br/>
线切割多线仅会返回被切割后的线几何数组，如果多线中的某一个线段不与切割线相交，则不会返回该线段几何;<br/>
线切割区会返回被切割后的区几何数组，如果切线仅仅是部分和区相交，但是没有穿过几何，会返回一个仅包含该区几何对像的数组;<br/>
线切割多区仅会返回被切割后的区几何数组，如果多区中的某一个区不与切割线相交，则不会返回该区几何;<br/>
示例如下：<br/>
<a href='#cut1'>[1、线切割线]</a><br/>
<a href='#cut2'>[2、线切割多线]</a><br/>
<a href='#cut3'>[3、线切割区]</a><br/>
<a href='