mirror of https://gitee.com/antv-l7/antv-l7
docs: update layer doc
This commit is contained in:
thinkinggis
parent
1bde10bd33
commit
85abfaee77
|
|
@ -63,6 +63,7 @@ module.exports = [
|
|||
),
|
||||
json(),
|
||||
postcss({
|
||||
extract: false,
|
||||
plugins: [
|
||||
url({ url: 'inline' })
|
||||
]
|
||||
|
|
|
|||
|
|
@ -2,12 +2,16 @@
|
|||
title: 发布日志
|
||||
order: 10
|
||||
---
|
||||
|
||||
## 2020.04.20 2.2 正式版本
|
||||
|
||||
###✨ Features
|
||||
|
||||
#### [L7-Draw 地图绘制组件发布](../draw/start)
|
||||
|
||||
支持基础图形绘制、平移、修改、删除
|
||||
- 绘制UI组件支持
|
||||
|
||||
- 绘制 UI 组件支持
|
||||
- 绘制圆形
|
||||
- 绘制矩形
|
||||
- 绘制点
|
||||
|
|
@ -15,18 +19,18 @@ order: 10
|
|||
- 绘制面
|
||||
|
||||
### 🍏 Improvements
|
||||
- 要素拾取支持添加buffer
|
||||
|
||||
- 要素拾取支持添加 buffer
|
||||
- 图层拾取支持冒泡机制，默认拾取最上层
|
||||
|
||||
### 🐞 Bug Fixes
|
||||
|
||||
- pointLayer 聚合支持多种数据格式化
|
||||
- 修复热力图移动端不能正常渲染
|
||||
- 修复3D热力图高德地图正使用
|
||||
- 修复 3D 热力图高德地图正使用
|
||||
- L7 版本锁定
|
||||
- 修复点图层描边模糊问题
|
||||
|
||||
|
||||
|
||||
## 2020.03.12 2.1 正式版
|
||||
|
||||
###✨ Features
|
||||
|
|
|
|||
|
|
@ -72,10 +72,6 @@ L7 是由蚂蚁金服 AntV 数据可视化团队推出的基于 WebGL 的开源
|
|||
- 图片
|
||||
- Raster
|
||||
|
||||
## L7 2.0 Roadmap
|
||||
|
||||
|
||||
|
||||
更多技术细节，详细进展，请关注 [GitHub](https://github.com/antvis/L7)，欢迎大家来给点点 Star，让更多人看到这个开源的项目。
|
||||
|
||||
### 技术支持服务群
|
||||
|
|
|
|||
|
|
@ -48,6 +48,10 @@ scene.addLayer(layer);
|
|||
|
||||
layer 初始化完成之后，是否自动缩放到图层范围 {bool } default false
|
||||
|
||||
### pickingBuffer
|
||||
|
||||
图层拾取缓存机制，如 1px 宽度的线鼠标很难拾取(点击)到, 通过设置该参数可扩大拾取的范围 {number} default 0
|
||||
|
||||
### blend
|
||||
|
||||
图层元素混合效果
|
||||
|
|
|
|||
|
|
@ -41,15 +41,16 @@ import { PointLayer } '@antv/l7-react';
|
|||
|
||||
### layer options
|
||||
|
||||
| prop name | Type | Default | Description |
|
||||
| --------- | --------- | ----------------------- | ------------------------------------------------ |
|
||||
| name | `string` | | 图层名字，可根据名称获取 layer |
|
||||
| visible | `boolean` | `true` | 图层是否可见 |
|
||||
| zIndex | `number` | 0 | 图层绘制顺序， |
|
||||
| minZoom | `number` | 0 | 设置 layer 最小可见等级，小于则不显示 |
|
||||
| maxZoom | `number` | 与 map 最大缩放等级一致 | 设置 layerd 的最大可见等级，大于则不显示 |
|
||||
| aotoFit | `boolean` | `false` | 是否缩放到图层范围 |
|
||||
| blend | 'string' | 'normal' | 图层元素混合效果 [详情]('../layer/layer/#blend') |
|
||||
| prop name | Type | Default | Description |
|
||||
| ------------- | --------- | ----------------------- | -------------------------------------------------------------------------------------------------------- |
|
||||
| name | `string` | | 图层名字，可根据名称获取 layer |
|
||||
| visible | `boolean` | `true` | 图层是否可见 |
|
||||
| zIndex | `number` | 0 | 图层绘制顺序， |
|
||||
| minZoom | `number` | 0 | 设置 layer 最小可见等级，小于则不显示 |
|
||||
| maxZoom | `number` | 与 map 最大缩放等级一致 | 设置 layerd 的最大可见等级，大于则不显示 |
|
||||
| aotoFit | `boolean` | `false` | 是否缩放到图层范围 |
|
||||
| blend | 'string' | 'normal' | 图层元素混合效果 [详情]('../layer/layer/#blend') |
|
||||
| pickingBuffer | 'number' | '0' | 图层拾取缓存机制，如 1px 宽度的线鼠标很难拾取(点击)到, 通过设置该参数可扩大拾取的范围 {number} default 0 |
|
||||
|
||||
### attribute Option
|
||||
|
||||
|
|
|
|||
|
|
@ -24,7 +24,9 @@ order: 4
|
|||
```jsx
|
||||
import { Popup } from '@antv/l7-react';
|
||||
|
||||
<Popup option={{}} lnglat={[]} />;
|
||||
<Popup option={{
|
||||
closeOnClick: false;// 如果Popup内需要响应Dom事件需设置成false,否则事件不生效
|
||||
}} lnglat={[]} />;
|
||||
```
|
||||
|
||||
[popup 使用完整 demo](../../../examples/react/covid#covid_bubble)
|
||||
|
|
|
|||
|
|
@ -275,6 +275,22 @@ scene.setRotation(rotation);
|
|||
|
||||
参数： `rotation` {number}
|
||||
|
||||
### setMapStatus
|
||||
|
||||
设置地图交互状态
|
||||
|
||||
参数 `IStatusOptions`
|
||||
|
||||
```ts
|
||||
IStatusOptions {
|
||||
dragEnable: boolean; //是否允许地图拖拽
|
||||
keyboardEnable: boolean; // 是否允许形键盘事件
|
||||
doubleClickZoom: boolean; // 双击放大
|
||||
zoomEnable: boolean; // 滚动缩放
|
||||
rotateEnable: boolean; // 旋转
|
||||
}
|
||||
```
|
||||
|
||||
### zoomIn
|
||||
|
||||
地图放大一级
|
||||
|
|
@ -359,7 +375,9 @@ scene.removeLayer(layer);
|
|||
|
||||
- 参数 type `png|jpg` 默认 png
|
||||
|
||||
scene.exportMap('png')
|
||||
```javascript
|
||||
scene.exportMap('png');
|
||||
```
|
||||
|
||||
## 事件
|
||||
|
||||
|
|
@ -429,3 +447,15 @@ scene.on('dragstart', (ev) => {}); //开始拖拽地图时触发
|
|||
scene.on('dragging', (ev) => {}); // 拖拽地图过程中触发
|
||||
scene.on('dragend', (ev) => {}); //停止拖拽地图时触发。如地图有拖拽缓动效果，则在拽停止，缓动开始前触发
|
||||
```
|
||||
|
||||
## FAQ
|
||||
|
||||
### 禁止地图交互
|
||||
|
||||
1. 初始化的时候可以在 map 配置项设置
|
||||
|
||||
- 高德地图可查看 https://lbs.amap.com/api/javascript-api/reference/map
|
||||
- mapbox https://docs.mapbox.com/mapbox-gl-js/api/#map
|
||||
|
||||
2. 加载完成后设置
|
||||
调用 scene 的 [setMapStatus](./scene/#setMapStatus) 方法
|
||||
|
|
|
|||
|
|
@ -1,2 +1,2 @@
|
|||
const version = '2.1.15';
|
||||
const version = '2.2.0t';
|
||||
export { version };
|
||||
|
|
|
|||
|
|
@ -270,7 +270,7 @@ export default class TextModel extends BaseModel {
|
|||
*/
|
||||
private initTextFont() {
|
||||
const {
|
||||
fontWeight = '800',
|
||||
fontWeight = '400',
|
||||
fontFamily = 'sans-serif',
|
||||
} = this.layer.getLayerConfig() as IPointTextLayerStyleOptions;
|
||||
const data = this.layer.getEncodedData();
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ import * as React from 'react';
|
|||
import { createPortal } from 'react-dom';
|
||||
import { SceneContext } from './SceneContext';
|
||||
interface IPopupProps {
|
||||
option?: IPopupOption;
|
||||
option?: Partial<IPopupOption>;
|
||||
lnglat: number[];
|
||||
children?: React.ReactNode;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -32,10 +32,9 @@ export default class ZoomComponent extends React.Component {
|
|||
|
||||
layer
|
||||
.source(data)
|
||||
.size('name', [0, 10000, 50000, 30000, 100000])
|
||||
.color('#fff')
|
||||
.shape('name', 'text')
|
||||
.size(12)
|
||||
.size(16)
|
||||
.style({
|
||||
opacity: 1.0,
|
||||
});
|
||||
|
|
|
|||
|
|
@ -21,6 +21,9 @@ export default React.memo(function Map() {
|
|||
};
|
||||
fetchData();
|
||||
}, []);
|
||||
const popupClick = () => {
|
||||
alert('11333');
|
||||
};
|
||||
return (
|
||||
<>
|
||||
<AMapScene
|
||||
|
|
@ -38,11 +41,16 @@ export default React.memo(function Map() {
|
|||
bottom: 0,
|
||||
}}
|
||||
>
|
||||
<Popup lnglat={[110.1938, 50.25] as number[]}>
|
||||
<p>122222</p>
|
||||
<Popup
|
||||
option={{
|
||||
closeOnClick: false,
|
||||
}}
|
||||
lnglat={[110.1938, 50.25] as number[]}
|
||||
>
|
||||
<p onClick={popupClick}>122222</p>
|
||||
</Popup>
|
||||
<Marker lnglat={[110.1938, 30.25] as number[]}>
|
||||
<p>122222</p>
|
||||
<p onClick={popupClick}>122222</p>
|
||||
</Marker>
|
||||
<LineLayer
|
||||
key={'2'}
|
||||
|
|
|
|||
Loading…
Reference in New Issue