p90524618
/
antv-l7
mirror of https://gitee.com/antv-l7/antv-l7
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Merge pull request #425 from antvis/docs_udpdte 

Docs udpdte
This commit is contained in:
@thinkinggis 2020-07-03 20:26:47 +08:00 committed by GitHub
parent e462d3eafa 094b55be14
commit f4b2162956
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
44 changed files with 246 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.storybook/webpack.config.js
View File

@ -37,7 +37,7 @@ module.exports = ({ config }) => {
}
);
config.resolve.alias = {
'@antv/l7-district': path.resolve(__dirname, '../packages/boundry/src'),
'@antv/l7-district': path.resolve(__dirname, '../packages/boundary/src'),
}
config.resolve.extensions.push('.ts', '.tsx', 'css', '.js', '.glsl');

3
docs/api/component/markerLayer.en.md
View File

@ -40,7 +40,8 @@ scene.addMarkerLayer(markerLayer);
- field `string` 聚合统计字段
- method `sum| max| min| mean`
- element `function` 通过回调函数设置聚合 Marker 的样式，返回 dom 元素
参数：feature
回调函数包含以下参数
point_count 默认 聚合元素个数
clusterData `Array` 聚合节点的原始数据
point_sum 聚合求和 根据 field 和 method 计算

4
docs/api/component/markerLayer.zh.md
View File

@ -41,9 +41,7 @@ scene.addMarkerLayer(markerLayer);
- field `string` 聚合统计字段
- method `sum| max| min| mean`
- element `function` 通过回调函数设置聚合 Marker 的样式，返回 dom 元素
参数：feature
回调函数包含以下参数
- point_count 默认 聚合元素个数
- clusterData `Array` 聚合节点的原始数据
- point_sum 聚合求和 根据 field 和 method 计算

3
docs/api/district/baselayer.en.md
View File

@ -25,6 +25,7 @@ order: 2
对照表 `Array [string, string]` 第一个值为空间数据字段，第二个为传入数据字段名
- depth 数据显示层级 0：国家级，1:省级，2: 市级，3：线级
- showBorder `boolean` 是否显示国界线，默认显示，不建议不显示
- simplifyTolerance 数据抽稀容差,默认不抽稀 `boolean | number` 单位为度，一度约 111km，数字越大精度越低。参考设置数据 0.01
- label 标注配置项 支持常量，不支持数据映射
- enable `boolean` 是否显示标注
@ -92,6 +93,8 @@ District 提供 polygon 数据需要跟用户的属性数据，通过关系字
#### fillLayer
图层事件可以通过该属性进行设置
### 方法
#### updateData(data, joinBy)

6
docs/api/district/baselayer.zh.md
View File

