my-openlayer 2.4.10 → 2.4.12

package/docs/.vitepress/dist/assets/MyOl.md.D-14Gzjy.lean.js

@@ -0,0 +1 @@
+import{_ as s,c as i,ae as a,o as e}from"./chunks/framework.C_W0ODpn.js";const c=JSON.parse('{"title":"MyOl 类","description":"","frontmatter":{},"headers":[],"relativePath":"MyOl.md","filePath":"MyOl.md"}'),l={name:"MyOl.md"};function n(h,t,p,d,o,r){return e(),i("div",null,t[0]||(t[0]=[a("",74)]))}const g=s(l,[["render",n]]);export{c as __pageData,g as default};

package/docs/.vitepress/dist/assets/Point.md.Bi9juuuv.js

@@ -0,0 +1,57 @@
+import{_ as s,c as i,ae as a,o as e}from"./chunks/framework.C_W0ODpn.js";const g=JSON.parse('{"title":"Point 类","description":"","frontmatter":{},"headers":[],"relativePath":"Point.md","filePath":"Point.md"}'),l={name:"Point.md"};function n(h,t,d,p,k,r){return e(),i("div",null,t[0]||(t[0]=[a(`<h1 id="point-类" tabindex="-1">Point 类 <a class="header-anchor" href="#point-类" aria-label="Permalink to &quot;Point 类&quot;">​</a></h1><p><code>Point</code> 类用于在地图上添加和管理点要素，支持普通点、聚合点、DOM 点、高性能闪烁点和 Vue 组件点。</p><h2 id="构造函数" tabindex="-1">构造函数 <a class="header-anchor" href="#构造函数" aria-label="Permalink to &quot;构造函数&quot;">​</a></h2><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">constructor</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(map: Map)</span></span></code></pre></div><ul><li><strong>map</strong>: OpenLayers 地图实例。</li></ul><h2 id="接口定义" tabindex="-1">接口定义 <a class="header-anchor" href="#接口定义" aria-label="Permalink to &quot;接口定义&quot;">​</a></h2><h3 id="pointoptions" tabindex="-1">PointOptions <a class="header-anchor" href="#pointoptions" aria-label="Permalink to &quot;PointOptions&quot;">​</a></h3><p>继承自 <code>BaseOptions</code>, <code>StyleOptions</code>, <code>TextOptions</code>。</p><table tabindex="0"><thead><tr><th style="text-align:left;">属性名</th><th style="text-align:left;">类型</th><th style="text-align:left;">说明</th></tr></thead><tbody><tr><td style="text-align:left;">textKey</td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">数据中用于显示文本的字段键名</td></tr><tr><td style="text-align:left;">img</td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">图标图片的 URL</td></tr><tr><td style="text-align:left;">scale</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">图标缩放比例</td></tr><tr><td style="text-align:left;">iconColor</td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">图标颜色（用于改变图标色调）</td></tr><tr><td style="text-align:left;">layerName</td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">图层名称（必填，继承自 BaseOptions）</td></tr><tr><td style="text-align:left;">zIndex</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">图层层级</td></tr><tr><td style="text-align:left;">visible</td><td style="text-align:left;"><code>boolean</code></td><td style="text-align:left;">是否可见</td></tr><tr><td style="text-align:left;">style</td><td style="text-align:left;"><code>Style | Style[] | ((feature: FeatureLike) =&gt; Style | Style[])</code></td><td style="text-align:left;">自定义样式函数</td></tr></tbody></table><h3 id="clusteroptions" tabindex="-1">ClusterOptions <a class="header-anchor" href="#clusteroptions" aria-label="Permalink to &quot;ClusterOptions&quot;">​</a></h3><p>继承自 <code>PointOptions</code>。</p><table tabindex="0"><thead><tr><th style="text-align:left;">属性名</th><th style="text-align:left;">类型</th><th style="text-align:left;">说明</th></tr></thead><tbody><tr><td style="text-align:left;">distance</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">聚合距离（像素），默认为 20</td></tr><tr><td style="text-align:left;">minDistance</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">最小聚合距离</td></tr></tbody></table><h3 id="pulsepointoptions" tabindex="-1">PulsePointOptions <a class="header-anchor" href="#pulsepointoptions" aria-label="Permalink to &quot;PulsePointOptions&quot;">​</a></h3><p>继承自 <code>PointOptions</code>，因此与 <code>addPoint</code> 一致支持 <code>img</code>、<code>scale</code>、<code>iconColor</code>、<code>textKey</code>、<code>textVisible</code> 等参数。</p><table tabindex="0"><thead><tr><th style="text-align:left;">属性名</th><th style="text-align:left;">类型</th><th style="text-align:left;">说明</th></tr></thead><tbody><tr><td style="text-align:left;">levelKey</td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">点位等级字段，默认 <code>lev</code></td></tr><tr><td style="text-align:left;">icon</td><td style="text-align:left;"><code>PulsePointIconOptions</code></td><td style="text-align:left;">不使用 <code>img</code> 时的矢量圆点兜底配置</td></tr><tr><td style="text-align:left;">pulse.enabled</td><td style="text-align:left;"><code>boolean</code></td><td style="text-align:left;">是否启用闪烁圈，默认 <code>true</code></td></tr><tr><td style="text-align:left;">pulse.duration</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">单轮动画时长，默认 <code>2400ms</code></td></tr><tr><td style="text-align:left;">pulse.radius</td><td style="text-align:left;"><code>[number, number]</code></td><td style="text-align:left;">闪烁圈半径范围，默认 <code>[8, 26]</code></td></tr><tr><td style="text-align:left;">pulse.colorMap</td><td style="text-align:left;"><code>Record&lt;string | number, string&gt;</code></td><td style="text-align:left;">按等级配置闪烁圈填充色</td></tr><tr><td style="text-align:left;">pulse.strokeColorMap</td><td style="text-align:left;"><code>Record&lt;string | number, string&gt;</code></td><td style="text-align:left;">按等级配置闪烁圈描边色</td></tr><tr><td style="text-align:left;">pulse.strokeWidth</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">闪烁圈描边宽度，默认 <code>0</code></td></tr><tr><td style="text-align:left;">pulse.frameCount</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">动画分帧缓存数量，默认 <code>24</code></td></tr></tbody></table><h3 id="pulsepointlayerhandle" tabindex="-1">PulsePointLayerHandle <a class="header-anchor" href="#pulsepointlayerhandle" aria-label="Permalink to &quot;PulsePointLayerHandle&quot;">​</a></h3><table tabindex="0"><thead><tr><th style="text-align:left;">属性名</th><th style="text-align:left;">类型</th><th style="text-align:left;">说明</th></tr></thead><tbody><tr><td style="text-align:left;">layer</td><td style="text-align:left;"><code>VectorLayer&lt;VectorSource&gt;</code></td><td style="text-align:left;">创建的闪烁点图层</td></tr><tr><td style="text-align:left;">source</td><td style="text-align:left;"><code>VectorSource</code></td><td style="text-align:left;">图层数据源</td></tr><tr><td style="text-align:left;">start</td><td style="text-align:left;"><code>() =&gt; void</code></td><td style="text-align:left;">开始闪烁动画</td></tr><tr><td style="text-align:left;">stop</td><td style="text-align:left;"><code>() =&gt; void</code></td><td style="text-align:left;">停止闪烁动画</td></tr><tr><td style="text-align:left;">setVisible</td><td style="text-align:left;"><code>(visible: boolean) =&gt; void</code></td><td style="text-align:left;">控制图层显隐</td></tr><tr><td style="text-align:left;">updateData</td><td style="text-align:left;"><code>(data: PointData[]) =&gt; void</code></td><td style="text-align:left;">更新点位数据</td></tr><tr><td style="text-align:left;">remove</td><td style="text-align:left;"><code>() =&gt; void</code></td><td style="text-align:left;">停止动画并移除图层</td></tr></tbody></table><h3 id="pointdata" tabindex="-1">PointData <a class="header-anchor" href="#pointdata" aria-label="Permalink to &quot;PointData&quot;">​</a></h3><table tabindex="0"><thead><tr><th style="text-align:left;">属性名</th><th style="text-align:left;">类型</th><th style="text-align:left;">说明</th></tr></thead><tbody><tr><td style="text-align:left;">lgtd</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">经度</td></tr><tr><td style="text-align:left;">lttd</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">纬度</td></tr><tr><td style="text-align:left;">[key: string]</td><td style="text-align:left;"><code>any</code></td><td style="text-align:left;">其他业务数据字段</td></tr></tbody></table><h3 id="vuetemplatepointoptions" tabindex="-1">VueTemplatePointOptions <a class="header-anchor" href="#vuetemplatepointoptions" aria-label="Permalink to &quot;VueTemplatePointOptions&quot;">​</a></h3><table tabindex="0"><thead><tr><th style="text-align:left;">属性名</th><th style="text-align:left;">类型</th><th style="text-align:left;">说明</th></tr></thead><tbody><tr><td style="text-align:left;">Template</td><td style="text-align:left;"><code>any</code></td><td style="text-align:left;">Vue 组件模板</td></tr><tr><td style="text-align:left;">lgtd</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">经度</td></tr><tr><td style="text-align:left;">lttd</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">纬度</td></tr><tr><td style="text-align:left;">props</td><td style="text-align:left;"><code>any</code></td><td style="text-align:left;">传递给组件的 props</td></tr><tr><td style="text-align:left;">styleType</td><td style="text-align:left;"><code>&#39;default&#39; | &#39;custom&#39;</code></td><td style="text-align:left;">样式类型</td></tr><tr><td style="text-align:left;">positioning</td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">定位方式，如 &#39;bottom-center&#39;</td></tr><tr><td style="text-align:left;">stopEvent</td><td style="text-align:left;"><code>boolean</code></td><td style="text-align:left;">是否阻止事件冒泡</td></tr><tr><td style="text-align:left;">visible</td><td style="text-align:left;"><code>boolean</code></td><td style="text-align:left;">是否可见</td></tr><tr><td style="text-align:left;">className</td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">自定义类名</td></tr><tr><td style="text-align:left;">zIndex</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">层级</td></tr></tbody></table><h2 id="方法" tabindex="-1">方法 <a class="header-anchor" href="#方法" aria-label="Permalink to &quot;方法&quot;">​</a></h2><h3 id="addpoint" tabindex="-1">addPoint <a class="header-anchor" href="#addpoint" aria-label="Permalink to &quot;addPoint&quot;">​</a></h3><p>添加普通点图层。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addPoint</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(pointData: PointData[], options: PointOptions): VectorLayer</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">VectorSource</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> null</span></span></code></pre></div><ul><li><strong>pointData</strong>: 点位数据数组。</li><li><strong>options</strong>: 配置选项。</li><li><strong>返回值</strong>: 创建的向量图层，如果数据无效返回 <code>null</code>。</li></ul><h3 id="addclusterpoint" tabindex="-1">addClusterPoint <a class="header-anchor" href="#addclusterpoint" aria-label="Permalink to &quot;addClusterPoint&quot;">​</a></h3><p>添加聚合点图层。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addClusterPoint</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(pointData: PointData[], options: ClusterOptions): VectorLayer</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">VectorSource</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> null</span></span></code></pre></div><ul><li><strong>pointData</strong>: 点位数据数组。</li><li><strong>options</strong>: 聚合配置选项。</li><li><strong>返回值</strong>: 创建的聚合图层。</li></ul><h3 id="adddompoint" tabindex="-1">addDomPoint <a class="header-anchor" href="#adddompoint" aria-label="Permalink to &quot;addDomPoint&quot;">​</a></h3><p>添加 DOM 元素点（Overlay）。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addDomPoint</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(twinkleList: TwinkleItem[], callback</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Function): {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  anchors: Overlay[],</span></span>
+<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">  remove</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> void</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">  setVisible</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">visible</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> void</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><ul><li><strong>twinkleList</strong>: 包含经纬度和类名的数据列表。</li><li><strong>callback</strong>: 点击回调函数。</li><li><strong>返回值</strong>: 控制对象，包含 <code>remove</code> 和 <code>setVisible</code> 方法。</li></ul><h3 id="addpulsepointlayer" tabindex="-1">addPulsePointLayer <a class="header-anchor" href="#addpulsepointlayer" aria-label="Permalink to &quot;addPulsePointLayer&quot;">​</a></h3><p>添加高性能闪烁点图层。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addPulsePointLayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(pointData: PointData[], options: PulsePointOptions): PulsePointLayerHandle </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">|</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> null</span></span></code></pre></div><ul><li><strong>pointData</strong>: 点位数据数组。</li><li><strong>options</strong>: 闪烁点配置选项，复用 <code>addPoint</code> 的图标、文本和图层参数习惯。</li><li><strong>返回值</strong>: 控制对象，包含动画启停、显隐、数据更新和移除方法；如果数据无效返回 <code>null</code>。</li></ul><h3 id="addvuetemplatepoint" tabindex="-1">addVueTemplatePoint <a class="header-anchor" href="#addvuetemplatepoint" aria-label="Permalink to &quot;addVueTemplatePoint&quot;">​</a></h3><p>添加 Vue 组件作为点位。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addVueTemplatePoint</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(pointDataList: PointData[], template: any, options</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> VueTemplatePointOptions): {</span></span>
+<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">  setVisible</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">visible</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> void</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">  setOneVisibleByProp</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">propName</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">propValue</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> any</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">visible</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> void</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">  remove</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> void</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">  getPoints</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> VueTemplatePointInstance[]</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><ul><li><strong>pointDataList</strong>: 点位数据列表。</li><li><strong>template</strong>: Vue 组件。</li><li><strong>options</strong>: 配置选项。</li><li><strong>返回值</strong>: 控制对象，包含显示/隐藏和移除方法。</li></ul><h2 id="使用示例" tabindex="-1">使用示例 <a class="header-anchor" href="#使用示例" aria-label="Permalink to &quot;使用示例&quot;">​</a></h2><h3 id="添加普通点" tabindex="-1">添加普通点 <a class="header-anchor" href="#添加普通点" aria-label="Permalink to &quot;添加普通点&quot;">​</a></h3><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> { Point } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;my-openlayers&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
+<span class="line"></span>
+<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> point</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Point</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(map);</span></span>
+<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> data</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> [</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  { lgtd: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">116.40</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, lttd: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">39.90</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, name: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;北京&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> },</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  { lgtd: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">121.47</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, lttd: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">31.23</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, name: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;上海&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">];</span></span>
+<span class="line"></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">point.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addPoint</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(data, {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  layerName: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;cities&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  img: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;path/to/icon.png&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  textKey: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;name&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  scale: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">0.8</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre></div><h3 id="添加聚合点" tabindex="-1">添加聚合点 <a class="header-anchor" href="#添加聚合点" aria-label="Permalink to &quot;添加聚合点&quot;">​</a></h3><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">point.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addClusterPoint</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(data, {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  layerName: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;clusters&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  distance: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">40</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  img: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;path/to/cluster-icon.png&#39;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre></div><h3 id="添加高性能闪烁点" tabindex="-1">添加高性能闪烁点 <a class="header-anchor" href="#添加高性能闪烁点" aria-label="Permalink to &quot;添加高性能闪烁点&quot;">​</a></h3><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> pulseCtrl</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> point.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addPulsePointLayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(data, {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  layerName: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;village-warning-pulse&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  levelKey: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;lev&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  textKey: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;name&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  img: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;/icons/village.svg&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  scale: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">0.8</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  textVisible: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">true</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  pulse: {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    duration: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">2400</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    radius: [</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">8</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">28</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">],</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    colorMap: {</span></span>
+<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">      0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;rgba(255, 48, 54, 0.48)&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">      1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;rgba(255, 136, 0, 0.45)&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">      2</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;rgba(253, 216, 46, 0.4)&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">      3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;rgba(6, 183, 253, 0.32)&#39;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    }</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  }</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span>
+<span class="line"></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">pulseCtrl?.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">stop</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">();</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">pulseCtrl?.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">start</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">();</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">pulseCtrl?.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">updateData</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(data);</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">pulseCtrl?.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">remove</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">();</span></span></code></pre></div><h3 id="添加-vue-组件点" tabindex="-1">添加 Vue 组件点 <a class="header-anchor" href="#添加-vue-组件点" aria-label="Permalink to &quot;添加 Vue 组件点&quot;">​</a></h3><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> MyComponent </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;./MyComponent.vue&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
+<span class="line"></span>
+<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> ctrl</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> point.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addVueTemplatePoint</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(data, MyComponent, {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  positioning: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;bottom-center&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  props: { status: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;active&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span>
+<span class="line"></span>
+<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 隐藏所有点</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">ctrl.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">setVisible</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">false</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span></code></pre></div>`,51)]))}const E=s(l,[["render",n]]);export{g as __pageData,E as default};

