@mapgis/webclient-leaflet-plugin/documention/MapVLayer.html

开发时需要引入MapGIS Client for JavaScript（Leaflet）开发包；其中包括必备的 CSS 文件和 JS 文件；

<header id="page-title" class="page-title">
    
        <span class="page-title-main">类名</span>
        <span class="page-title-sub">MapVLayer</span>
    
</header>





<section>

<article>
    <div class="container-overview">
    
        
            <div class='vertical-section'>
                <div class="members">
                    <div class="member">
                        


    
    <h4 class="name" id="MapVLayer">
        <a class="href-link" href="#MapVLayer">#</a>
        
        <span class="code-name" id="MapVLayer" style="font-size:30px">
            
                new MapVLayer<span class="signature">(map, mapVData, mapVOptions, leafletOptions)</span>
            
        </span>
    </h4>
    

    
    <div class="description">
        <p>MapV图层(Leaflet)</p>
    </div>
    









    <h4>参数</h4>
    
<div class="table-container">
    <table class="params table">
        <thead>
        <tr>
            
            <th>名称</th>
            

            <th>类型</th>

            

            <th class="last">描述</th>
        </tr>
        </thead>

        <tbody>
        

            
<tr class="deep-level-0">
  
      <td class="name"><code>map</code></td>
  

  <td class="type">
  
      
<span class="param-type">
    
             L.map
    
</span>



  
  </td>

  

  <td class="description last"><p>leaflet的地图视图对象</p></td>
</tr>



        

            
<tr class="deep-level-0">
  
      <td class="name"><code>mapVData</code></td>
  

  <td class="type">
  
      
<span class="param-type">
    
             Object
    
</span>



  
  </td>

  

  <td class="description last"><p>MapV需要的数据集</p></td>
</tr>



        

            
<tr class="deep-level-0">
  
      <td class="name"><code>mapVOptions</code></td>
  

  <td class="type">
  
      
<span class="param-type">
    
             Object
    
</span>



  
  </td>

  

  <td class="description last"><p>MapV初始化参数</p></td>
</tr>



        

            
<tr class="deep-level-0">
  
      <td class="name"><code>leafletOptions</code></td>
  

  <td class="type">
  
      
<span class="param-type">
    
             Object
    
</span>



  
  </td>

  

  <td class="description last"><p>Leaflet初始化参数</p></td>
</tr>



        
        </tbody>
    </table>
</div>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    
    

    

    

    
</dl>























    <h5>示例</h5>
    
        <p class="code-caption"><h7 id='addLayer'>混合开发模式</h7></p>
    
    
        <pre class="prettyprint"><code>// ES5引入方式
const { WebTileLayer } = zondy.Layer
const { WebTileLayer, MapVLayer, leaflet } = zondy
// ES6引入方式
import { WebTileLayer } from "@mapgis/webclient-common"
import { WebTileLayer, MapVLayer } from "@mapgis/webclient-leaflet-plugin"
import * as leaflet from '@mapgis/leaflet'
// 请先确保引入了MapV库
&lt;script src="http://{ip}:{port}/mapv.min.js">&lt;/script>
// 构造一个WebTileLayer图层对象作为底图
const layer = new WebTileLayer({
  // 服务基地址
  url: 'http://t1.tianditu.com/DataServer?T=vec_c&amp;x={col}&amp;y={row}&amp;l={level}'
});
// 加载图层元数据
layer.load().then(function () {
  // 构造地图视图的初始化参数
  const mapViewOptions = initMapViewLeafletOptions(layer, [layer])
  // 构造Leaflet地图视图对象
  const map = L.map('地图视图容器ID', mapViewOptions)
  // 构造图层的初始化参数
  const layerOptions = initializeOptions(layer)
  // 添加图层到地图视图中
  const leafletLayer = new WebTileLayer(layer.url + '&amp;tk=天地图token', layerOptions).addTo(map)
  // 构造MapV数据和初始化参数
  const mapVDate = {}
  const mapVOptions = {}
  // 创建并添加MapV图层
  new MapVLayer(map, mapVDate, mapVOptions).addTo(
    map
  );
})</code></pre>
    



                    </div>
                </div>
            </div>
        
    
    </div>
    
    

    

    

    

    

    

    

    

    

    
</article>

</section>