@ -22,6 +22,7 @@ order: 2
- data `Array` 属性数据用于可视化渲染
- visible 地图是否可见
- joinBy 数据关联，属性数据如何内部空间数据关联绑定 目前支持 NAME_CHN,adcode 字段连接
- simplifyTolerance 数据抽稀容差,默认不抽稀 `boolean | number` 单位为度，一度约 111km，数字越大精度越低。参考设置数据 0.01
对照表 `Array [string, string]` 第一个值为空间数据字段，第二个为传入数据字段名
- depth 数据显示层级 0：国家级，1:省级，2: 市级，3：线级
- label 标注配置项 支持常量，不支持数据映射
@ -34,6 +35,9 @@ order: 2
- strokeWidth 文字描边宽度
- textAllowOverlap 是否允许文字压盖
- opacity 标注透明度
- spacing: `number` 文本包围盒 padding [水平，垂直]，影响碰撞检测结果，避免相邻文本靠的太近
- padding: `[number, number]` 文本相对锚点的偏移量 [x, y]
其他包括 text [style 的配置](../layer/point_layer/text#style)
- fill 填充配置项 支持数据映射
- color 图层填充颜色，支持常量和数据映射
@ -94,6 +98,8 @@ District 提供 polygon 数据需要跟用户的属性数据，通过关系字
#### fillLayer
图层事件可以通过该属性进行设置
### 方法
#### updateData(data, joinBy)

3
docs/api/district/drilldown.en.md
View File

@ -70,6 +70,9 @@ DrillDownLayer 提供默认提供通过 Layer 的交互事件，实现上钻下
- strokeWidth `number` 描边宽度 `2`
- textAllowOverlap: `boolean` 文字是否允许压盖 `true`
- opacity `number` 透明度 `1`
- spacing: `number` 文本包围盒 padding [水平，垂直]，影响碰撞检测结果，避免相邻文本靠的太近
- padding: `[number, number]` 文本相对锚点的偏移量 [x, y]
其他包括 text [style 的配置](../layer/point_layer/text#style)
#### bubbleOption

16
docs/api/layer/point_layer/text.zh.md
View File

@ -27,7 +27,21 @@ layer.shape('name','text')
### style
- opacity `number`
- textAnchor `string` 文本相对锚点的位置 center|left|right|top|bottom|top-left
- textAnchor `string` 文本相对锚点的位置
`'right'
| 'top-right'
| 'left'
| 'bottom-right'
| 'left'
| 'top-left'
| 'bottom-left'
| 'bottom'
| 'bottom-right'
| 'bottom-left'
| 'top'
| 'top-right'
| 'top-left'
| 'center';`
- spacing: `number` 文本包围盒 padding [水平，垂直]，影响碰撞检测结果，避免相邻文本靠的太近
- padding: `[number, number]` 文本相对锚点的偏移量 [x, y]
- stroke: `string`; 描边颜色

7
examples/district/basic/API.en.md
View File

@ -44,6 +44,7 @@ District 支持下面几种图
对照表 `Array [string, string]` 第一个值为空间数据字段，第二个为传入数据字段名
- depth 数据显示层级 0：国家级，1:省级，2: 市级，3：线级
- showBorder `boolean` 是否显示国界线，默认显示，不建议不显示
- simplifyTolerance 数据抽稀容差,默认不抽稀 `boolean | number` 单位为度，一度约111km，数字越大精度越低。参考设置数据 0.01
- label 标注配置项 支持常量，不支持数据映射
- enable `boolean` 是否显示标注
- color 标注字体颜色 常量
@ -53,6 +54,9 @@ District 支持下面几种图
- strokeWidth 文字描边宽度
- textAllowOverlap 是否允许文字压盖
- opacity 标注透明度
- spacing: `number` 文本包围盒 padding [水平，垂直]，影响碰撞检测结果，避免相邻文本靠的太近
- padding: `[number, number]` 文本相对锚点的偏移量 [x, y]
其他包括 text [style 的配置](../layer/point_layer/text#style)
- fill 填充配置项 支持数据映射
- color 图层填充颜色，支持常量和数据映射
常量：统一设置成一样的颜色
@ -67,6 +71,7 @@ District 支持下面几种图
- size 气泡大小 支持常量、数据映射
- shape 气泡形状 支持常量、数据映射
- style 气泡图样式 同 PointLayer
- stroke 填充描边颜色
- strokeWidth 填充描边宽度
- autoFit 是否自动缩放到图层范围 `boolean`
@ -102,6 +107,8 @@ District 提供polygon数据需要跟用户的属性数据，通过关系字段
行政区划组件每个图层有多个子图层组成，如标注层，国界线、省界线等等，
#### fillLayer
图层事件可以通过该属性进行设置
### 方法

5
examples/district/basic/API.zh.md
View File

@ -41,6 +41,7 @@ District 支持下面几种图
- joinBy 数据关联，属性数据如何内部空间数据关联绑定 目前支持 NAME_CHN,adcode 字段连接
对照表 `Array [string, string]` 第一个值为空间数据字段，第二个为传入数据字段名
- showBorder `boolean` 是否显示国界线，默认显示，不建议不显示
- simplifyTolerance 数据抽稀容差,默认不抽稀 `boolean | number` 单位为度，一度约111km，数字越大精度越低。参考设置数据 0.01
- depth 数据显示层级 0：国家级，1:省级，2: 市级，3：线级
- label 标注配置项 支持常量，不支持数据映射
- enable `boolean` 是否显示标注
@ -51,6 +52,9 @@ District 支持下面几种图
- strokeWidth 文字描边宽度
- textAllowOverlap 是否允许文字压盖
- opacity 标注透明度
- spacing: `number` 文本包围盒 padding [水平，垂直]，影响碰撞检测结果，避免相邻文本靠的太近
- padding: `[number, number]` 文本相对锚点的偏移量 [x, y]
其他包括 text [style 的配置](../layer/point_layer/text#style)
- fill 填充配置项 支持数据映射
- color 图层填充颜色，支持常量和数据映射
常量：统一设置成一样的颜色
@ -111,6 +115,7 @@ District 提供polygon数据需要跟用户的属性数据，通过关系字段
行政区划组件每个图层有多个子图层组成，如标注层，国界线、省界线等等，
#### fillLayer
图层事件可以通过该属性进行设置
### 方法

2
gatsby-node.js
View File

@ -21,6 +21,6 @@ exports.onCreateWebpackConfig = ({ getConfig }) => {
'@antv/l7-utils': path.resolve(__dirname, 'packages/utils/src'),
'@antv/l7-react': path.resolve(__dirname, 'packages/react/src'),
'@antv/l7-draw': path.resolve(__dirname, 'packages/draw/src'),
'@antv/l7-district': path.resolve(__dirname, 'packages/boundry/src')
'@antv/l7-district': path.resolve(__dirname, 'packages/boundary/src')
};
};

0
packages/boundry/README.md → packages/boundary/README.md
View File

0
packages/boundry/__tests__/layer.spec.ts → packages/boundary/__tests__/layer.spec.ts
View File

3
packages/boundry/package.json → packages/boundary/package.json
View File

@ -44,7 +44,8 @@
"eventemitter3": "^4.0.0",
"geobuf": "^3.0.1",
"lodash": "^4.6.2",
"pbf": "^3.2.1"
"pbf": "^3.2.1",
"simplify-geojson": "^1.0.3"
},
"bugs": {
"url": "https://github.com/antvis/L7/issues"

0
packages/boundry/rollup.config.js → packages/boundary/rollup.config.js
View File

0
packages/boundry/src/config.ts → packages/boundary/src/config.ts
View File

0
packages/boundry/src/index.ts → packages/boundary/src/index.ts
View File

26
packages/boundry/src/layer/baseLayer.ts → packages/boundary/src/layer/baseLayer.ts
View File

@ -17,6 +17,8 @@ import isObject from 'lodash/isObject';
import mergeWith from 'lodash/mergeWith';
// @ts-ignore
import Pbf from 'pbf';
// @ts-ignore
import simplify from 'simplify-geojson';
import { setDataLevel } from '../config';
import { AttributeType, IDistrictLayerOption } from './interface';
@ -89,7 +91,10 @@ export default class BaseLayer extends EventEmitter {
protected async fetchData(data: { url: any; type: string }) {
if (data.type === 'pbf') {
const buffer = await (await fetch(data.url)).arrayBuffer();
const geojson = geobuf.decode(new Pbf(buffer));
let geojson = geobuf.decode(new Pbf(buffer));
if (this.options.simplifyTolerance !== false) {
geojson = simplify(geojson, this.options.simplifyTolerance);
}
return geojson;
} else {
return isObject(data.url) ? data.url : (await fetch(data.url)).json();
@ -103,15 +108,18 @@ export default class BaseLayer extends EventEmitter {
depth: 1,
adcode: [],
joinBy: ['name', 'name'],
simplifyTolerance: false,
label: {
enable: true,
color: '#000',
field: 'name',
size: 8,
size: 10,
stroke: '#fff',
strokeWidth: 2,
textAllowOverlap: true,
opacity: 1,
textOffset: [0, 0],
padding: [5, 5],
},
bubble: {
enable: false,
@ -285,7 +293,7 @@ export default class BaseLayer extends EventEmitter {
protected addLabel(labelData: any, type: string = 'json') {
const { label, zIndex, visible } = this.options;
const labelLayer = new PointLayer({
zIndex: zIndex + 0.4,
zIndex: zIndex + 5,
visible,
})
.source(labelData, {
@ -294,16 +302,10 @@ export default class BaseLayer extends EventEmitter {
coordinates: 'center',
},
})
.color(label.color as StyleAttrField)
.shape(label.field as StyleAttrField, 'text')
.size(10)
.style({
opacity: label.opacity,
stroke: label.stroke,
strokeWidth: label.strokeWidth,
textAllowOverlap: label.textAllowOverlap,
});
.style(label);
this.setLayerAttribute(labelLayer, 'color', label.color as AttributeType);
this.setLayerAttribute(labelLayer, 'size', label.size as AttributeType);
this.setLayerAttribute(labelLayer, 'filter', label.filter);
return labelLayer;
}

0
packages/boundry/src/layer/city.ts → packages/boundary/src/layer/city.ts
View File

19
packages/boundry/src/layer/country.ts → packages/boundary/src/layer/country.ts
View File

@ -1,4 +1,4 @@
import { LineLayer, PointLayer, Scene, StyleAttrField } from '@antv/l7';
import { AttributeType, LineLayer, PointLayer, Scene } from '@antv/l7';
import { getDataConfig } from '../index';
import BaseLayer from './baseLayer';
import { IDistrictLayerOption } from './interface';
@ -14,13 +14,12 @@ export default class CountryLayer extends BaseLayer {
];
if (showBorder) {
this.addProvinceLine(countryConfig.provinceLine);
}
if (depth === 2 * 1) {
this.addCityBorder(countryConfig.fill);
}
if (depth === 3 * 1) {
this.addCountyBorder(countryConfig.fill);
if (depth === 2 * 1) {
this.addCityBorder(countryConfig.fill);
}
if (depth === 3 * 1) {
this.addCountyBorder(countryConfig.fill);
}
}
}
protected async addProvinceFill() {
@ -264,9 +263,9 @@ export default class CountryLayer extends BaseLayer {
coordinates: 'center',
},
})
.color(label.color as StyleAttrField)
.color(label.color as AttributeType)
.shape('name', 'text')
.size(10)
.size(label.size as AttributeType)
.style({
opacity: label.opacity,
stroke: label.stroke,

0
packages/boundry/src/layer/county.ts → packages/boundary/src/layer/county.ts
View File

0
packages/boundry/src/layer/drillDown.ts → packages/boundary/src/layer/drillDown.ts
View File

26
packages/boundry/src/layer/interface.ts → packages/boundary/src/layer/interface.ts
View File

@ -4,14 +4,35 @@ import {
StyleAttributeField,
StyleAttributeOption,
} from '@antv/l7';
export type anchorType =
| 'right'
| 'top-right'
| 'left'
| 'bottom-right'
| 'left'
| 'top-left'
| 'bottom-left'
| 'bottom'
| 'bottom-right'
| 'bottom-left'
| 'top'
| 'top-right'
| 'top-left'
| 'center';
export interface ILabelOption {
enable: boolean;
color: string;
color: AttributeType;
field: string;
size: number;
size: AttributeType;
stroke: string;
strokeWidth: number;
textAllowOverlap: boolean;
padding: [number, number];
strokeOpacity: number;
fontWeight: number;
spacing: number;
textAnchor: anchorType;
textOffset: [number, number];
opacity: number;
filter: AttributeType;
}
@ -81,6 +102,7 @@ export interface IDistrictLayerOption {
data?: Array<{ [key: string]: any }>;
joinBy: [string, string];
adcode: adcodeType;
simplifyTolerance: number | boolean;
depth: 0 | 1 | 2 | 3;
label: Partial<ILabelOption>;
bubble: Partial<IBubbleOption>;

8
packages/boundry/src/layer/province.ts → packages/boundary/src/layer/province.ts
View File

@ -102,7 +102,8 @@ export default class ProvinceLayer extends BaseLayer {
return features;
}
private async addProvinceFillLayer() {
const { depth, adcode, label } = this.options as IProvinceLayerOption;
const { depth, adcode, label, showBorder } = this
.options as IProvinceLayerOption;
const countryConfig = getDataConfig(this.options.geoDataLevel).country.CHN[
depth
];
@ -115,6 +116,7 @@ export default class ProvinceLayer extends BaseLayer {
};
});
const data = this.filterData(fillData, adcode);
this.fillData = data;
const labelData = this.filterLabelData(this.labelRawData, adcode);
this.fillRawData = fillData;
this.addFillLayer(data);
@ -122,7 +124,9 @@ export default class ProvinceLayer extends BaseLayer {
this.addLabelLayer(labelData);
}
this.lineRawData = fillData;
this.addFillLine(data);
if (showBorder) {
this.addFillLine(data);
}
}
private async addProvinceLineLayer() {

0
packages/boundry/src/layer/world.ts → packages/boundary/src/layer/world.ts
View File

0
packages/boundry/tsconfig.build.json → packages/boundary/tsconfig.build.json
View File

1
packages/core/src/services/layer/ILayerService.ts
View File

@ -82,6 +82,7 @@ export interface ILayer {
zIndex: number;
plugins: ILayerPlugin[];
layerModelNeedUpdate: boolean;
styleNeedUpdate: boolean;
layerModel: ILayerModel;
dataState: IDataState; // 数据流状态
pickedFeatureID: number | null;

2
packages/layers/src/core/BaseLayer.ts
View File

@ -70,6 +70,7 @@ export default class BaseLayer<ChildLayerStyleOptions = {}> extends EventEmitter
public layerModelNeedUpdate: boolean = false;
public pickedFeatureID: number | null = null;
public selectedFeatureID: number | null = null;
public styleNeedUpdate: boolean = false;
public dataState: IDataState = {
dataSourceNeedUpdate: false,
@ -469,6 +470,7 @@ export default class BaseLayer<ChildLayerStyleOptions = {}> extends EventEmitter
if (this.container) {
this.updateLayerConfig(this.rawConfig);
this.styleNeedUpdate = true;
}
return this;
}

1
packages/layers/src/core/triangulation.ts
View File

@ -87,7 +87,6 @@ export function polygonTriangulation(feature: IEncodeFeature) {
const { coordinates } = feature;
const flattengeo = earcut.flatten(coordinates as number[][][]);
const { vertices, dimensions, holes } = flattengeo;
return {
indices: earcut(vertices, holes, dimensions),
vertices,

40
packages/layers/src/heatmap/models/heatmap.ts
View File

@ -45,6 +45,9 @@ export default class HeatMapModel extends BaseModel {
});
this.drawIntensityMode();
});
if (this.layer.styleNeedUpdate) {
this.updateColorTexture();
}
this.shapeType === 'heatmap' ? this.drawColorMode() : this.draw3DHeatMap();
}
@ -92,17 +95,7 @@ export default class HeatMapModel extends BaseModel {
depth: false,
});
// 初始化颜色纹理
this.colorTexture = createTexture2D({
data: new Uint8Array(imageData.data),
width: imageData.width,
height: imageData.height,
wrapS: gl.CLAMP_TO_EDGE,
wrapT: gl.CLAMP_TO_EDGE,
min: gl.NEAREST,
mag: gl.NEAREST,
flipY: false,
});
this.updateColorTexture();
return [this.intensityModel, this.colorModel];
}
@ -335,4 +328,29 @@ export default class HeatMapModel extends BaseModel {
}),
});
}
private updateStyle() {
this.updateColorTexture();
}
private updateColorTexture() {
const { createTexture2D } = this.rendererService;
if (this.texture) {
this.texture.destroy();
}
const {
rampColors,
} = this.layer.getLayerConfig() as IHeatMapLayerStyleOptions;
const imageData = generateColorRamp(rampColors as IColorRamp);
this.colorTexture = createTexture2D({
data: new Uint8Array(imageData.data),
width: imageData.width,
height: imageData.height,
wrapS: gl.CLAMP_TO_EDGE,
wrapT: gl.CLAMP_TO_EDGE,
min: gl.NEAREST,
mag: gl.NEAREST,
flipY: false,
});
}
}

11
packages/layers/src/line/models/line.ts
View File

@ -49,6 +49,7 @@ export default class LineModel extends BaseModel {
fragmentShader: line_frag,
triangulation: LineTriangulation,
blend: this.getBlend(),
depth: { enable: false },
}),
];
}
@ -66,7 +67,7 @@ export default class LineModel extends BaseModel {
name: 'a_Distance',
buffer: {
// give the WebGL driver a hint that this buffer may change
usage: gl.DYNAMIC_DRAW,
usage: gl.STATIC_DRAW,
data: [],
type: gl.FLOAT,
},
@ -88,7 +89,7 @@ export default class LineModel extends BaseModel {
name: 'a_Total_Distance',
buffer: {
// give the WebGL driver a hint that this buffer may change
usage: gl.DYNAMIC_DRAW,
usage: gl.STATIC_DRAW,
data: [],
type: gl.FLOAT,
},
@ -123,9 +124,7 @@ export default class LineModel extends BaseModel {
attributeIdx: number,
) => {
const { size = 1 } = feature;
return Array.isArray(size)
? [size[0], size[1] + this.layer.zIndex]
: [size as number, this.layer.zIndex];
return Array.isArray(size) ? [size[0], size[1]] : [size as number, 0];
},
},
});
@ -162,7 +161,7 @@ export default class LineModel extends BaseModel {
name: 'a_Miter',
buffer: {
// give the WebGL driver a hint that this buffer may change
usage: gl.DYNAMIC_DRAW,
usage: gl.STATIC_DRAW,
data: [],
type: gl.FLOAT,
},

4
packages/layers/src/line/shaders/line_frag.glsl
View File

@ -24,8 +24,8 @@ uniform vec4 u_aimate: [ 0, 2., 1.0, 0.2 ];
void main() {
gl_FragColor = v_color;
// anti-alias
// float blur = 1.- smoothstep(u_blur, 1., length(v_normal.xy));
gl_FragColor.a *= u_opacity;
float blur = 1.- smoothstep(u_blur, 1., length(v_normal.xy));
gl_FragColor.a *= u_opacity * blur ;
if(u_aimate.x == Animate) {
float alpha =1.0 - fract( mod(1.0- v_distance_ratio, u_aimate.z)* (1.0/ u_aimate.z) + u_time / u_aimate.y);

1
packages/layers/src/plugins/LayerModelPlugin.ts
View File

@ -11,6 +11,7 @@ export default class LayerModelPlugin implements ILayerPlugin {
layer.prepareBuildModel();
// 初始化 Model
layer.buildModels();
layer.styleNeedUpdate = false;
});
layer.hooks.beforeRenderData.tap('DataSourcePlugin', () => {

3
packages/layers/src/point/models/text.ts
View File

@ -14,6 +14,7 @@ import BaseModel from '../../core/BaseModel';
import CollisionIndex from '../../utils/collision-index';
import { calculteCentroid } from '../../utils/geo';
import {
anchorType,
getGlyphQuads,
IGlyphQuad,
shapeText,
@ -22,7 +23,7 @@ import textFrag from '../shaders/text_frag.glsl';
import textVert from '../shaders/text_vert.glsl';
interface IPointTextLayerStyleOptions {
opacity: number;
textAnchor: string;
textAnchor: anchorType;
spacing: number;
padding: [number, number];
stroke: string;

24
packages/layers/src/utils/symbol-layout.ts
View File

@ -1,7 +1,24 @@
import { type } from 'os';
interface IPoint {
x: number;
y: number;
}
export type anchorType =
| 'right'
| 'top-right'
| 'left'
| 'bottom-right'
| 'left'
| 'top-left'
| 'bottom-left'
| 'bottom'
| 'bottom-right'
| 'bottom-left'
| 'top'
| 'top-right'
| 'top-left'
| 'center';
export interface IGlyphQuad {
tr: IPoint;
tl: IPoint;
@ -22,10 +39,9 @@ export interface IGlyphQuad {
* @param {string} anchor 锚点位置
* @return {alignment} alignment
*/
function getAnchorAlignment(anchor: string) {
function getAnchorAlignment(anchor: anchorType) {
let horizontalAlign = 0.5;
let verticalAlign = 0.5;
switch (anchor) {
case 'right':
case 'top-right':
@ -109,7 +125,7 @@ function shapeLines(
glyphMap: any,
lines: any[],
lineHeight: number,
textAnchor: string,
textAnchor: anchorType,
textJustify: string,
spacing: number,
) {
@ -197,7 +213,7 @@ export function shapeText(
text: string,
glyphs: any,
lineHeight: number,
textAnchor: string,
textAnchor: anchorType,
textJustify: string,
spacing: number,
translate: [number, number] = [0, 0],

2
packages/source/__tests__/parser/geojson.spec.ts
View File

@ -9,7 +9,7 @@ describe('parser.geojson', () => {
});
it('parser multiPolygon', () => {
const result = geojson(multiPolygon);
expect(result.dataArray.length).toEqual(11);
expect(result.dataArray.length).toEqual(1);
expect(result.dataArray[0]._id).toEqual(0);
});
it('parset multiLine', () => {

2
packages/source/src/parser/geojson.ts
View File

@ -48,7 +48,7 @@ export default function geoJSON(
(currentFeature: Feature<Geometries, Properties>, featureIndex: number) => {
const coord = getCoords(currentFeature);
const id = featureIndex;
if (currentFeature.geometry.type === 'Polygon') {
if (currentFeature.geometry.type === 'MultiPolygon') {
coord.forEach((coor) => {
const dataItem = {
...currentFeature.properties,

38
stories/District/Layer/Country.tsx
View File

@ -1,4 +1,4 @@
import { LineLayer, Scene } from '@antv/l7';
import { LineLayer, PolygonLayer, Scene } from '@antv/l7';
import { CountryLayer } from '@antv/l7-district';
import { GaodeMap, Mapbox } from '@antv/l7-maps';
import * as React from 'react';
@ -20,7 +20,7 @@ export default class Country extends React.Component {
style: 'blank',
zoom: 3,
minZoom: 0,
maxZoom: 10,
maxZoom: 15,
}),
});
const ProvinceData = [
@ -199,14 +199,16 @@ export default class Country extends React.Component {
const Layer = new CountryLayer(scene, {
visible: true,
data: ProvinceData,
geoDataLevel: 1,
geoDataLevel: 2,
joinBy: ['NAME_CHN', 'name'],
showBorder: false,
// label: {
// field: 'NAME_CHN',
// textAllowOverlap: true,
// },
depth: 1,
label: {
field: 'name',
size: 10,
padding: [5, 5],
textAllowOverlap: true,
},
depth: 2,
fill: {
color: {
field: 'NAME_CHN',
@ -230,7 +232,7 @@ export default class Country extends React.Component {
Layer.on('loaded', () => {
const filldata = Layer.getFillData();
const border = new LineLayer({
zIndex: 3, // 设置显示层级
zIndex: 5, // 设置显示层级
})
.source(filldata)
.shape('line')
@ -240,29 +242,23 @@ export default class Country extends React.Component {
opacity: 1,
});
const hightLayer = new LineLayer({
zIndex: 7, // 设置显示层级
zIndex: 4, // 设置显示层级
name: 'line3',
})
.source({
type: 'FeatureCollection',
features: [],
})
.source(filldata)
.shape('line')
.size(0.6)
.size(1.2)
.color('#000')
.style({
opacity: 1,
});
const hightLayer2 = new LineLayer({
zIndex: 6, // 设置显示层级
zIndex: 3, // 设置显示层级
name: 'line3',
})
.source({
type: 'FeatureCollection',
features: [],
})
.source(filldata)
.shape('line')
.size(2)
.size(2.4)
.color('#fff')
.style({
opacity: 1,

1
stories/District/Layer/country_city.tsx
View File

@ -28,6 +28,7 @@ export default class Country extends React.Component {
data: [],
geoDataLevel: 2,
depth: 2,
showBorder: false,
provinceStroke: '#783D2D',
cityStroke: '#EBCCB4',
coastlineWidth: 0.5,

1
stories/District/Layer/province.tsx
View File

@ -222,6 +222,7 @@ export default class Country extends React.Component {
adcode: ['330000'],
stroke: '#7096B3',
depth: 2,
showBorder: false,
label: {
enable: false,
},

1
stories/District/Layer/world.tsx
View File

@ -46,6 +46,7 @@ export default class Country extends React.Component {
enable: true,
textAllowOverlap: false,
field: 'NAME_ENG',
padding: [5, 5],
},
popup: {
enable: true,

23
stories/Layers/components/heatmap2.tsx
View File

@ -27,7 +27,9 @@ export default class HeatMapLayerDemo extends React.Component {
)
.then((res) => res.json())
.then((data) => {
const layer = new HeatmapLayer({})
const layer = new HeatmapLayer({
autoFit: true,
})
.source(data, {
parser: {
type: 'json',
@ -36,7 +38,7 @@ export default class HeatMapLayerDemo extends React.Component {
},
})
.size('count', [0, 1])
.shape('heatmap3D')
.shape('heatmap')
// weight映射通道
.style({
intensity: 10,
@ -55,6 +57,23 @@ export default class HeatMapLayerDemo extends React.Component {
},
});
scene.addLayer(layer);
setTimeout(() => {
layer.style({
rampColors: {
colors: [
'#fee5d9',
'#fcbba1',
'#fc9272',
'#fb6a4a',
'#de2d26',
'#a50f15',
],
positions: [0, 0.2, 0.4, 0.6, 0.8, 1.0],
},
});
scene.render();
console.log('更新完成');
}, 2000);
});
});

20
stories/Layers/components/polygon.tsx
View File

@ -133,14 +133,18 @@ export default class TextLayerDemo extends React.Component {
})
.size('childrenNum', [10, 100000000])
// .color('red')
.color('childrenNum', [
'#D92568',
'#E3507E',
'#FC7AAB',
'#F1D3E5',
'#A7B5E3',
'#F2EEFF',
])
// .color('childrenNum', [
// '#D92568',
// '#E3507E',
// '#FC7AAB',
// '#F1D3E5',
// '#A7B5E3',
// '#F2EEFF',
// ])
.color('childrenNum*name', (childrenNum, name) => {
console.log(childrenNum, name);
return 'red';
})
.style({
opacity: 1.0,
});

2
tsconfig.json
View File

@ -17,7 +17,7 @@
"rootDir": "./",
"baseUrl": "./",
"paths": {
"@antv/l7-district": ["packages/boundry/src"],
"@antv/l7-district": ["packages/boundary/src"],
"@antv/l7-*": ["packages/*/src"],
"@antv/l7": ["packages/l7/src"],
"*": ["node_modules", "packages", "typings/*"]

30
yarn.lock
View File

@ -8667,6 +8667,15 @@ concat-stream@^2.0.0, concat-stream@~2.0.0:
readable-stream "^3.0.2"
typedarray "^0.0.6"
concat-stream@~1.4.1:
version "1.4.11"
resolved "https://registry.npmjs.org/concat-stream/-/concat-stream-1.4.11.tgz#1dc9f666f2621da9c618b1e7f8f3b2ff70b5f76f"
integrity sha512-X3JMh8+4je3U1cQpG87+f9lXHDrqcb2MVLg9L7o8b1UZ0DzhRrUpdn65ttzu10PpJPPI3MQNkis+oha6TSA9Mw==
dependencies:
inherits "~2.0.1"
readable-stream "~1.1.9"
typedarray "~0.0.5"
concat-with-sourcemaps@^1.1.0:
version "1.1.0"
resolved "https://registry.npmjs.org/concat-with-sourcemaps/-/concat-with-sourcemaps-1.1.0.tgz#d4ea93f05ae25790951b99e7b3b09e3908a4082e"
@ -17811,6 +17820,11 @@ minimist@0.0.5:
resolved "https://registry.npmjs.org/minimist/-/minimist-0.0.5.tgz#d7aa327bcecf518f9106ac6b8f003fa3bcea8566"
integrity sha1-16oye87PUY+RBqxrjwA/o7zqhWY=
minimist@0.0.7:
version "0.0.7"
resolved "https://registry.npmjs.org/minimist/-/minimist-0.0.7.tgz#dc4c620253c542eda0d2eb91c3c6a971a11e63e7"
integrity sha1-3ExiAlPFQu2g0uuRw8apcaEeY+c=
minimist@1.2.5, minimist@^1.1.0, minimist@^1.1.1, minimist@^1.1.3, minimist@^1.2.0, minimist@^1.2.5, minimist@~1.2.0:
version "1.2.5"
resolved "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz#67d66014b66a6a8aaa0c083c5fd58df4e4e97602"
@ -23769,6 +23783,20 @@ simplebar@^4.2.3:
lodash.throttle "^4.1.1"
resize-observer-polyfill "^1.5.1"
simplify-geojson@^1.0.3:
version "1.0.3"
resolved "https://registry.npmjs.org/simplify-geojson/-/simplify-geojson-1.0.3.tgz#4f9ed4f0f62be86d38526bcdcae072b0e9df5ef4"
integrity sha1-T57U8PYr6G04UmvNyuBysOnfXvQ=
dependencies:
concat-stream "~1.4.1"
minimist "0.0.7"
simplify-geometry "0.0.2"
simplify-geometry@0.0.2:
version "0.0.2"
resolved "https://registry.npmjs.org/simplify-geometry/-/simplify-geometry-0.0.2.tgz#63797e676eae96835ace02bcd27d3e1af544f49c"
integrity sha1-Y3l+Z26uloNazgK80n0+GvVE9Jw=
single-line-log@^1.1.2:
version "1.1.2"
resolved "https://registry.npmjs.org/single-line-log/-/single-line-log-1.1.2.tgz#c2f83f273a3e1a16edb0995661da0ed5ef033364"
@ -25830,7 +25858,7 @@ typedarray-to-buffer@^3.1.5:
dependencies:
is-typedarray "^1.0.0"
typedarray@^0.0.6:
typedarray@^0.0.6, typedarray@~0.0.5:
version "0.0.6"
resolved "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=