Class: GraphicLayer

GraphicLayer

高效率点图层类。能够支持前端百万点数据的渲染,并支持 GeoJSON,TopoJSON,二维表等多种数据格式,支持修改样式, 支持属性筛选、鼠标事件等交互操作。

new GraphicLayer(graphics, options)

Usage
// 浏览器
<script type="text/javascript" src="https://iclient.supermap.io/dist/leaflet/iclient-leaflet.js"></script>
<script>
  new L.supermap.GraphicLayer(graphics, options);
  
  // 弃用的写法
  L.supermap.graphicLayer(graphics, options);
  
</script>

// ES6 Import
import { GraphicLayer } from '@supermapgis/iclient-leaflet';

new GraphicLayer(graphics, options);

leaflet/overlay/GraphicLayer.js, line 31
Name Type Description
graphics Array.<Graphic>

要素对象。

options Object

参数。

Name Type Default Description
render string 'canvas' 可选

指定使用的渲染器。可选值:'webgl','canvas'( webgl 渲染目前只支持散点)。

color Array.<number> [0, 0, 0, 255] 可选

要素颜色。

highlightColor Array.<number> 可选

webgl 渲染时要素高亮颜色。

opacity number 0.8 可选

要素不透明度。当 Graphic 的 style 参数传入设置了 fillOpacity 或 opacity 的 CircleStyleCloverStyle,此参数无效。Graphic 的 style 传入 ImageStyle 后不支持此参数。

radius number 10 可选

要素半径,单位为像素。当 Graphic 的 style 参数传入了 radius,此参数无效。

radiusScale number 1 可选

webgl 渲染时的要素放大倍数。

radiusMinPixels number 0 可选

webgl 渲染时的要素半径最小值,单位为像素。

radiusMaxPixels number Number.MAX_SAFE_INTEGER 可选

webgl 渲染时的要素半径最大值,单位为像素。

strokeWidth number 1 可选

边框大小。当 Graphic 的 style 参数传入了 weight,此参数无效。

outline boolean false 可选

是否显示边框。当 Graphic 的 style 参数传入设置了 stroke 的 CircleStyleCloverStyle,此参数无效。

onClick function 可选

图层鼠标点击响应事件(支持 webgl、canvas 渲染)。

onHover function 可选

图层鼠标悬停响应事件(只支持 webgl 渲染)。

Extends

Methods

addGraphics(graphics)

leaflet/overlay/GraphicLayer.js, line 126

追加点要素,不会覆盖之前的要素。

Name Type Description
graphics Array.<Graphic>

点要素对象数组。

clear()

leaflet/overlay/GraphicLayer.js, line 260

释放图层资源。

getGraphicBy(property, value){Graphic}

leaflet/overlay/GraphicLayer.js, line 138

指定属性名称和属性值,获取第一个匹配的要素数组。

Name Type Description
property string

属性名称。

value string

属性值。

Returns:
Type Description
Graphic 返回匹配的 graphic。

getGraphicById(graphicId){Graphic}

leaflet/overlay/GraphicLayer.js, line 156

获取指定 ID 的矢量要素。

Name Type Description
graphicId string

矢量要素的属性 ID。

Returns:
Type Description
Graphic 返回匹配的 graphic。

getGraphicsByAttribute(attrName, attrValue){Array.<Graphic>}

leaflet/overlay/GraphicLayer.js, line 166

指定属性名称和属性值,获取所有匹配的要素数组。

Name Type Description
attrName string

属性名称。

attrValue string

属性值。

Returns:
Type Description
Array.<Graphic> 返回匹配的 graphic 数组。

getRenderer(){Object}

leaflet/overlay/GraphicLayer.js, line 268

获取渲染器。

Returns:
Type Description
Object 内部渲染器。

getState(){Object}

leaflet/overlay/GraphicLayer.js, line 277

获取当前地图和图层状态。

Returns:
Type Description
Object 地图和图层状态,包含地图状态信息和本图层相关状态信息。

removeGraphics(graphics)

leaflet/overlay/GraphicLayer.js, line 187

删除要素数组,默认删除所有要素。

Name Type Default Description
graphics Array.<Graphic> null 可选

删除的 graphics 数组。

setGraphics(graphics)

leaflet/overlay/GraphicLayer.js, line 113

设置绘制的点要素数据,会覆盖之前的所有要素。

Name Type Description
graphics Array.<Graphic>

点要素对象数组。

setStyle(styleOptions)

leaflet/overlay/GraphicLayer.js, line 220

设置图层要素整体样式。

Name Type Description
styleOptions Object

样式对象。

Name Type Default Description
color Array.<number> [0, 0, 0, 255] 可选

点颜色。

radius number 10 可选

点半径,单位为像素。

opacity number 0.8 可选

不透明度。

highlightColor Array 可选

高亮颜色,目前只支持 rgba 数组。

radiusScale number 1 可选

点放大倍数。

radiusMinPixels number 0 可选

半径最小值,单位为像素。

radiusMaxPixels number Number.MAX_SAFE_INTEGER 可选

半径最大值,单位为像素。

strokeWidth number 1 可选

边框大小。

outline boolean false 可选

是否显示边框。

update()

leaflet/overlay/GraphicLayer.js, line 252

更新图层,数据或者样式改变后调用。