package/docs/.vitepress/dist/assets/Point.md.Bi9juuuv.lean.js

@@ -0,0 +1 @@
+import{_ as s,c as i,ae as a,o as e}from"./chunks/framework.C_W0ODpn.js";const g=JSON.parse('{"title":"Point 类","description":"","frontmatter":{},"headers":[],"relativePath":"Point.md","filePath":"Point.md"}'),l={name:"Point.md"};function n(h,t,d,p,k,r){return e(),i("div",null,t[0]||(t[0]=[a("",51)]))}const E=s(l,[["render",n]]);export{g as __pageData,E as default};

package/docs/.vitepress/dist/assets/Polygon.md.-JIqEvzD.js

@@ -0,0 +1,78 @@
+import{_ as i,c as t,ae as a,o as e}from"./chunks/framework.C_W0ODpn.js";const o=JSON.parse('{"title":"Polygon 面要素类","description":"","frontmatter":{},"headers":[],"relativePath":"Polygon.md","filePath":"Polygon.md"}'),l={name:"Polygon.md"};function n(h,s,p,d,k,r){return e(),t("div",null,s[0]||(s[0]=[a(`<h1 id="polygon-面要素类" tabindex="-1">Polygon 面要素类 <a class="header-anchor" href="#polygon-面要素类" aria-label="Permalink to &quot;Polygon 面要素类&quot;">​</a></h1><p><code>Polygon</code> 类用于在地图上绘制面要素、热力图、图片图层和遮罩层，支持丰富的数据可视化功能。</p><h2 id="构造函数" tabindex="-1">构造函数 <a class="header-anchor" href="#构造函数" aria-label="Permalink to &quot;构造函数&quot;">​</a></h2><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> polygon</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Polygon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(map: Map);</span></span></code></pre></div><ul><li><strong>map</strong>: OpenLayers 地图实例。</li></ul><h2 id="接口定义" tabindex="-1">接口定义 <a class="header-anchor" href="#接口定义" aria-label="Permalink to &quot;接口定义&quot;">​</a></h2><h3 id="polygonoptions" tabindex="-1">PolygonOptions <a class="header-anchor" href="#polygonoptions" aria-label="Permalink to &quot;PolygonOptions&quot;">​</a></h3><p>面图层配置项，继承自 <code>BaseOptions</code>, <code>StyleOptions</code>, <code>TextOptions</code>。</p><table tabindex="0"><thead><tr><th style="text-align:left;">属性</th><th style="text-align:left;">类型</th><th style="text-align:left;">说明</th></tr></thead><tbody><tr><td style="text-align:left;"><strong>基础配置</strong></td><td style="text-align:left;"></td><td style="text-align:left;"></td></tr><tr><td style="text-align:left;"><code>layerName</code></td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">图层名称</td></tr><tr><td style="text-align:left;"><code>zIndex</code></td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">图层层级</td></tr><tr><td style="text-align:left;"><code>visible</code></td><td style="text-align:left;"><code>boolean</code></td><td style="text-align:left;">是否可见</td></tr><tr><td style="text-align:left;"><code>opacity</code></td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">透明度 (0-1)</td></tr><tr><td style="text-align:left;"><code>fitView</code></td><td style="text-align:left;"><code>boolean</code></td><td style="text-align:left;">是否自动缩放视图</td></tr><tr><td style="text-align:left;"><strong>样式配置</strong></td><td style="text-align:left;"></td><td style="text-align:left;"></td></tr><tr><td style="text-align:left;"><code>fillColor</code></td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">填充颜色</td></tr><tr><td style="text-align:left;"><code>fillColorCallBack</code></td><td style="text-align:left;"><code>(feature) =&gt; string</code></td><td style="text-align:left;">动态填充颜色回调</td></tr><tr><td style="text-align:left;"><code>strokeColor</code></td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">边框颜色</td></tr><tr><td style="text-align:left;"><code>strokeWidth</code></td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">边框宽度</td></tr><tr><td style="text-align:left;"><code>lineDash</code></td><td style="text-align:left;"><code>number[]</code></td><td style="text-align:left;">边框虚线样式</td></tr><tr><td style="text-align:left;"><strong>文本标注</strong></td><td style="text-align:left;"></td><td style="text-align:left;"></td></tr><tr><td style="text-align:left;"><code>textVisible</code></td><td style="text-align:left;"><code>boolean</code></td><td style="text-align:left;">是否显示文本</td></tr><tr><td style="text-align:left;"><code>textKey</code></td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">文本对应的属性字段名</td></tr><tr><td style="text-align:left;"><code>textCallBack</code></td><td style="text-align:left;"><code>(feature) =&gt; string</code></td><td style="text-align:left;">文本回调函数（优先级高于 textKey）</td></tr><tr><td style="text-align:left;"><code>textFont</code></td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">字体样式</td></tr><tr><td style="text-align:left;"><code>textFillColor</code></td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">文本颜色</td></tr><tr><td style="text-align:left;"><code>textStrokeColor</code></td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">文本描边颜色</td></tr><tr><td style="text-align:left;"><strong>其他</strong></td><td style="text-align:left;"></td><td style="text-align:left;"></td></tr><tr><td style="text-align:left;"><code>mask</code></td><td style="text-align:left;"><code>boolean</code></td><td style="text-align:left;">是否作为蒙版（配合 <code>setOutLayer</code> 使用）</td></tr></tbody></table><h3 id="heatmapoptions" tabindex="-1">HeatMapOptions <a class="header-anchor" href="#heatmapoptions" aria-label="Permalink to &quot;HeatMapOptions&quot;">​</a></h3><p>热力图配置项。</p><table tabindex="0"><thead><tr><th style="text-align:left;">属性</th><th style="text-align:left;">类型</th><th style="text-align:left;">说明</th></tr></thead><tbody><tr><td style="text-align:left;"><code>layerName</code></td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">图层名称</td></tr><tr><td style="text-align:left;"><code>radius</code></td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">热点半径，默认 8</td></tr><tr><td style="text-align:left;"><code>blur</code></td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">模糊度，默认 15</td></tr><tr><td style="text-align:left;"><code>gradient</code></td><td style="text-align:left;"><code>string[]</code></td><td style="text-align:left;">颜色渐变数组</td></tr><tr><td style="text-align:left;"><code>opacity</code></td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">透明度</td></tr><tr><td style="text-align:left;"><code>valueKey</code></td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">权重字段名，默认 &#39;value&#39;</td></tr></tbody></table><h3 id="imagelayerdata" tabindex="-1">ImageLayerData <a class="header-anchor" href="#imagelayerdata" aria-label="Permalink to &quot;ImageLayerData&quot;">​</a></h3><p>图片图层数据。</p><table tabindex="0"><thead><tr><th style="text-align:left;">属性</th><th style="text-align:left;">类型</th><th style="text-align:left;">说明</th></tr></thead><tbody><tr><td style="text-align:left;"><code>img</code></td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">图片 URL</td></tr><tr><td style="text-align:left;"><code>extent</code></td><td style="text-align:left;"><code>number[]</code></td><td style="text-align:left;">图片覆盖范围 <code>[minX, minY, maxX, maxY]</code></td></tr></tbody></table><h2 id="方法" tabindex="-1">方法 <a class="header-anchor" href="#方法" aria-label="Permalink to &quot;方法&quot;">​</a></h2><h3 id="addpolygon" tabindex="-1">addPolygon <a class="header-anchor" href="#addpolygon" aria-label="Permalink to &quot;addPolygon&quot;">​</a></h3><p>添加多边形图层。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addPolygon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(data: MapJSONData, options</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> PolygonOptions): VectorLayer</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">VectorSource</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span></code></pre></div><table tabindex="0"><thead><tr><th style="text-align:left;">参数</th><th style="text-align:left;">类型</th><th style="text-align:left;">说明</th></tr></thead><tbody><tr><td style="text-align:left;"><code>data</code></td><td style="text-align:left;"><code>MapJSONData</code></td><td style="text-align:left;">GeoJSON 数据</td></tr><tr><td style="text-align:left;"><code>options</code></td><td style="text-align:left;"><code>PolygonOptions</code></td><td style="text-align:left;">配置项</td></tr></tbody></table><h3 id="addpolygonbyurl" tabindex="-1">addPolygonByUrl <a class="header-anchor" href="#addpolygonbyurl" aria-label="Permalink to &quot;addPolygonByUrl&quot;">​</a></h3><p>从 URL 加载多边形图层。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addPolygonByUrl</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(url: string, options</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> PolygonOptions): VectorLayer</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">VectorSource</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span></code></pre></div><h3 id="addborderpolygon" tabindex="-1">addBorderPolygon <a class="header-anchor" href="#addborderpolygon" aria-label="Permalink to &quot;addBorderPolygon&quot;">​</a></h3><p>添加边界图层（通常用于行政区划边界，支持镂空效果）。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addBorderPolygon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(data: MapJSONData, options</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> PolygonOptions): VectorLayer</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">VectorSource</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span></code></pre></div><h3 id="updatefeaturecolor" tabindex="-1">updateFeatureColor <a class="header-anchor" href="#updatefeaturecolor" aria-label="Permalink to &quot;updateFeatureColor&quot;">​</a></h3><p>动态更新面要素颜色，常用于数据可视化展示。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">updateFeatureColor</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  layerName: string, </span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  colorObj</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> { [propName: string]: string }, </span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  options</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> FeatureColorUpdateOptions</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">): </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">void</span></span></code></pre></div><table tabindex="0"><thead><tr><th style="text-align:left;">参数</th><th style="text-align:left;">类型</th><th style="text-align:left;">说明</th></tr></thead><tbody><tr><td style="text-align:left;"><code>layerName</code></td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">目标图层名称</td></tr><tr><td style="text-align:left;"><code>colorObj</code></td><td style="text-align:left;"><code>Object</code></td><td style="text-align:left;">颜色映射对象 <code>{ &#39;区域名&#39;: &#39;颜色值&#39; }</code></td></tr><tr><td style="text-align:left;"><code>options</code></td><td style="text-align:left;"><code>FeatureColorUpdateOptions</code></td><td style="text-align:left;">包含 textKey 等配置以匹配要素</td></tr></tbody></table><h3 id="addimagelayer" tabindex="-1">addImageLayer <a class="header-anchor" href="#addimagelayer" aria-label="Permalink to &quot;addImageLayer&quot;">​</a></h3><p>添加静态图片图层（如叠加平面图、卫星图）。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addImageLayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(imageData: ImageLayerData, options</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> PolygonOptions): ImageLayer</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">any</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span></code></pre></div><h3 id="addheatmap" tabindex="-1">addHeatmap <a class="header-anchor" href="#addheatmap" aria-label="Permalink to &quot;addHeatmap&quot;">​</a></h3><p>添加热力图。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addHeatmap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(pointData: PointData[], options</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> HeatMapOptions): Heatmap</span></span></code></pre></div><h3 id="setoutlayer" tabindex="-1">setOutLayer <a class="header-anchor" href="#setoutlayer" aria-label="Permalink to &quot;setOutLayer&quot;">​</a></h3><p>添加遮罩图层（反向裁剪，只高亮指定区域，遮挡外部）。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">setOutLayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(data: MapJSONData, options</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  layerName?: string,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  extent?: any,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  fillColor?: string,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  strokeWidth?: number,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  strokeColor?: string,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  zIndex?: number</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}): VectorLayer</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">VectorSource</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span></code></pre></div><h2 id="使用示例" tabindex="-1">使用示例 <a class="header-anchor" href="#使用示例" aria-label="Permalink to &quot;使用示例&quot;">​</a></h2><h3 id="基础多边形" tabindex="-1">基础多边形 <a class="header-anchor" href="#基础多边形" aria-label="Permalink to &quot;基础多边形&quot;">​</a></h3><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> polygonModule</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> map.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">getPolygon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">();</span></span>
+<span class="line"></span>
+<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// GeoJSON 数据</span></span>
+<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> polygonData</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  type: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;FeatureCollection&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  features: [</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">      type: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;Feature&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">      geometry: {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        type: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;Polygon&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">        coordinates: [[[</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">120</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">30</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">], [</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">121</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">30</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">], [</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">121</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">31</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">], [</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">120</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">31</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">], [</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">120</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">30</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">]]]</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">      },</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">      properties: { name: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;区域A&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, value: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">100</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    }</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  ]</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">};</span></span>
+<span class="line"></span>
+<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 添加半透明蓝色填充、蓝色边框的多边形</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">polygonModule.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addPolygon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(polygonData, {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  layerName: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;area-layer&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  fillColor: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;rgba(0, 0, 255, 0.1)&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  strokeColor: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;blue&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  strokeWidth: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">2</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  textKey: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;name&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 显示名称</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  textFillColor: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;#fff&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  textStrokeColor: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;blue&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  textStrokeWidth: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">2</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  fitView: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">true</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre></div><h3 id="数据可视化-动态填色" tabindex="-1">数据可视化（动态填色） <a class="header-anchor" href="#数据可视化-动态填色" aria-label="Permalink to &quot;数据可视化（动态填色）&quot;">​</a></h3><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 假设 &#39;area-layer&#39; 中的要素有 &#39;name&#39; 属性</span></span>
+<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 我们将 &#39;区域A&#39; 设为红色，其他区域保持默认或设为其他颜色</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">polygonModule.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">updateFeatureColor</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span></span>
+<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">  &#39;area-layer&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  {</span></span>
+<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">    &#39;区域A&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;rgba(255, 0, 0, 0.5)&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">    &#39;区域B&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;rgba(0, 255, 0, 0.5)&#39;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  },</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  { </span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    textKey: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;name&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 匹配 colorObj 的键</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    strokeColor: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;#666&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 统一更新边框颜色</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    strokeWidth: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">1</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  }</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span></code></pre></div><h3 id="热力图" tabindex="-1">热力图 <a class="header-anchor" href="#热力图" aria-label="Permalink to &quot;热力图&quot;">​</a></h3><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> heatPoints</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> [</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  { lgtd: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">119.8</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, lttd: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">29.9</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, value: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">100</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> },</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  { lgtd: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">119.9</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, lttd: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">30.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, value: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">50</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> },</span></span>
+<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">  // ... 更多点</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">];</span></span>
+<span class="line"></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">polygonModule.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addHeatmap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(heatPoints, {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  layerName: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;heatmap-layer&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  radius: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">20</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,       </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 热点半径</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  blur: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">15</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,         </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 边缘模糊</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  valueKey: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;value&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 权重字段</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  gradient: [</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;#00f&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;#0ff&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;#0f0&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;#ff0&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;#f00&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">] </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 自定义渐变色</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre></div><h3 id="图片图层" tabindex="-1">图片图层 <a class="header-anchor" href="#图片图层" aria-label="Permalink to &quot;图片图层&quot;">​</a></h3><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 将图片叠加到指定经纬度范围</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">polygonModule.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addImageLayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  img: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;https://example.com/plan.png&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  extent: [</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">120.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">30.0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">120.1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">30.1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">] </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// [minX, minY, maxX, maxY]</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}, {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  layerName: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;image-overlay&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  opacity: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">0.8</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre></div><h3 id="遮罩层-反向裁剪" tabindex="-1">遮罩层（反向裁剪） <a class="header-anchor" href="#遮罩层-反向裁剪" aria-label="Permalink to &quot;遮罩层（反向裁剪）&quot;">​</a></h3><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 添加遮罩，除了 polygonData 覆盖的区域外，其他区域都会被遮挡</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">polygonModule.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">setOutLayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(polygonData, {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  layerName: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;mask-layer&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  fillColor: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;rgba(0, 0, 0, 0.5)&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 黑色半透明遮罩</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  strokeColor: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;#fff&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  strokeWidth: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">2</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre></div>`,50)]))}const g=i(l,[["render",n]]);export{o as __pageData,g as default};

