UNPKG

@mapgis/webclient-common

Version:

mapgis ES6 format for igserver

1,658 lines (548 loc) 25.6 kB
<header id="page-title" class="page-title"> <span class="page-title-main">类名</span> <span class="page-title-sub">SimpleLineSymbol</span> </header> <section> <article> <div class="container-overview"> <div class='vertical-section'> <div class="members"> <div class="member"> <h4 class="name" id="SimpleLineSymbol"> <a class="href-link" href="#SimpleLineSymbol">#</a> <span class="code-name" id="SimpleLineSymbol" style="font-size:30px"> new SimpleLineSymbol<span class="signature">(options)</span> </span> </h4> <div class="description"> <p>简单线符号,支持线几何对象,参考示例:<a href='#new-SimpleLineSymbol'>[线符号样式]</a> <br><br>[ES5引入方式]:<br/> Zondy.Symbol.SimpleLineSymbol() <br/> [ES6引入方式]:<br/> import { SimpleLineSymbol } from &quot;@mapgis/webclient-common&quot; <br/> <br/></p> </div> <h4>参数</h4> <div class="table-container"> <table class="params table"> <thead> <tr> <th>名称</th> <th>类型</th> <th style="min-width: 100px;">默认值</th> <th class="last">描述</th> </tr> </thead> <tbody> <tr class="deep-level-0"> <td class="name" id="options"><code>options</code></td> <td class="type"> <span class="param-type">Object</span> </td> <td class="default"> </td> <td class="description last"><p>线符号样式</p></td> </tr> <tr class="deep-level-1"> <td class="name" id="width"><code>width</code></td> <td class="type"> <span class="param-type">Number</span> </td> <td class="default"> 1 </td> <td class="description last"><p>线符号宽度,默认为1</p></td> </tr> <tr class="deep-level-1"> <td class="name" id="color"><code>color</code></td> <td class="type"> <span class="param-type"><a link="Color.html" onclick="getTypeHTML(event)" class="mapgis-link-name" title="Color" Color.html>Color</a></span> | <span class="param-type">String</span> </td> <td class="default"> new Color(255, 0, 0, 1) </td> <td class="description last"><p>线符号颜色,默认为红色</p></td> </tr> <tr class="deep-level-1"> <td class="name" id="cap"><code>cap</code></td> <td class="type"> <span class="param-type">String</span> </td> <td class="default"> 'round' </td> <td class="description last"><p>线的起点和终点样式,可选参数 &quot;butt&quot;|&quot;round&quot;|&quot;square&quot; butt:线的首尾为直角,round:线的首尾为圆形,square:线的首尾会超出一部分,且为矩形</p></td> </tr> <tr class="deep-level-1"> <td class="name" id="join"><code>join</code></td> <td class="type"> <span class="param-type">String</span> </td> <td class="default"> 'round' </td> <td class="description last"><p>线的拐角样式,可选参数 &quot;miter&quot;|&quot;round&quot;|&quot;bevel&quot;, miter:线的拐角为直角,round:线的拐角为圆角,bevel:线的拐角为斜角</p></td> </tr> <tr class="deep-level-1"> <td class="name" id="miterLimit"><code>miterLimit</code></td> <td class="type"> <span class="param-type">Number</span> </td> <td class="default"> 2 </td> <td class="description last"><p>斜接的宽度与线宽的最大允许比率,防止转角过小问题</p></td> </tr> <tr class="deep-level-1"> <td class="name" id="style"><code>style</code></td> <td class="type"> <span class="param-type">String</span> </td> <td class="default"> 'solid' </td> <td class="description last"><p>线样式,默认'solid',可选&quot;dash&quot;|&quot;dash-dot&quot;|&quot;dot&quot;|&quot;long-dash&quot;|&quot;long-dash-dot&quot;|&quot;long-dash-dot-dot&quot;|&quot;none&quot;|&quot;short-dash&quot;|&quot;short-dash-dot&quot;|&quot;short-dash-dot-dot&quot;|&quot;short-dot&quot;|&quot;solid&quot;</p></td> </tr> <tr class="deep-level-1"> <td class="name" id="marker"><code>marker</code></td> <td class="type"> <span class="param-type"><a link="LineSymbolMarker.html" onclick="getTypeHTML(event)" class="mapgis-link-name" title="LineSymbolMarker" LineSymbolMarker.html>LineSymbolMarker</a></span> </td> <td class="default"> </td> <td class="description last"><p>线端点样式</p></td> </tr> </tbody> </table> </div> <dl class="details"> </dl> <p class="summary"><h5>支持如下方法:</h5> <a class="mapgis-link-name" title="Symbol#clone" Symbol.html#clone><code>1、克隆并返回新的符号对象</code></a> <br/> <a class="mapgis-link-name" title="Symbol#toJSON" Symbol.html#toJSON><code>2、导出一个JSON对像</code></a> <br/> <a href='#fromJSON'>[3、通过json构造并返回一个新的SimpleLineSymbol对象]</a></p> <h5>示例</h5> <p class="code-caption"><h7 id='new-SimpleLineSymbol'>创建线符号样式对象</h7></p> <pre class="prettyprint"><code>// ES5引入方式 const { SimpleLineSymbol } = Zondy.Symbol const { Color } = Zondy // ES6引入方式 import { SimpleLineSymbol, Color } from "@mapgis/webclient-common" const simpleLineSymbol = new SimpleLineSymbol({ // 线符号颜色 color: new Color(255, 0, 0, 1), // 线符号宽度 width: 2, // 线首尾角样式 cap: "round", // 线接角样式 join: "round", // 斜接的宽度与线宽的最大允许比率 miterLimit: 2, // 线样式 style: "solid" });</code></pre> </div> </div> </div> </div> <h3 class="subsection-title">继承关系</h3> <ul> <li><a link="LineSymbol.html" onclick="getTypeHTML(event)" class="mapgis-link-name" title="LineSymbol" LineSymbol.html>LineSymbol</a></li> </ul> <div class='vertical-section'> <h3 id='member'>成员变量</h3> <h4 style="margin-top: 20px;margin-bottom: 20px;">成员变量概述</h4> <div class="table-container"> <table class="params table"> <thead> <tr> <th>名称</th> <th>类型</th> <th>描述</th> </tr> </thead> <tbody> <tr class="deep-level-0"> <td class="name"><code><a href="#cap">cap</a></code></td> <td class="name"> <code> <span class="param-type">String</span> </code> </td> <td class="name"><code><p>首尾角样式</p></code></td> </tr> <tr class="deep-level-0"> <td class="name"><code><a href="#color">color</a></code></td> <td class="name"> <code> <span class="param-type"><a link="Color.html" onclick="getTypeHTML(event)" class="mapgis-link-name" title="Color" Color.html>Color</a></span> </code> </td> <td class="name"><code><p>颜色</p></code></td> </tr> <tr class="deep-level-0"> <td class="name"><code><a href="#join">join</a></code></td> <td class="name"> <code> <span class="param-type">String</span> </code> </td> <td class="name"><code><p>接角样式</p></code></td> </tr> <tr class="deep-level-0"> <td class="name"><code><a href="#marker">marker</a></code></td> <td class="name"> <code> <span class="param-type"><a link="LineSymbolMarker.html" onclick="getTypeHTML(event)" class="mapgis-link-name" title="LineSymbolMarker" LineSymbolMarker.html>LineSymbolMarker</a></span> </code> </td> <td class="name"><code><p>线端点样式</p></code></td> </tr> <tr class="deep-level-0"> <td class="name"><code><a href="#miterLimit">miterLimit</a></code></td> <td class="name"> <code> <span class="param-type">Number</span> </code> </td> <td class="name"><code><p>斜接的宽度与线宽的最大允许比率</p></code></td> </tr> <tr class="deep-level-0"> <td class="name"><code><a href="#style">style</a></code></td> <td class="name"> <code> <span class="param-type">String</span> </code> </td> <td class="name"><code><p>线样式</p></code></td> </tr> <tr class="deep-level-0"> <td class="name"><code><a href="#type">type</a></code></td> <td class="name"> <code> <span class="param-type">String</span> </code> </td> <td class="name"><code><p>符号类型</p></code></td> </tr> <tr class="deep-level-0"> <td class="name"><code><a href="#width">width</a></code></td> <td class="name"> <code> <span class="param-type">Number</span> </code> </td> <td class="name"><code><p>线宽度</p></code></td> </tr> </tbody> </table> </div> <h4 style="margin-top: 20px;margin-bottom: 20px;">成员变量详情</h4> <div class="members"> <div class="member"> <span class="method-parameter is-pulled-right"> <label>类型:</label> <span class="param-type">String</span> </span> <h4 class="name" id="cap"> <a class="href-link" href="#cap">#</a> <span class="code-name"> cap </span> </h4> <div class="description"> <p>首尾角样式</p> </div> <dl class="details"> </dl> </div> <div class="member"> <span class="method-parameter is-pulled-right"> <label>类型:</label> <span class="param-type"><a link="Color.html" onclick="getTypeHTML(event)" class="mapgis-link-name" title="Color" Color.html>Color</a></span> </span> <h4 class="name" id="color"> <a class="href-link" href="#color">#</a> <span class="code-name"> color </span> </h4> <div class="description"> <p>颜色</p> </div> <dl class="details"> <dt class="inherited-from">Inherited From:</dt> <dd class="inherited-from"><ul class="dummy"><li> <a goto="color" link="LineSymbol.html" onclick="getTypeHTML(event)" class="mapgis-link-name" title="LineSymbol#color" LineSymbol.html#color>LineSymbol#color</a> </li></ul></dd> </dl> </div> <div class="member"> <span class="method-parameter is-pulled-right"> <label>类型:</label> <span class="param-type">String</span> </span> <h4 class="name" id="join"> <a class="href-link" href="#join">#</a> <span class="code-name"> join </span> </h4> <div class="description"> <p>接角样式</p> </div> <dl class="details"> </dl> </div> <div class="member"> <span class="method-parameter is-pulled-right"> <label>类型:</label> <span class="param-type"><a link="LineSymbolMarker.html" onclick="getTypeHTML(event)" class="mapgis-link-name" title="LineSymbolMarker" LineSymbolMarker.html>LineSymbolMarker</a></span> </span> <h4 class="name" id="marker"> <a class="href-link" href="#marker">#</a> <span class="code-name"> marker </span> </h4> <div class="description"> <p>线端点样式</p> </div> <dl class="details"> </dl> </div> <div class="member"> <span class="method-parameter is-pulled-right"> <label>类型:</label> <span class="param-type">Number</span> </span> <h4 class="name" id="miterLimit"> <a class="href-link" href="#miterLimit">#</a> <span class="code-name"> miterLimit </span> </h4> <div class="description"> <p>斜接的宽度与线宽的最大允许比率</p> </div> <dl class="details"> </dl> </div> <div class="member"> <span class="method-parameter is-pulled-right"> <label>类型:</label> <span class="param-type">String</span> </span> <h4 class="name" id="style"> <a class="href-link" href="#style">#</a> <span class="code-name"> style </span> </h4> <div class="description"> <p>线样式</p> </div> <dl class="details"> </dl> </div> <div class="member"> <span class="method-parameter is-pulled-right"> <label>类型:</label> <span class="param-type">String</span> </span> <h4 class="name" id="type"> <a class="href-link" href="#type">#</a> <span class="code-name"> type </span> </h4> <div class="description"> <p>符号类型</p> </div> <dl class="details"> <dt class="tag-overrides">Overrides:</dt> <dd class="tag-overrides"><ul class="dummy"><li> <a class="mapgis-link-name" title="LineSymbol#type" LineSymbol.html#type>LineSymbol#type</a> </li></ul></dd> </dl> </div> <div class="member"> <span class="method-parameter is-pulled-right"> <label>类型:</label> <span class="param-type">Number</span> </span> <h4 class="name" id="width"> <a class="href-link" href="#width">#</a> <span class="code-name"> width </span> </h4> <div class="description"> <p>线宽度</p> </div> <dl class="details"> <dt class="inherited-from">Inherited From:</dt> <dd class="inherited-from"><ul class="dummy"><li> <a goto="width" link="LineSymbol.html" onclick="getTypeHTML(event)" class="mapgis-link-name" title="LineSymbol#width" LineSymbol.html#width>LineSymbol#width</a> </li></ul></dd> </dl> </div> </div> </div> <div class='vertical-section'> <h3 id='function'>方法</h3> <h4 style="margin-top: 20px;margin-bottom: 20px;">方法概述</h4> <div class="members"> <div class="table-container"> <table class="params table"> <thead> <tr> <th>名称</th> <th>返回值类型</th> <th>描述</th> </tr> </thead> <tbody> <tr class="deep-level-0"> <td class="name"><code><a href="#fromJSON">fromJSON</a></code></td> <td class="name"> <code> <span class="param-type"><a link="SimpleLineSymbol.html" onclick="getTypeHTML(event)" class="mapgis-link-name" title="SimpleLineSymbol" SimpleLineSymbol.html>SimpleLineSymbol</a></span> </code> </td> <td class="name"><code><p>通过json构造并返回一个新的SimpleLineSymbol对象<a id='fromJSON'></a></p></code></td> </tr> <tr class="deep-level-0"> <td class="name"><code><a href="#clone">clone</a></code></td> <td class="name"> <code> <span class="param-type"><a link="SimpleLineSymbol.html" onclick="getTypeHTML(event)" class="mapgis-link-name" title="SimpleLineSymbol" SimpleLineSymbol.html>SimpleLineSymbol</a></span> </code> </td> <td class="name"><code><p>克隆并返回新的符号对象</p></code></td> </tr> <tr class="deep-level-0"> <td class="name"><code><a href="#toJSON">toJSON</a></code></td> <td class="name"> <code> <span class="param-type">Object</span> </code> </td> <td class="name"><code><p>导出为JSON对象</p></code></td> </tr> </tbody> </table> </div> <h4 style="margin-top: 20px;margin-bottom: 20px;">方法详情</h4> <div class="member"> <h4 class="name" id=".fromJSON"> <a class="href-link" href="#.fromJSON">#</a> <span class='tag'>static</span> <span class="code-name" id="fromJSON" style="font-size:30px"> fromJSON<span class="signature">(json)</span> </span> </h4> <div class="description"> <p>通过json构造并返回一个新的SimpleLineSymbol对象<a id='fromJSON'></a></p> </div> <h4>参数</h4> <div class="table-container"> <table class="params table"> <thead> <tr> <th>名称</th> <th>类型</th> <th class="last">描述</th> </tr> </thead> <tbody> <tr class="deep-level-0"> <td class="name" id="json"><code>json</code></td> <td class="type"> <span class="param-type">Object</span> </td> <td class="description last"><p>符号的实例化JSON</p></td> </tr> </tbody> </table> </div> <dl class="details"> </dl> <div class='columns method-parameter'> <div class="column is-2"><label>返回值</label></div> <div class="column is-10"> <div class="columns"> <div class='param-desc column is-7'><p>新的SimpleLineSymbol对象</p></div> <div class='column is-5 has-text-left'> <label>类型: </label> <span class="param-type"><a link="SimpleLineSymbol.html" onclick="getTypeHTML(event)" class="mapgis-link-name" title="SimpleLineSymbol" SimpleLineSymbol.html>SimpleLineSymbol</a></span> </div> </div> </div> </div> <h5>示例</h5> <pre class="prettyprint"><code>&lt;caption>&lt;h7>通过json构造并返回一个新的SimpleLineSymbol对象&lt;/h7>&lt;/caption></code></pre> </div> <div class="member"> <h4 class="name" id="clone"> <a class="href-link" href="#clone">#</a> <span class="code-name" id="clone" style="font-size:30px"> clone<span class="signature">()</span> </span> </h4> <div class="description"> <p>克隆并返回新的符号对象</p> </div> <dl class="details"> </dl> <div class='columns method-parameter'> <div class="column is-2"><label>返回值</label></div> <div class="column is-10"> <div class="columns"> <div class='param-desc column is-7'><p>克隆后的新符号对象</p></div> <div class='column is-5 has-text-left'> <label>类型: </label> <span class="param-type"><a link="SimpleLineSymbol.html" onclick="getTypeHTML(event)" class="mapgis-link-name" title="SimpleLineSymbol" SimpleLineSymbol.html>SimpleLineSymbol</a></span> </div> </div> </div> </div> </div> <div class="member"> <h4 class="name" id="toJSON"> <a class="href-link" href="#toJSON">#</a> <span class="code-name" id="toJSON" style="font-size:30px"> toJSON<span class="signature">()</span> </span> </h4> <div class="description"> <p>导出为JSON对象</p> </div> <dl class="details"> <dt class="tag-overrides">Overrides:</dt> <dd class="tag-overrides"><ul class="dummy"><li> <a class="mapgis-link-name" title="LineSymbol#toJSON" LineSymbol.html#toJSON>LineSymbol#toJSON</a> </li></ul></dd> </dl> <div class='columns method-parameter'> <div class="column is-2"><label>返回值</label></div> <div class="column is-10"> <div class="columns"> <div class='param-desc column is-7'><p>JSON对像</p></div> <div class='column is-5 has-text-left'> <label>类型: </label> <span class="param-type">Object</span> </div> </div> </div> </div> </div> </div> </div> </article> </section>