2.3 KiB

Raw Blame History

title	order
Control	1

control

地图组件用于控制地图的状态如果平移，缩放，或者展示地图一些的辅助信息如图例，比例尺

构造函数

const baseControl = new L7.Control.Base(option);

option

position: string 控件位置支持是个方位 bottomright, topright, bottomleft, topleft

scene 内置地图组件

zoom 地图放大缩小默认添加
Scale 地图比例尺默认添加
attribution 地图数据属性默认添加
layer 图层列表

scene配置项设置控件添加状态

scene = new L7.scene({
   zoomControl: true,
   scaleControl: true,
   attributionControl: true
})

Zoom

放大缩小组件默认左上角

 new L7.Control.Zoom({
      position: 'topleft'
    }).addTo(scene);

Scale

比例尺组件默认左下角

 new L7.Control.Scale({
      position: 'bottomleft'
    }).addTo(scene);

attribution

默认右下角

new L7.Control.Attribution({
      position: 'bottomleft'
    }).addTo(scene);

layer

图层列表目前只支持可视化overlayers 图层控制

 var overlayers = {
        "围栏填充": layer,
        "围栏边界": layer2
      };
new L7.Control.Layers({
  overlayers: overlayers
}).addTo(scene);

方法

onAdd

组件添加到地图Scene时调用，自定义组件时需要实现此方法

addTo

添加到地图scene

control.addTo(scene);

setPosition

设置组件位置

control.setPosition('bottomright');

remove

移除地图组件

control.remove();

示例代码

自定义图例控件

源码

var legend = new L7.Control.Base({
        position: 'bottomright'
      });
      legend.onAdd = function() {
        var el = document.createElement('div');
        el.className = 'infolegend legend';
        var grades = [0, 8, 15, 30, 65, 120];
        for (var i = 0; i < grades.length; i++) {
          el.innerHTML += '<i style="background:' + colors[i] + '"></i> ' + grades[i] + (grades[i + 1] ? '–' + grades[i + 1] + '<br>' : '+');
        }
        return el;
      };
      legend.addTo(scene);

2.3 KiB Raw Blame History Unescape Escape