package/docs/.vitepress/dist/assets/Polygon.md.-JIqEvzD.lean.js

@@ -0,0 +1 @@
+import{_ as i,c as t,ae as a,o as e}from"./chunks/framework.C_W0ODpn.js";const o=JSON.parse('{"title":"Polygon 面要素类","description":"","frontmatter":{},"headers":[],"relativePath":"Polygon.md","filePath":"Polygon.md"}'),l={name:"Polygon.md"};function n(h,s,p,d,k,r){return e(),t("div",null,s[0]||(s[0]=[a("",50)]))}const g=i(l,[["render",n]]);export{o as __pageData,g as default};

package/docs/.vitepress/dist/assets/RiverLayerManager.md.CfUu2RxH.js

@@ -0,0 +1,42 @@
+import{_ as i,c as a,ae as e,o as t}from"./chunks/framework.C_W0ODpn.js";const y=JSON.parse('{"title":"RiverLayerManager 河流图层管理类","description":"","frontmatter":{},"headers":[],"relativePath":"RiverLayerManager.md","filePath":"RiverLayerManager.md"}'),l={name:"RiverLayerManager.md"};function n(h,s,p,r,d,k){return t(),a("div",null,s[0]||(s[0]=[e(`<h1 id="riverlayermanager-河流图层管理类" tabindex="-1">RiverLayerManager 河流图层管理类 <a class="header-anchor" href="#riverlayermanager-河流图层管理类" aria-label="Permalink to &quot;RiverLayerManager 河流图层管理类&quot;">​</a></h1><p><code>RiverLayerManager</code> 专门用于处理河流数据的分级显示和样式管理。它支持基于地图缩放级别（Zoom-based）的动态分级显示，以及基于河流属性等级（Level-based）的固定线宽渲染。</p><h2 id="构造函数" tabindex="-1">构造函数 <a class="header-anchor" href="#构造函数" aria-label="Permalink to &quot;构造函数&quot;">​</a></h2><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">constructor</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(map: Map, eventManager</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> EventManager)</span></span></code></pre></div><ul><li><strong>参数</strong>: <ul><li><code>map</code> (Map): OpenLayers 地图实例。</li><li><code>eventManager</code> (EventManager): 可选。事件管理器实例，如果未提供则内部创建。</li></ul></li></ul><h2 id="接口定义" tabindex="-1">接口定义 <a class="header-anchor" href="#接口定义" aria-label="Permalink to &quot;接口定义&quot;">​</a></h2><h3 id="riverlayeroptions" tabindex="-1">RiverLayerOptions <a class="header-anchor" href="#riverlayeroptions" aria-label="Permalink to &quot;RiverLayerOptions&quot;">​</a></h3><p>河流图层配置选项，继承自 <code>LineOptions</code>。</p><table tabindex="0"><thead><tr><th style="text-align:left;">属性</th><th style="text-align:left;">类型</th><th style="text-align:left;">必填</th><th style="text-align:left;">默认值</th><th style="text-align:left;">描述</th></tr></thead><tbody><tr><td style="text-align:left;">levelCount</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">否</td><td style="text-align:left;"><code>5</code></td><td style="text-align:left;">河流等级总数。用于分级显示循环加载。</td></tr><tr><td style="text-align:left;">zoomOffset</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">否</td><td style="text-align:left;"><code>8</code></td><td style="text-align:left;">缩放级别偏移量。控制何时显示哪一级河流 (Zoom &gt; Level + Offset)。</td></tr><tr><td style="text-align:left;">levelWidthMap</td><td style="text-align:left;"><code>RiverLevelWidthMap</code></td><td style="text-align:left;">否</td><td style="text-align:left;">默认映射</td><td style="text-align:left;">河流级别与线宽的映射对象。</td></tr><tr><td style="text-align:left;">removeExisting</td><td style="text-align:left;"><code>boolean</code></td><td style="text-align:left;">否</td><td style="text-align:left;"><code>false</code></td><td style="text-align:left;">添加前是否删除由本管理器创建的旧图层。</td></tr><tr><td style="text-align:left;">layerName</td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">否</td><td style="text-align:left;">-</td><td style="text-align:left;">图层名称，用于标识和清理。</td></tr><tr><td style="text-align:left;">visible</td><td style="text-align:left;"><code>boolean</code></td><td style="text-align:left;">否</td><td style="text-align:left;"><code>true</code></td><td style="text-align:left;">初始可见性。</td></tr><tr><td style="text-align:left;">strokeColor</td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">否</td><td style="text-align:left;">-</td><td style="text-align:left;">线条颜色。</td></tr><tr><td style="text-align:left;">strokeWidth</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">否</td><td style="text-align:left;">-</td><td style="text-align:left;">基础线宽（如果未使用 levelWidthMap）。</td></tr><tr><td style="text-align:left;">zIndex</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">否</td><td style="text-align:left;">-</td><td style="text-align:left;">图层 Z-Index。</td></tr><tr><td style="text-align:left;">projectionOptOptions</td><td style="text-align:left;"><code>any</code></td><td style="text-align:left;">否</td><td style="text-align:left;">-</td><td style="text-align:left;">GeoJSON 读取时的投影选项。</td></tr></tbody></table><h3 id="riverlevelwidthmap" tabindex="-1">RiverLevelWidthMap <a class="header-anchor" href="#riverlevelwidthmap" aria-label="Permalink to &quot;RiverLevelWidthMap&quot;">​</a></h3><p>河流级别线宽映射接口。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> RiverLevelWidthMap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  [</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">level</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">]</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><p>默认映射 (<code>ConfigManager.DEFAULT_RIVER_LEVEL_WIDTH_MAP</code>) 通常为 <code>{1: 5, 2: 4, 3: 3, 4: 2, 5: 1}</code> 等类似结构。</p><h2 id="方法" tabindex="-1">方法 <a class="header-anchor" href="#方法" aria-label="Permalink to &quot;方法&quot;">​</a></h2><h3 id="分级显示-zoom-based" tabindex="-1">分级显示 (Zoom-based) <a class="header-anchor" href="#分级显示-zoom-based" aria-label="Permalink to &quot;分级显示 (Zoom-based)&quot;">​</a></h3><p>根据地图缩放级别自动显示不同等级的河流。通常用于实现“缩放越大约详细”的效果。</p><h4 id="addriverlayersbyzoom" tabindex="-1">addRiverLayersByZoom <a class="header-anchor" href="#addriverlayersbyzoom" aria-label="Permalink to &quot;addRiverLayersByZoom&quot;">​</a></h4><p>直接传递 GeoJSON 数据添加分级河流图层。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addRiverLayersByZoom</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(fyRiverJson: MapJSONData, options</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> RiverLayerOptions): </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">void</span></span></code></pre></div><ul><li><strong>参数</strong>: <ul><li><code>fyRiverJson</code>: 河流 GeoJSON 数据对象。</li><li><code>options</code>: 配置选项。</li></ul></li></ul><h4 id="addriverlayersbyzoombyurl" tabindex="-1">addRiverLayersByZoomByUrl <a class="header-anchor" href="#addriverlayersbyzoombyurl" aria-label="Permalink to &quot;addRiverLayersByZoomByUrl&quot;">​</a></h4><p>通过 URL 加载 GeoJSON 数据并添加分级河流图层。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addRiverLayersByZoomByUrl</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(url: string, options</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> RiverLayerOptions): </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">void</span></span></code></pre></div><h4 id="showriverlayer" tabindex="-1">showRiverLayer <a class="header-anchor" href="#showriverlayer" aria-label="Permalink to &quot;showRiverLayer&quot;">​</a></h4><p>控制分级河流图层的总开关。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">showRiverLayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(show: boolean): </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">void</span></span></code></pre></div><h4 id="showriverlayerbyzoom" tabindex="-1">showRiverLayerByZoom <a class="header-anchor" href="#showriverlayerbyzoom" aria-label="Permalink to &quot;showRiverLayerByZoom&quot;">​</a></h4><p>手动触发根据当前缩放级别更新图层可见性（通常不需要手动调用，已绑定 <code>moveend</code> 事件）。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">showRiverLayerByZoom</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(): </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">void</span></span></code></pre></div><h3 id="宽度分级-level-based-width" tabindex="-1">宽度分级 (Level-based Width) <a class="header-anchor" href="#宽度分级-level-based-width" aria-label="Permalink to &quot;宽度分级 (Level-based Width)&quot;">​</a></h3><p>根据河流数据中的 <code>level</code> 属性渲染不同宽度的线条，通常用于静态展示不同等级河流的粗细差异。</p><h4 id="addriverwidthbylevel" tabindex="-1">addRiverWidthByLevel <a class="header-anchor" href="#addriverwidthbylevel" aria-label="Permalink to &quot;addRiverWidthByLevel&quot;">​</a></h4><p>直接传递 GeoJSON 数据添加按等级设定宽度的河流。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addRiverWidthByLevel</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(data: MapJSONData, options</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> RiverLayerOptions): VectorLayer</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">VectorSource</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span></code></pre></div><ul><li><strong>返回值</strong>: 创建的矢量图层。</li></ul><h4 id="addriverwidthbylevelbyurl" tabindex="-1">addRiverWidthByLevelByUrl <a class="header-anchor" href="#addriverwidthbylevelbyurl" aria-label="Permalink to &quot;addRiverWidthByLevelByUrl&quot;">​</a></h4><p>通过 URL 加载 GeoJSON 数据并添加按等级设定宽度的河流。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addRiverWidthByLevelByUrl</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(url: string, options</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> RiverLayerOptions): VectorLayer</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">VectorSource</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span></span></code></pre></div><h3 id="管理与清理" tabindex="-1">管理与清理 <a class="header-anchor" href="#管理与清理" aria-label="Permalink to &quot;管理与清理&quot;">​</a></h3><h4 id="clearriverlayers" tabindex="-1">clearRiverLayers <a class="header-anchor" href="#clearriverlayers" aria-label="Permalink to &quot;clearRiverLayers&quot;">​</a></h4><p>清除所有由该管理器创建的分级河流图层。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">clearRiverLayers</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(): </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">void</span></span></code></pre></div><h4 id="getriverlayervisibility" tabindex="-1">getRiverLayerVisibility <a class="header-anchor" href="#getriverlayervisibility" aria-label="Permalink to &quot;getRiverLayerVisibility&quot;">​</a></h4><p>获取当前分级河流图层的总显示状态。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">getRiverLayerVisibility</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(): boolean</span></span></code></pre></div><h4 id="getriverlayers" tabindex="-1">getRiverLayers <a class="header-anchor" href="#getriverlayers" aria-label="Permalink to &quot;getRiverLayers&quot;">​</a></h4><p>获取当前管理的所有分级河流图层列表。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">getRiverLayers</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(): VectorLayer</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&lt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">VectorSource</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">&gt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">[]</span></span></code></pre></div><h4 id="destroy" tabindex="-1">destroy <a class="header-anchor" href="#destroy" aria-label="Permalink to &quot;destroy&quot;">​</a></h4><p>销毁管理器，清理所有图层和事件监听。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">destroy</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(): </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">void</span></span></code></pre></div><h2 id="使用示例" tabindex="-1">使用示例 <a class="header-anchor" href="#使用示例" aria-label="Permalink to &quot;使用示例&quot;">​</a></h2><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> { MyOl, RiverLayerManager } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;my-openlayer&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
+<span class="line"></span>
+<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> map</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MyOl</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;map-container&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
+<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> riverManager</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> RiverLayerManager</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(map.map);</span></span>
+<span class="line"></span>
+<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 假设 riverGeoJSON 数据中每个 feature 都有 properties.level (1-5)</span></span>
+<span class="line"></span>
+<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 示例 1: 添加分级河流（随地图缩放自动显隐不同级别的河流）</span></span>
+<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// Level 1 在 Zoom &gt; 9 (1+8) 显示</span></span>
+<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// Level 2 在 Zoom &gt; 10 (2+8) 显示</span></span>
+<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// ...</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">riverManager.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addRiverLayersByZoom</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(riverGeoJSON, {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  layerName: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;dynamic-river&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  levelCount: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">5</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  zoomOffset: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">8</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  strokeColor: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;#0071FF&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  strokeWidth: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">2</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  removeExisting: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">true</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span>
+<span class="line"></span>
+<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 控制分级河流的总开关</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">riverManager.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">showRiverLayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">false</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">); </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 全部隐藏</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">riverManager.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">showRiverLayer</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">true</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);  </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 恢复并根据当前 Zoom 显示对应级别</span></span>
+<span class="line"></span>
+<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 示例 2: 添加静态河流，根据等级显示不同粗细</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">riverManager.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">addRiverWidthByLevel</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(riverGeoJSON, {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  layerName: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;static-river&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  strokeColor: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;#0071FF&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  levelWidthMap: {</span></span>
+<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">    1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">6</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 1级河流宽 6px</span></span>
+<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">    2</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">5</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">    3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">4</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">    4</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">3</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">    5</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">1</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  },</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  zIndex: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">10</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span>
+<span class="line"></span>
+<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 清理资源</span></span>
+<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// riverManager.destroy();</span></span></code></pre></div>`,53)]))}const g=i(l,[["render",n]]);export{y as __pageData,g as default};

