mirror of https://gitee.com/antv-l7/antv-l7
docs: 文档
This commit is contained in:
parent
df31e18479
commit
72782bd2c0
|
@ -2,7 +2,9 @@
|
||||||
title: ChangeLog
|
title: ChangeLog
|
||||||
order: 10
|
order: 10
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## 2020.03.12 2.1 正式版
|
## 2020.03.12 2.1 正式版
|
||||||
|
|
||||||
###✨ Features
|
###✨ Features
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: 发布日志
|
title: 发布日志
|
||||||
order: 10
|
order: 10
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## 2020.04.20 2.2 正式版本
|
## 2020.04.20 2.2 正式版本
|
||||||
|
|
||||||
###✨ Features
|
###✨ Features
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: Control
|
title: Control
|
||||||
order: 3
|
order: 3
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
地图组件 用于控制地图的状态如果平移,缩放,或者展示地图一些的辅助信息如图例,比例尺
|
地图组件 用于控制地图的状态如果平移,缩放,或者展示地图一些的辅助信息如图例,比例尺
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: Control 控件
|
title: Control 控件
|
||||||
order: 3
|
order: 3
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
地图组件用于控制地图的状态如果平移,缩放,或者展示地图一些的辅助信息如图例、比例尺
|
地图组件用于控制地图的状态如果平移,缩放,或者展示地图一些的辅助信息如图例、比例尺
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: Marker
|
title: Marker
|
||||||
order: 3
|
order: 3
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
Marker 地图标注 目前只支持 2D dom 标注
|
Marker 地图标注 目前只支持 2D dom 标注
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: Marker Layer
|
title: Marker Layer
|
||||||
order: 3
|
order: 3
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
MarkerLayer 不同于 PointLayer 图层
|
MarkerLayer 不同于 PointLayer 图层
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: Marker 图层
|
title: Marker 图层
|
||||||
order: 3
|
order: 3
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
MarkerLayer 是 Marker 的升级版,Marker 是独立的地图标注,MarkerLayer 则是统一管理大量的 Marker 数据。
|
MarkerLayer 是 Marker 的升级版,Marker 是独立的地图标注,MarkerLayer 则是统一管理大量的 Marker 数据。
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: Popup
|
title: Popup
|
||||||
order: 0
|
order: 0
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
地图标注信息窗口,用于展示地图要素的属性信息
|
地图标注信息窗口,用于展示地图要素的属性信息
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: Popup 信息框
|
title: Popup 信息框
|
||||||
order: 0
|
order: 0
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
地图标注信息窗口,用于展示地图要素的属性信息
|
地图标注信息窗口,用于展示地图要素的属性信息
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: 标准地图
|
title: 标准地图
|
||||||
order: 2
|
order: 2
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## 五种地图类型
|
## 五种地图类型
|
||||||
|
|
|
@ -4,6 +4,7 @@ order: 2
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## 五种地图类型
|
## 五种地图类型
|
||||||
|
|
||||||
- WorldLayer 世界地图
|
- WorldLayer 世界地图
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: 钻取地图
|
title: 钻取地图
|
||||||
order: 2
|
order: 2
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
钻取是改变展现数据维度的层次,变换分析的粒度。它包括向上钻取(drillup)和向下钻取(drilldown)。
|
钻取是改变展现数据维度的层次,变换分析的粒度。它包括向上钻取(drillup)和向下钻取(drilldown)。
|
||||||
|
@ -93,7 +94,7 @@ DrillDownLayer 提供默认提供通过 Layer 的交互事件,实现上钻下
|
||||||
strokeWidth: number; 填充宽度
|
strokeWidth: number; 填充宽度
|
||||||
};
|
};
|
||||||
|
|
||||||
#### fill
|
#### fillOption
|
||||||
|
|
||||||
填充图样式
|
填充图样式
|
||||||
|
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: 钻取地图
|
title: 钻取地图
|
||||||
order: 2
|
order: 2
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
钻取是改变展现数据维度的层次,变换分析的粒度。它包括向上钻取(drillup)和向下钻取(drilldown)。
|
钻取是改变展现数据维度的层次,变换分析的粒度。它包括向上钻取(drillup)和向下钻取(drilldown)。
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: 快速开始
|
title: 快速开始
|
||||||
order: 0
|
order: 0
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
地图行政区划组件,支持世界地图,中国地图省市县三级,支持中国地图省市县上钻下取。
|
地图行政区划组件,支持世界地图,中国地图省市县三级,支持中国地图省市县上钻下取。
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: Draw Component
|
title: Draw Component
|
||||||
order: 3
|
order: 3
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
地图绘制组件,支持点、线、面, 圆、矩形、的绘制编辑。
|
地图绘制组件,支持点、线、面, 圆、矩形、的绘制编辑。
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: Draw 实例
|
title: Draw 实例
|
||||||
order: 3
|
order: 3
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
### Draw Type
|
### Draw Type
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: Draw UI Component
|
title: Draw UI Component
|
||||||
order: 2
|
order: 2
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
地图绘制组件,支持点、线、面, 圆、矩形、的绘制编辑。
|
地图绘制组件,支持点、线、面, 圆、矩形、的绘制编辑。
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: 绘制 UI 组件
|
title: 绘制 UI 组件
|
||||||
order: 2
|
order: 2
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
地图绘制组件,支持点、线、面, 圆、矩形、的绘制编辑。
|
地图绘制组件,支持点、线、面, 圆、矩形、的绘制编辑。
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: 快速使用
|
title: 快速使用
|
||||||
order: 1
|
order: 1
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
地图绘制组件,支持点、线、面, 圆、矩形、的绘制编辑。
|
地图绘制组件,支持点、线、面, 圆、矩形、的绘制编辑。
|
||||||
|
|
|
@ -4,6 +4,7 @@ order: 0
|
||||||
redirect_from:
|
redirect_from:
|
||||||
- /en/docs/api
|
- /en/docs/api
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
An open source large-scale geospatial data visualization analysis development framework powered by WebGL.
|
An open source large-scale geospatial data visualization analysis development framework powered by WebGL.
|
||||||
|
|
||||||
|
|
|
@ -4,7 +4,9 @@ order: 0
|
||||||
redirect_from:
|
redirect_from:
|
||||||
- /zh/docs/api
|
- /zh/docs/api
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
# L7 地理空间数据可视分析引擎
|
# L7 地理空间数据可视分析引擎
|
||||||
|
|
||||||
✨ 2020.01.06 2.0 版本正式发布
|
✨ 2020.01.06 2.0 版本正式发布
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: 1.x history
|
title: 1.x history
|
||||||
order: 9
|
order: 9
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## L7 1.x 版本
|
## L7 1.x 版本
|
||||||
|
|
||||||
## [旧版地址](https://antv-2018.alipay.com/zh-cn/l7/1.x/index.html)
|
## [旧版地址](https://antv-2018.alipay.com/zh-cn/l7/1.x/index.html)
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: 1.x 历史版本
|
title: 1.x 历史版本
|
||||||
order: 9
|
order: 9
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## L7 1.x 版本
|
## L7 1.x 版本
|
||||||
|
|
||||||
## [旧版地址](https://antv-2018.alipay.com/zh-cn/l7/1.x/index.html)
|
## [旧版地址](https://antv-2018.alipay.com/zh-cn/l7/1.x/index.html)
|
||||||
|
|
|
@ -8,6 +8,7 @@ order: 6
|
||||||
```javascript
|
```javascript
|
||||||
import { CityBuildingLayer } from '@antv/l7';
|
import { CityBuildingLayer } from '@antv/l7';
|
||||||
```
|
```
|
||||||
|
|
||||||
### animate
|
### animate
|
||||||
|
|
||||||
开启动画效果
|
开启动画效果
|
||||||
|
|
|
@ -59,4 +59,5 @@ pointLayer
|
||||||
});
|
});
|
||||||
scene.addLayer(pointLayer);
|
scene.addLayer(pointLayer);
|
||||||
```
|
```
|
||||||
|
|
||||||
`markdown:docs/common/layer/base.md`
|
`markdown:docs/common/layer/base.md`
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: ImageLayer
|
title: ImageLayer
|
||||||
order: 5
|
order: 5
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## 简介
|
## 简介
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: Base Layer
|
title: Base Layer
|
||||||
order: 0
|
order: 0
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## 简介
|
## 简介
|
||||||
|
@ -11,7 +12,12 @@ L7 Layer 接口设计遵循图形语法,所有图层都继承于该基类。
|
||||||
语法示例
|
语法示例
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
const layer = new Layer(option).source().color().size().shape().style();
|
const layer = new Layer(option)
|
||||||
|
.source()
|
||||||
|
.color()
|
||||||
|
.size()
|
||||||
|
.shape()
|
||||||
|
.style();
|
||||||
|
|
||||||
scene.addLayer(layer);
|
scene.addLayer(layer);
|
||||||
```
|
```
|
||||||
|
@ -79,7 +85,7 @@ layer.source(data, {
|
||||||
transforms: [
|
transforms: [
|
||||||
{
|
{
|
||||||
type: 'map',
|
type: 'map',
|
||||||
callback: function (item) {
|
callback: function(item) {
|
||||||
const [x, y] = item.coordinates;
|
const [x, y] = item.coordinates;
|
||||||
item.lat = item.lat * 1;
|
item.lat = item.lat * 1;
|
||||||
item.lng = item.lng * 1;
|
item.lng = item.lng * 1;
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: 图层基类
|
title: 图层基类
|
||||||
order: 0
|
order: 0
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## 简介
|
## 简介
|
||||||
|
|
||||||
L7 Layer 接口设计遵循图形语法,所有图层都继承于该基类。
|
L7 Layer 接口设计遵循图形语法,所有图层都继承于该基类。
|
||||||
|
@ -10,7 +12,12 @@ L7 Layer 接口设计遵循图形语法,所有图层都继承于该基类。
|
||||||
语法示例
|
语法示例
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
const layer = new Layer(option).source().color().size().shape().style();
|
const layer = new Layer(option)
|
||||||
|
.source()
|
||||||
|
.color()
|
||||||
|
.size()
|
||||||
|
.shape()
|
||||||
|
.style();
|
||||||
|
|
||||||
scene.addLayer(layer);
|
scene.addLayer(layer);
|
||||||
```
|
```
|
||||||
|
@ -20,6 +27,7 @@ scene.addLayer(layer);
|
||||||
## 配置项
|
## 配置项
|
||||||
|
|
||||||
### name
|
### name
|
||||||
|
|
||||||
<description> _string_ **optional** _default:_ 自动数字编号</description>
|
<description> _string_ **optional** _default:_ 自动数字编号</description>
|
||||||
|
|
||||||
设置图层名称,可根据 name 获取 layer;
|
设置图层名称,可根据 name 获取 layer;
|
||||||
|
@ -83,7 +91,7 @@ layer.source(data, {
|
||||||
transforms: [
|
transforms: [
|
||||||
{
|
{
|
||||||
type: 'map',
|
type: 'map',
|
||||||
callback: function (item) {
|
callback: function(item) {
|
||||||
const [x, y] = item.coordinates;
|
const [x, y] = item.coordinates;
|
||||||
item.lat = item.lat * 1;
|
item.lat = item.lat * 1;
|
||||||
item.lng = item.lng * 1;
|
item.lng = item.lng * 1;
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: 栅格图层
|
title: 栅格图层
|
||||||
order: 5
|
order: 5
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
Raster 图层主要实现栅格数据的可视化,栅格数据主要来源是卫星遥感数据,如数字高程图,植被分布图,夜光图。
|
Raster 图层主要实现栅格数据的可视化,栅格数据主要来源是卫星遥感数据,如数字高程图,植被分布图,夜光图。
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: Map
|
title: Map
|
||||||
order: 2
|
order: 2
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
# 简介
|
# 简介
|
||||||
|
|
||||||
L7 专注数据可视化层数据表达,目前 L7 还不支持独立的地图引擎,需要引入第三方引擎,目前支持高德地图和 MapBox 两种。
|
L7 专注数据可视化层数据表达,目前 L7 还不支持独立的地图引擎,需要引入第三方引擎,目前支持高德地图和 MapBox 两种。
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: 地图 Map
|
title: 地图 Map
|
||||||
order: 2
|
order: 2
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
# 简介
|
# 简介
|
||||||
|
|
||||||
L7 专注数据可视化层数据表达,目前 L7 还不支持独立的地图引擎,需要引入第三方引擎,目前支持高德地图和 MapBox 两种。
|
L7 专注数据可视化层数据表达,目前 L7 还不支持独立的地图引擎,需要引入第三方引擎,目前支持高德地图和 MapBox 两种。
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: Layer Component
|
title: Layer Component
|
||||||
order: 2
|
order: 2
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## Layer 类型
|
## Layer 类型
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: Layer 组件
|
title: Layer 组件
|
||||||
order: 2
|
order: 2
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## Layer 类型
|
## Layer 类型
|
||||||
|
|
||||||
React 各个组件名称和 L7 名称保持一致
|
React 各个组件名称和 L7 名称保持一致
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: Marker
|
title: Marker
|
||||||
order: 3
|
order: 3
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## Marker Props
|
## Marker Props
|
||||||
|
|
||||||
| prop name | Type | Default | Description |
|
| prop name | Type | Default | Description |
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: Marker 组件
|
title: Marker 组件
|
||||||
order: 3
|
order: 3
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## Marker Props
|
## Marker Props
|
||||||
|
|
||||||
| prop name | Type | Default | Description |
|
| prop name | Type | Default | Description |
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: Popup Component
|
title: Popup Component
|
||||||
order: 4
|
order: 4
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## Popup Props
|
## Popup Props
|
||||||
|
|
||||||
| prop name | Type | Default | Description |
|
| prop name | Type | Default | Description |
|
||||||
|
|
|
@ -4,6 +4,7 @@ order: 4
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## Popup Props
|
## Popup Props
|
||||||
|
|
||||||
| prop name | Type | Default | Description |
|
| prop name | Type | Default | Description |
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: Scene
|
title: Scene
|
||||||
order: 1
|
order: 1
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## 使用
|
## 使用
|
||||||
|
|
||||||
在 React 版本中 Mapbox 和高德地图作为两个组件封装的。
|
在 React 版本中 Mapbox 和高德地图作为两个组件封装的。
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: Scene 组件
|
title: Scene 组件
|
||||||
order: 1
|
order: 1
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## 使用
|
## 使用
|
||||||
|
|
||||||
在 React 版本中 Mapbox 和高德地图作为两个组件封装的。
|
在 React 版本中 Mapbox 和高德地图作为两个组件封装的。
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: Get Started
|
title: Get Started
|
||||||
order: 0
|
order: 0
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
### 安装
|
### 安装
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: 快速开始
|
title: 快速开始
|
||||||
order: 0
|
order: 0
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
### 安装
|
### 安装
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: Scene
|
title: Scene
|
||||||
order: 2
|
order: 2
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
# 简介
|
# 简介
|
||||||
|
|
||||||
## Scene
|
## Scene
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: 场景 Scene
|
title: 场景 Scene
|
||||||
order: 2
|
order: 2
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
# 简介
|
# 简介
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
|
@ -41,7 +43,6 @@ L7 地理可视化侧重于地理数据的可视化表达,地图层需要依
|
||||||
|
|
||||||
### map
|
### map
|
||||||
|
|
||||||
|
|
||||||
可以通过 scene map 属性获取 map 实例
|
可以通过 scene map 属性获取 map 实例
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
|
@ -88,7 +89,8 @@ L7 Logo 的显示位置 默认左下角
|
||||||
- bottomleft,
|
- bottomleft,
|
||||||
- topleft`
|
- topleft`
|
||||||
|
|
||||||
### logoVisible logo是否可见
|
### logoVisible logo 是否可见
|
||||||
|
|
||||||
<description> _bottomleft_ **可选** _default: true_ </description>
|
<description> _bottomleft_ **可选** _default: true_ </description>
|
||||||
|
|
||||||
是否显示 L7 的 Logo {boolean} true
|
是否显示 L7 的 Logo {boolean} true
|
||||||
|
@ -109,7 +111,7 @@ L7 Logo 的显示位置 默认左下角
|
||||||
|
|
||||||
### zoom 初始化缩放等级
|
### zoom 初始化缩放等级
|
||||||
|
|
||||||
<description> _number_ </description>
|
<description> _number_ </description>
|
||||||
|
|
||||||
地图初始显示级别 {number} Mapbox (0-24) 高德 (3-18)
|
地图初始显示级别 {number} Mapbox (0-24) 高德 (3-18)
|
||||||
|
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: CSV
|
title: CSV
|
||||||
order: 3
|
order: 3
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
L7 支持 CSV 以逗号分隔的 CSV 数据加载。
|
L7 支持 CSV 以逗号分隔的 CSV 数据加载。
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: CSV
|
title: CSV
|
||||||
order: 3
|
order: 3
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
L7 支持 CSV 以逗号分隔的 CSV 数据加载。
|
L7 支持 CSV 以逗号分隔的 CSV 数据加载。
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: GeoJSON
|
title: GeoJSON
|
||||||
order: 1
|
order: 1
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## 简介
|
## 简介
|
||||||
|
|
||||||
GeoJSON 是一种对各种地理数据结构进行编码的格式。GeoJSON 对象可以表示几何、特征或者特征集合。GeoJSON 支持下面几何类型:点、线、面、多点、多线、多面和几何集合。GeoJSON 里的特征包含一个几何对象和其他属性,特征集合表示一系列特征。
|
GeoJSON 是一种对各种地理数据结构进行编码的格式。GeoJSON 对象可以表示几何、特征或者特征集合。GeoJSON 支持下面几何类型:点、线、面、多点、多线、多面和几何集合。GeoJSON 里的特征包含一个几何对象和其他属性,特征集合表示一系列特征。
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
title: GeoJSON
|
title: GeoJSON
|
||||||
order: 1
|
order: 1
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## 简介
|
## 简介
|
||||||
|
|
||||||
GeoJSON 是一种对各种地理数据结构进行编码的格式。GeoJSON 对象可以表示几何、特征或者特征集合。GeoJSON 支持下面几何类型:点、线、面、多点、多线、多面和几何集合。GeoJSON 里的特征包含一个几何对象和其他属性,特征集合表示一系列特征。
|
GeoJSON 是一种对各种地理数据结构进行编码的格式。GeoJSON 对象可以表示几何、特征或者特征集合。GeoJSON 支持下面几何类型:点、线、面、多点、多线、多面和几何集合。GeoJSON 里的特征包含一个几何对象和其他属性,特征集合表示一系列特征。
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: Image
|
title: Image
|
||||||
order: 4
|
order: 4
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
Image 数据主要用于在地图根据经纬度范围添加图图片,不如一幅纸制地图扫描版你要放在地图显示。
|
Image 数据主要用于在地图根据经纬度范围添加图图片,不如一幅纸制地图扫描版你要放在地图显示。
|
||||||
|
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: Image
|
title: Image
|
||||||
order: 4
|
order: 4
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
Image 数据主要用于在地图根据经纬度范围添加图图片,比如一幅纸制地图扫描版你要放在地图显示。
|
Image 数据主要用于在地图根据经纬度范围添加图图片,比如一幅纸制地图扫描版你要放在地图显示。
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: JSON
|
title: JSON
|
||||||
order: 2
|
order: 2
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
GeoJSON 虽然是通用的的地理数据格式,在具体使用场景中,数据服务人员可能并不熟悉 GeoJON,或者没有生成 GeoJON 的工具, 因此 L7 对数据定义了 Parser 的概念,你的数据可以是任何格式,使用指定数据对应的地理信息字段即可。
|
GeoJSON 虽然是通用的的地理数据格式,在具体使用场景中,数据服务人员可能并不熟悉 GeoJON,或者没有生成 GeoJON 的工具, 因此 L7 对数据定义了 Parser 的概念,你的数据可以是任何格式,使用指定数据对应的地理信息字段即可。
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: JSON
|
title: JSON
|
||||||
order: 2
|
order: 2
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
GeoJSON 虽然是通用的的地理数据格式,在具体使用场景中,数据服务人员可能并不熟悉 GeoJON,或者没有生成 GeoJON 的工具, 因此 L7 对数据定义了 Parser 的概念,你的数据可以是任何格式,使用指定数据对应的地理信息字段即可。
|
GeoJSON 虽然是通用的的地理数据格式,在具体使用场景中,数据服务人员可能并不熟悉 GeoJON,或者没有生成 GeoJON 的工具, 因此 L7 对数据定义了 Parser 的概念,你的数据可以是任何格式,使用指定数据对应的地理信息字段即可。
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: Raster
|
title: Raster
|
||||||
order: 5
|
order: 5
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
Raster 图层主要实现栅格数据的可视化,栅格数据主要来源是卫星遥感数据,如数字高程图,植被分布图,夜光图。
|
Raster 图层主要实现栅格数据的可视化,栅格数据主要来源是卫星遥感数据,如数字高程图,植被分布图,夜光图。
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: 栅格
|
title: 栅格
|
||||||
order: 5
|
order: 5
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
Raster 图层主要实现栅格数据的可视化,栅格数据主要来源是卫星遥感数据,如数字高程图,植被分布图,夜光图。
|
Raster 图层主要实现栅格数据的可视化,栅格数据主要来源是卫星遥感数据,如数字高程图,植被分布图,夜光图。
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: Source
|
title: Source
|
||||||
order: 0
|
order: 0
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## 概述
|
## 概述
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
title: Source
|
title: Source
|
||||||
order: 0
|
order: 0
|
||||||
---
|
---
|
||||||
|
|
||||||
`markdown:docs/common/style.md`
|
`markdown:docs/common/style.md`
|
||||||
|
|
||||||
## 概述
|
## 概述
|
||||||
|
|
|
@ -108,16 +108,27 @@ District 提供polygon数据需要跟用户的属性数据,通过关系字段
|
||||||
- [市级行政区划及编码](https://gw.alipayobjects.com/os/bmw-prod/d2aefd78-f5df-486f-9310-7449cc7f5569.csv)
|
- [市级行政区划及编码](https://gw.alipayobjects.com/os/bmw-prod/d2aefd78-f5df-486f-9310-7449cc7f5569.csv)
|
||||||
|
|
||||||
- [县级行政区名称级编码](https://gw.alipayobjects.com/os/bmw-prod/fafd299e-0e1e-4fa2-a8ac-10a984c6e983.csv)
|
- [县级行政区名称级编码](https://gw.alipayobjects.com/os/bmw-prod/fafd299e-0e1e-4fa2-a8ac-10a984c6e983.csv)
|
||||||
## 属性
|
|
||||||
|
|
||||||
行政区划组件每个图层有多个子图层组成,如标注层,国界线、省界线等等,
|
|
||||||
|
|
||||||
### fillLayer
|
|
||||||
图层事件可以通过该属性进行设置
|
|
||||||
|
|
||||||
## 方法
|
## 方法
|
||||||
|
|
||||||
#### updateData(data, joinBy)
|
### updateLayerAttribute
|
||||||
|
更新图层渲染样式
|
||||||
|
|
||||||
|
### updateDistrict
|
||||||
|
根据 adcode 更新 行政区块
|
||||||
|
|
||||||
|
参数
|
||||||
|
- adcode 行政区划编码
|
||||||
|
- data 数据
|
||||||
|
- joinByField 绑定字段
|
||||||
|
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
citylayer.updateDistrict(['330100','340100']);
|
||||||
|
|
||||||
|
```
|
||||||
|
|
||||||
|
### updateData(data, joinBy)
|
||||||
更新显示数据,
|
更新显示数据,
|
||||||
|
|
||||||
参数:
|
参数:
|
||||||
|
@ -141,3 +152,29 @@ District 提供polygon数据需要跟用户的属性数据,通过关系字段
|
||||||
|
|
||||||
## 事件
|
## 事件
|
||||||
|
|
||||||
|
行政区划图事件监听默认添加在 fillLayer上,你点击填充的色块才能接收到事件响应。
|
||||||
|
|
||||||
|
支持的事件类型同
|
||||||
|
|
||||||
|
### on 添加事件
|
||||||
|
参数
|
||||||
|
- type
|
||||||
|
- handle
|
||||||
|
- layerType 可选 ```'fill' | 'line' | 'label' | 'bubble'``` 默认值 `fill`
|
||||||
|
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
const layer = new CountryLayer();
|
||||||
|
layer.on('click',(e)=>{
|
||||||
|
console.log(e);
|
||||||
|
})
|
||||||
|
```
|
||||||
|
|
||||||
|
|
||||||
|
### off 移除事件
|
||||||
|
|
||||||
|
参数
|
||||||
|
- type
|
||||||
|
- handle
|
||||||
|
- layerType 可选 ```'fill' | 'line' | 'label' | 'bubble'``` 默认值 `fill`
|
||||||
|
|
||||||
|
|
|
@ -13,26 +13,48 @@ import { DrillDownLayer } from '@antv/l7-district';
|
||||||
```
|
```
|
||||||
DrillDownLayer 提供默认提供通过Layer的交互事件,实现上钻下钻的交互,默认点击当前图层(click)向下钻取,双击非地图区域(undblclick)向上钻取。你可以更改默认交互的的触发事件。通过也可以更改默认的交互行为。
|
DrillDownLayer 提供默认提供通过Layer的交互事件,实现上钻下钻的交互,默认点击当前图层(click)向下钻取,双击非地图区域(undblclick)向上钻取。你可以更改默认交互的的触发事件。通过也可以更改默认的交互行为。
|
||||||
|
|
||||||
### 构造函数
|
## 构造函数
|
||||||
- scene L7 scene 对象
|
|
||||||
- option 行政区划配置项
|
### scene L7 scene 对象
|
||||||
- drillDepth `number` 下钻深度 `0 | 1 | 2 ` 1 市级 2,县级
|
|
||||||
- customTrigger 是否自定义下钻交互,默认 `false`
|
### option 行政区划配置项
|
||||||
- drillDownTriggerEvent 向下钻取的触发事件 ⛔customTrigger为 true 时不生效
|
|
||||||
- drillUpTriggleEvent 向上钻取的触发事件 ⛔customTrigger为 true 时不生效
|
## 配置项
|
||||||
- provinceData 省级数据
|
|
||||||
- cityData 市级数据 可以是全量的数据,下钻时可以不需要重新设置数据
|
### customTrigger
|
||||||
- countyData 县级数据 可以是全量的数据,下钻时可以不需要重新设置数据
|
是否自定义下钻交互,默认 `false`
|
||||||
- joinBy 数据关联,属性数据如何内部空间数据关联绑定 目前支持 NAME_CHN,adcode 字段连接
|
### drillDownTriggerEvent
|
||||||
对照表 `Array [string, string]` 第一个值为空间数据字段,第二个为传入数据字段名
|
向下钻取的触发事件 ⛔customTrigger为 true 时不生效
|
||||||
- label 文本配置项 `labelOption`
|
### drillUpTriggleEvent
|
||||||
- bubble 气泡配置项 `bubbleOption`
|
向上钻取的触发事件 ⛔customTrigger为 true 时不生效
|
||||||
- fill 填充配置项 `fillOption`
|
### provinceData
|
||||||
- province `layerOption` 省级图层配置,如果不设置等同全局配置
|
省级数据
|
||||||
- city `layerOption` 市级图层配置,如果不设置等同全局配置
|
### cityData
|
||||||
- county `layerOption` 县级图层配置,如果不设置等同全局配置
|
市级数据 可以是全量的数据,下钻时可以不需要重新设置数据
|
||||||
|
### countyData
|
||||||
|
县级数据 可以是全量的数据,下钻时可以不需要重新设置数据
|
||||||
|
### joinBy
|
||||||
|
数据关联,属性数据如何内部空间数据关联绑定 目前支持 NAME_CHN,adcode 字段连接
|
||||||
|
对照表 `Array [string, string]` 第一个值为空间数据字段,第二个为传入数据字段名
|
||||||
|
### label
|
||||||
|
文本配置项 `labelOption`
|
||||||
|
### bubble
|
||||||
|
气泡配置项 `bubbleOption`
|
||||||
|
### fill
|
||||||
|
填充配置项 `fillOption`
|
||||||
|
### province
|
||||||
|
`layerOption` 省级图层配置,如果不设置等同全局配置
|
||||||
|
### city
|
||||||
|
`layerOption` 市级图层配置,如果不设置等同全局配置
|
||||||
|
### county
|
||||||
|
`layerOption` 县级图层配置,如果不设置等同全局配置
|
||||||
|
### viewStart
|
||||||
|
起始下钻视图 `Country' | 'Province' | 'City' | 'County`; 用于定义下钻层级,
|
||||||
|
### viewEnd
|
||||||
|
结束下钻视图 `Country' | 'Province' | 'City' | 'County`; 用于定义下钻层级,
|
||||||
|
|
||||||
#### layerOption
|
#### layerOption
|
||||||
|
|
||||||
下钻各个层级的配置项,可以独立配置,每一层级的样式,不设置和上一层就保持一致
|
下钻各个层级的配置项,可以独立配置,每一层级的样式,不设置和上一层就保持一致
|
||||||
- joinBy: [string, string];
|
- joinBy: [string, string];
|
||||||
- label: Partial<ILabelOption>;
|
- label: Partial<ILabelOption>;
|
||||||
|
|
|
@ -15,7 +15,8 @@ const scene = new Scene({
|
||||||
scene.on('loaded', () => {
|
scene.on('loaded', () => {
|
||||||
new DrillDownLayer(scene, {
|
new DrillDownLayer(scene, {
|
||||||
data: [],
|
data: [],
|
||||||
depth: 1,
|
viewStart: 'Country',
|
||||||
|
viewEnd: 'County',
|
||||||
fill: {
|
fill: {
|
||||||
color: {
|
color: {
|
||||||
field: 'NAME_CHN',
|
field: 'NAME_CHN',
|
||||||
|
|
|
@ -7,7 +7,7 @@
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@antv/g2": "^3.5.9",
|
"@antv/g2": "^3.5.9",
|
||||||
"@antv/l7-district": "^2.2.42",
|
"@antv/l7-district": "^2.2.44",
|
||||||
"@antv/l7-draw": "^2.3.40",
|
"@antv/l7-draw": "^2.3.40",
|
||||||
"@antv/l7-react": "^2.2.37",
|
"@antv/l7-react": "^2.2.37",
|
||||||
"@antv/gatsby-theme-antv": "^1.0.0-beta.11",
|
"@antv/gatsby-theme-antv": "^1.0.0-beta.11",
|
||||||
|
|
|
@ -30,9 +30,14 @@ export default class ZoomComponent extends React.Component {
|
||||||
this.scene = scene;
|
this.scene = scene;
|
||||||
const layer = new PolygonLayer({});
|
const layer = new PolygonLayer({});
|
||||||
|
|
||||||
layer.source(data).color('#fff').shape('name', 'text').size(16).style({
|
layer
|
||||||
opacity: 1.0,
|
.source(data)
|
||||||
});
|
.color('#fff')
|
||||||
|
.shape('name', 'text')
|
||||||
|
.size(16)
|
||||||
|
.style({
|
||||||
|
opacity: 1.0,
|
||||||
|
});
|
||||||
scene.addLayer(layer);
|
scene.addLayer(layer);
|
||||||
const zoomControl = new Zoom({
|
const zoomControl = new Zoom({
|
||||||
position: 'bottomright',
|
position: 'bottomright',
|
||||||
|
|
|
@ -52,9 +52,9 @@ export default class Country extends React.Component {
|
||||||
enable: true,
|
enable: true,
|
||||||
openTriggerEvent: 'click',
|
openTriggerEvent: 'click',
|
||||||
Html: (props: any) => {
|
Html: (props: any) => {
|
||||||
return `<span><button onclick='alert(11111)'>点击</button>${
|
return `<span><button onclick='alert(11111)'>点击</button>${props.NAME_CHN +
|
||||||
props.NAME_CHN + ':' + props.value
|
':' +
|
||||||
}</span>`;
|
props.value}</span>`;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
10
yarn.lock
10
yarn.lock
|
@ -246,12 +246,12 @@
|
||||||
resolved "https://registry.npmjs.org/@antv/gl-matrix/-/gl-matrix-2.7.1.tgz#acb8e37f7ab3df01345aba4372d7942be42eba14"
|
resolved "https://registry.npmjs.org/@antv/gl-matrix/-/gl-matrix-2.7.1.tgz#acb8e37f7ab3df01345aba4372d7942be42eba14"
|
||||||
integrity sha512-oOWcVNlpELIKi9x+Mm1Vwbz8pXfkbJKykoCIOJ/dNK79hSIANbpXJ5d3Rra9/wZqK6MC961B7sybFhPlLraT3Q==
|
integrity sha512-oOWcVNlpELIKi9x+Mm1Vwbz8pXfkbJKykoCIOJ/dNK79hSIANbpXJ5d3Rra9/wZqK6MC961B7sybFhPlLraT3Q==
|
||||||
|
|
||||||
"@antv/l7-district@^2.2.37":
|
"@antv/l7-district@^2.2.44":
|
||||||
version "2.2.42"
|
version "2.2.44"
|
||||||
resolved "https://registry.npmjs.org/@antv/l7-district/-/l7-district-2.2.42.tgz#5bff1e096bc8fe0e75b09f2ea36618f2763b73da"
|
resolved "https://registry.npmjs.org/@antv/l7-district/-/l7-district-2.2.44.tgz#b502af24a9d2262b8d4950081fc52309f51f7978"
|
||||||
integrity sha512-6PxYhCUVH45QgKTpirv7VT40cOVLZ3cbGB/gSFaTDbARxoemACGWPAwPprspBXXYnkBbfqIyegWNHjXh7BJ6qQ==
|
integrity sha512-OQK1C1ZNYyofF5ZWbzZnWk3feh7oNAspS1MqDX/VK3/bMEXf8myRCjWV3gCKcj6jMlhNQGCBWKZF1s46usUZ9g==
|
||||||
dependencies:
|
dependencies:
|
||||||
"@antv/l7" "^2.2.37"
|
"@antv/l7" "^2.2.41"
|
||||||
"@antv/l7-maps" "^2.2.37"
|
"@antv/l7-maps" "^2.2.37"
|
||||||
"@babel/runtime" "^7.7.7"
|
"@babel/runtime" "^7.7.7"
|
||||||
"@turf/circle" "^6.0.1"
|
"@turf/circle" "^6.0.1"
|
||||||
|
|
Loading…
Reference in New Issue