mirror of https://gitee.com/antv-l7/antv-l7
commit
67c22d5fc0
|
@ -59,11 +59,11 @@ scene.addControl(scaleControl);
|
||||||
|
|
||||||
配置项
|
配置项
|
||||||
|
|
||||||
option 控件配置项
|
option 控件配置项
|
||||||
overlayers 将一组图层添加到图层列表,
|
overlayers 将一组图层添加到图层列表,
|
||||||
overlayers Object
|
overlayers Object
|
||||||
key: 列表显示的图层名字可以自定义
|
key: 列表显示的图层名字可以自定义
|
||||||
layer: 图层对象
|
layer: 图层对象
|
||||||
overlayers 示例
|
overlayers 示例
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
|
|
|
@ -14,7 +14,7 @@ Marker
|
||||||
#### option
|
#### option
|
||||||
|
|
||||||
- color `string`
|
- color `string`
|
||||||
![map-marker.png](https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*BJ6cTpDcuLcAAAAAAAAAAABkARQnAQ) 设置默认 marker 的颜色
|
![map-marker.png](https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*BJ6cTpDcuLcAAAAAAAAAAABkARQnAQ) 设置默认 marker 的颜色
|
||||||
- element `Dom|string` 自定义 marker Dom 节点,可以是 dom 实例,也可以是 dom id
|
- element `Dom|string` 自定义 marker Dom 节点,可以是 dom 实例,也可以是 dom id
|
||||||
- anchor `string` 锚点位置 支持 center, top, top-left, top-right, bottom, bottom-left,bottom-right,left, right
|
- anchor `string` 锚点位置 支持 center, top, top-left, top-right, bottom, bottom-left,bottom-right,left, right
|
||||||
- offset `Array` 偏移量 [ 0, 0 ] 分别表示 X, Y 的偏移量
|
- offset `Array` 偏移量 [ 0, 0 ] 分别表示 X, Y 的偏移量
|
||||||
|
|
|
@ -3,12 +3,12 @@ title: Marker 图层
|
||||||
order: 3
|
order: 3
|
||||||
---
|
---
|
||||||
|
|
||||||
MarkerLayer 是Marker的升级版,Marker是独立的地图标注,MarkerLayer则是统一管理大量的Marker数据。
|
MarkerLayer 是 Marker 的升级版,Marker 是独立的地图标注,MarkerLayer 则是统一管理大量的 Marker 数据。
|
||||||
|
|
||||||
|
|
||||||
**技术差异**
|
**技术差异**
|
||||||
|
|
||||||
- Marker Dom 绘制一个地图元素
|
- Marker Dom 绘制一个地图元素
|
||||||
- MarkerLayer 统一管理多个DomMarker
|
- MarkerLayer 统一管理多个 DomMarker
|
||||||
- PointLayer 通过 WebGL 绘制元素。
|
- PointLayer 通过 WebGL 绘制元素。
|
||||||
|
|
||||||
**功能差异**
|
**功能差异**
|
||||||
|
|
|
@ -31,11 +31,13 @@ const popup = new L7.Popup(option);
|
||||||
**参数**:lnglat
|
**参数**:lnglat
|
||||||
|
|
||||||
支持数组
|
支持数组
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
[112,32]
|
[112, 32];
|
||||||
```
|
```
|
||||||
|
|
||||||
经纬度对象
|
经纬度对象
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
{
|
{
|
||||||
lng: 112,
|
lng: 112,
|
||||||
|
@ -64,12 +66,11 @@ popup.addTo(scene);
|
||||||
设置 popup html 内容
|
设置 popup html 内容
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
var html =
|
var html = `<p>省份
|
||||||
`<p>省份
|
|
||||||
${feature.s} </p><p>地区
|
${feature.s} </p><p>地区
|
||||||
${feature.m}</p><p>数值
|
${feature.m}</p><p>数值
|
||||||
${feature.t}</p>`;
|
${feature.t}</p>`;
|
||||||
popup.setHtml(html);
|
popup.setHtml(html);
|
||||||
```
|
```
|
||||||
|
|
||||||
#### setDOMContent
|
#### setDOMContent
|
||||||
|
|
|
@ -31,11 +31,13 @@ const popup = new L7.Popup(option);
|
||||||
**参数**:lnglat
|
**参数**:lnglat
|
||||||
|
|
||||||
支持数组
|
支持数组
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
[112,32]
|
[112, 32];
|
||||||
```
|
```
|
||||||
|
|
||||||
经纬度对象
|
经纬度对象
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
{
|
{
|
||||||
lng: 112,
|
lng: 112,
|
||||||
|
@ -64,12 +66,11 @@ popup.addTo(scene);
|
||||||
设置 popup html 内容
|
设置 popup html 内容
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
var html =
|
var html = `<p>省份
|
||||||
`<p>省份
|
|
||||||
${feature.s} </p><p>地区
|
${feature.s} </p><p>地区
|
||||||
${feature.m}</p><p>数值
|
${feature.m}</p><p>数值
|
||||||
${feature.t}</p>`;
|
${feature.t}</p>`;
|
||||||
popup.setHtml(html);
|
popup.setHtml(html);
|
||||||
```
|
```
|
||||||
|
|
||||||
#### setDOMContent
|
#### setDOMContent
|
||||||
|
|
|
@ -503,9 +503,7 @@ layer.on('unpick', (ev) => {}); // 图层外的操作的所有事件
|
||||||
图层初始化完成后触发
|
图层初始化完成后触发
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
layer.on('inited',(option)=>{
|
layer.on('inited', (option) => {});
|
||||||
|
|
||||||
})
|
|
||||||
```
|
```
|
||||||
|
|
||||||
### add
|
### add
|
||||||
|
|
|
@ -503,9 +503,7 @@ layer.on('unpick', (ev) => {}); // 图层外的操作的所有事件
|
||||||
图层初始化完成后触发
|
图层初始化完成后触发
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
layer.on('inited',(option)=>{
|
layer.on('inited', (option) => {});
|
||||||
|
|
||||||
})
|
|
||||||
```
|
```
|
||||||
|
|
||||||
### add
|
### add
|
||||||
|
|
|
@ -41,4 +41,4 @@ import { RasterLayer } from '@antv/l7';
|
||||||
positions: [ 0, 0.2, 0.4, 0.6, 0.8, 1.0 ]
|
positions: [ 0, 0.2, 0.4, 0.6, 0.8, 1.0 ]
|
||||||
} // 色带
|
} // 色带
|
||||||
|
|
||||||
⚠️ color, position 的长度要相同
|
⚠️ color, position 的长度要相同
|
||||||
|
|
|
@ -41,4 +41,4 @@ import { RasterLayer } from '@antv/l7';
|
||||||
positions: [ 0, 0.2, 0.4, 0.6, 0.8, 1.0 ]
|
positions: [ 0, 0.2, 0.4, 0.6, 0.8, 1.0 ]
|
||||||
} // 色带
|
} // 色带
|
||||||
|
|
||||||
⚠️ color, position 的长度要相同
|
⚠️ color, position 的长度要相同
|
||||||
|
|
|
@ -264,6 +264,7 @@ scene.panBy(x, y);
|
||||||
```
|
```
|
||||||
|
|
||||||
参数:
|
参数:
|
||||||
|
|
||||||
- `x` {number} 水平方向移动像素 向右为正方向
|
- `x` {number} 水平方向移动像素 向右为正方向
|
||||||
- `y` {number} 垂直方向移动像素 向下为正方向
|
- `y` {number} 垂直方向移动像素 向下为正方向
|
||||||
|
|
||||||
|
@ -277,7 +278,7 @@ scene.setPitch(pitch);
|
||||||
|
|
||||||
参数 :
|
参数 :
|
||||||
|
|
||||||
`pitch` {number}
|
`pitch` {number}
|
||||||
|
|
||||||
### fitBounds
|
### fitBounds
|
||||||
|
|
||||||
|
@ -314,6 +315,7 @@ scene.removeLayer(layer);
|
||||||
### off
|
### off
|
||||||
|
|
||||||
移除事件监听
|
移除事件监听
|
||||||
|
|
||||||
- `eventName` {string} 事件名
|
- `eventName` {string} 事件名
|
||||||
- `handler` {function } 事件回调函数
|
- `handler` {function } 事件回调函数
|
||||||
|
|
||||||
|
|
|
@ -323,7 +323,7 @@ scene.removeLayer(layer);
|
||||||
|
|
||||||
移除事件监听
|
移除事件监听
|
||||||
`eventName` {string} 事件名
|
`eventName` {string} 事件名
|
||||||
`handler` {function } 事件回调函数
|
`handler` {function } 事件回调函数
|
||||||
|
|
||||||
### 场景事件
|
### 场景事件
|
||||||
|
|
||||||
|
|
|
@ -111,7 +111,7 @@ tranforms 处理的是的标准化之后的数据
|
||||||
- type: 'grid',
|
- type: 'grid',
|
||||||
- size: 网格半径
|
- size: 网格半径
|
||||||
- field: 数据统计字段
|
- field: 数据统计字段
|
||||||
- method: 聚合方法 count,max,min,sum,mean 5个统计维度
|
- method: 聚合方法 count,max,min,sum,mean 5 个统计维度
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
layer.source(data, {
|
layer.source(data, {
|
||||||
|
|
|
@ -88,18 +88,18 @@ const IndexPage = () => {
|
||||||
];
|
];
|
||||||
|
|
||||||
const notifications = [
|
const notifications = [
|
||||||
|
{
|
||||||
|
type: t('推荐'),
|
||||||
|
title: t('如何用L7制作省市下钻疫情地图'),
|
||||||
|
date: '2020.01.31',
|
||||||
|
link: 'https://www.yuque.com/xiaofengcanyue/scpehq/zf094u',
|
||||||
|
},
|
||||||
{
|
{
|
||||||
type: t('新版发布'),
|
type: t('新版发布'),
|
||||||
title: t('L7 2.0 正式版'),
|
title: t('L7 2.0 正式版'),
|
||||||
date: '2020.01.06',
|
date: '2020.01.06',
|
||||||
link: 'https://www.yuque.com/antv/blog/haygzb',
|
link: 'https://www.yuque.com/antv/blog/haygzb',
|
||||||
},
|
},
|
||||||
{
|
|
||||||
type: t('推荐'),
|
|
||||||
title: t('欢迎进入 2020 可视化智能研发时代'),
|
|
||||||
date: '2020.01.08',
|
|
||||||
link: 'https://www.yuque.com/antv/blog/ygdubv',
|
|
||||||
},
|
|
||||||
];
|
];
|
||||||
|
|
||||||
const cases = [
|
const cases = [
|
||||||
|
|
Loading…
Reference in New Issue