package/docs/.vitepress/dist/assets/RiverLayerManager.md.CfUu2RxH.lean.js

@@ -0,0 +1 @@
+import{_ as i,c as a,ae as e,o as t}from"./chunks/framework.C_W0ODpn.js";const y=JSON.parse('{"title":"RiverLayerManager 河流图层管理类","description":"","frontmatter":{},"headers":[],"relativePath":"RiverLayerManager.md","filePath":"RiverLayerManager.md"}'),l={name:"RiverLayerManager.md"};function n(h,s,p,r,d,k){return t(),a("div",null,s[0]||(s[0]=[e("",53)]))}const g=i(l,[["render",n]]);export{y as __pageData,g as default};

package/docs/.vitepress/dist/assets/SelectHandler.md.COR4ez_p.js

@@ -0,0 +1,22 @@
+import{_ as t,c as i,ae as e,o as a}from"./chunks/framework.C_W0ODpn.js";const o=JSON.parse('{"title":"SelectHandler 类","description":"","frontmatter":{},"headers":[],"relativePath":"SelectHandler.md","filePath":"SelectHandler.md"}'),l={name:"SelectHandler.md"};function n(h,s,p,d,r,k){return a(),i("div",null,s[0]||(s[0]=[e(`<h1 id="selecthandler-类" tabindex="-1">SelectHandler 类 <a class="header-anchor" href="#selecthandler-类" aria-label="Permalink to &quot;SelectHandler 类&quot;">​</a></h1><p><code>SelectHandler</code> 类用于处理地图上的要素选择交互，支持点击、悬停、Ctrl+点击等多种模式，并支持编程式选择。</p><h2 id="构造函数" tabindex="-1">构造函数 <a class="header-anchor" href="#构造函数" aria-label="Permalink to &quot;构造函数&quot;">​</a></h2><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">constructor</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(map: Map)</span></span></code></pre></div><ul><li><strong>map</strong>: OpenLayers 地图实例。</li></ul><h2 id="接口定义" tabindex="-1">接口定义 <a class="header-anchor" href="#接口定义" aria-label="Permalink to &quot;接口定义&quot;">​</a></h2><h3 id="selectoptions" tabindex="-1">SelectOptions <a class="header-anchor" href="#selectoptions" aria-label="Permalink to &quot;SelectOptions&quot;">​</a></h3><table tabindex="0"><thead><tr><th style="text-align:left;">属性名</th><th style="text-align:left;">类型</th><th style="text-align:left;">说明</th></tr></thead><tbody><tr><td style="text-align:left;">multi</td><td style="text-align:left;"><code>boolean</code></td><td style="text-align:left;">是否支持多选，默认 <code>false</code></td></tr><tr><td style="text-align:left;">layerFilter</td><td style="text-align:left;"><code>string[]</code></td><td style="text-align:left;">图层过滤器，指定可选择的图层名称列表</td></tr><tr><td style="text-align:left;">featureFilter</td><td style="text-align:left;"><code>(feature: FeatureLike) =&gt; boolean</code></td><td style="text-align:left;">要素过滤器函数</td></tr><tr><td style="text-align:left;">hitTolerance</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">点击容差（像素），默认为 0</td></tr><tr><td style="text-align:left;">selectStyle</td><td style="text-align:left;"><code>Style | Style[] | ((feature: FeatureLike) =&gt; Style | Style[])</code></td><td style="text-align:left;">选中要素的样式</td></tr><tr><td style="text-align:left;">onSelect</td><td style="text-align:left;"><code>(event: SelectCallbackEvent) =&gt; void</code></td><td style="text-align:left;">选中要素时的回调函数</td></tr><tr><td style="text-align:left;">onDeselect</td><td style="text-align:left;"><code>(event: SelectCallbackEvent) =&gt; void</code></td><td style="text-align:left;">取消选中要素时的回调函数</td></tr></tbody></table><h3 id="programmaticselectoptions" tabindex="-1">ProgrammaticSelectOptions <a class="header-anchor" href="#programmaticselectoptions" aria-label="Permalink to &quot;ProgrammaticSelectOptions&quot;">​</a></h3><table tabindex="0"><thead><tr><th style="text-align:left;">属性名</th><th style="text-align:left;">类型</th><th style="text-align:left;">说明</th></tr></thead><tbody><tr><td style="text-align:left;">layerName</td><td style="text-align:left;"><code>string</code></td><td style="text-align:left;">图层名称，指定在哪个图层中选择要素</td></tr><tr><td style="text-align:left;">selectStyle</td><td style="text-align:left;"><code>Style | Style[] | ((feature: FeatureLike) =&gt; Style | Style[])</code></td><td style="text-align:left;">自定义选中样式（仅作用于此次选择）</td></tr><tr><td style="text-align:left;">fitView</td><td style="text-align:left;"><code>boolean</code></td><td style="text-align:left;">是否定位至选中要素，默认 <code>false</code></td></tr><tr><td style="text-align:left;">fitDuration</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">定位动画持续时间（毫秒），默认 500</td></tr><tr><td style="text-align:left;">fitPadding</td><td style="text-align:left;"><code>number</code></td><td style="text-align:left;">定位时的边距（像素），默认 100</td></tr></tbody></table><h3 id="selectmode" tabindex="-1">SelectMode <a class="header-anchor" href="#selectmode" aria-label="Permalink to &quot;SelectMode&quot;">​</a></h3><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">type</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> SelectMode</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;click&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;hover&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;ctrl&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span></code></pre></div><h2 id="方法" tabindex="-1">方法 <a class="header-anchor" href="#方法" aria-label="Permalink to &quot;方法&quot;">​</a></h2><h3 id="enableselect" tabindex="-1">enableSelect <a class="header-anchor" href="#enableselect" aria-label="Permalink to &quot;enableSelect&quot;">​</a></h3><p>启用要素选择。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">enableSelect</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(mode: SelectMode </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;click&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, options</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> SelectOptions): </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">this</span></span></code></pre></div><ul><li><strong>mode</strong>: 选择模式。</li><li><strong>options</strong>: 配置选项。</li><li><strong>返回值</strong>: <code>SelectHandler</code> 实例，支持链式调用。</li></ul><h3 id="disableselect" tabindex="-1">disableSelect <a class="header-anchor" href="#disableselect" aria-label="Permalink to &quot;disableSelect&quot;">​</a></h3><p>禁用要素选择。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">disableSelect</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(): </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">this</span></span></code></pre></div><ul><li><strong>返回值</strong>: <code>SelectHandler</code> 实例。</li></ul><h3 id="clearselection" tabindex="-1">clearSelection <a class="header-anchor" href="#clearselection" aria-label="Permalink to &quot;clearSelection&quot;">​</a></h3><p>清除所有选择（包括交互式和编程式）。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">clearSelection</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(): </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">this</span></span></code></pre></div><ul><li><strong>返回值</strong>: <code>SelectHandler</code> 实例。</li></ul><h3 id="selectbyids" tabindex="-1">selectByIds <a class="header-anchor" href="#selectbyids" aria-label="Permalink to &quot;selectByIds&quot;">​</a></h3><p>通过要素 ID 编程式选择要素。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">selectByIds</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(featureIds: string[], options</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> ProgrammaticSelectOptions): </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">this</span></span></code></pre></div><ul><li><strong>featureIds</strong>: 要素 ID 数组。</li><li><strong>options</strong>: 编程式选择选项。</li><li><strong>返回值</strong>: <code>SelectHandler</code> 实例。</li></ul><h3 id="selectbyproperty" tabindex="-1">selectByProperty <a class="header-anchor" href="#selectbyproperty" aria-label="Permalink to &quot;selectByProperty&quot;">​</a></h3><p>通过属性编程式选择要素。</p><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">selectByProperty</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(propertyName: string, propertyValue: any, options</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> ProgrammaticSelectOptions): </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">this</span></span></code></pre></div><ul><li><strong>propertyName</strong>: 属性名。</li><li><strong>propertyValue</strong>: 属性值。</li><li><strong>options</strong>: 编程式选择选项。</li><li><strong>返回值</strong>: <code>SelectHandler</code> 实例。</li></ul><h2 id="使用示例" tabindex="-1">使用示例 <a class="header-anchor" href="#使用示例" aria-label="Permalink to &quot;使用示例&quot;">​</a></h2><h3 id="启用点击选择" tabindex="-1">启用点击选择 <a class="header-anchor" href="#启用点击选择" aria-label="Permalink to &quot;启用点击选择&quot;">​</a></h3><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> { SelectHandler } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;my-openlayers&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
+<span class="line"></span>
+<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> selectHandler</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> SelectHandler</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(map);</span></span>
+<span class="line"></span>
+<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 启用点击选择，仅针对 &#39;cities&#39; 图层</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">selectHandler.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">enableSelect</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;click&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  layerFilter: [</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;cities&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">],</span></span>
+<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">  onSelect</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">event</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;Selected:&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, event.selected);</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  },</span></span>
+<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">  onDeselect</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">event</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;Deselected:&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, event.deselected);</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  }</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre></div><h3 id="启用悬停高亮" tabindex="-1">启用悬停高亮 <a class="header-anchor" href="#启用悬停高亮" aria-label="Permalink to &quot;启用悬停高亮&quot;">​</a></h3><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">selectHandler.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">enableSelect</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;hover&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  selectStyle: </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    stroke: </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Stroke</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({ color: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;yellow&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, width: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">4</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> })</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  })</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre></div><h3 id="编程式选择并定位" tabindex="-1">编程式选择并定位 <a class="header-anchor" href="#编程式选择并定位" aria-label="Permalink to &quot;编程式选择并定位&quot;">​</a></h3><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">// 选择 ID 为 &#39;beijing&#39; 的要素并自动定位</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">selectHandler.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">selectByIds</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">([</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;beijing&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">], {</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  fitView: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">true</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  fitPadding: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">50</span></span>
+<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre></div><h3 id="清除选择" tabindex="-1">清除选择 <a class="header-anchor" href="#清除选择" aria-label="Permalink to &quot;清除选择&quot;">​</a></h3><div class="language-typescript vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">typescript</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">selectHandler.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">clearSelection</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">();</span></span></code></pre></div>`,42)]))}const g=t(l,[["render",n]]);export{o as __pageData,g as default};

package/docs/.vitepress/dist/assets/SelectHandler.md.COR4ez_p.lean.js

@@ -0,0 +1 @@
+import{_ as t,c as i,ae as e,o as a}from"./chunks/framework.C_W0ODpn.js";const o=JSON.parse('{"title":"SelectHandler 类","description":"","frontmatter":{},"headers":[],"relativePath":"SelectHandler.md","filePath":"SelectHandler.md"}'),l={name:"SelectHandler.md"};function n(h,s,p,d,r,k){return a(),i("div",null,s[0]||(s[0]=[e("",42)]))}const g=t(l,[["render",n]]);export{o as __pageData,g as default};