Merge pull request #416 from antvis/ditsrict_filter

fix(boundry): option merge
This commit is contained in:
@thinkinggis 2020-06-24 16:50:52 +08:00 committed by GitHub
commit 73af72ed33
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 115 additions and 99 deletions

View File

@ -1,9 +1,34 @@
import BaseLayer from '../src/layer/baseLayer';
// import { WorldLayer } from '@antv/l7-district';
describe('baseLayer', () => {
it('set option', () => {
const option = {
adcode: [],
data: [
{
name: 1,
code: 2,
},
{
name: 2,
code: 3,
},
{
name: 3,
code: 4,
},
],
};
// const layer = new BaseLayer(null, option);
// @ts-ignore
// const layer = new WorldLayer(null, option);
// layer.setOption({
// data: [
// {
// name: 1,
// code: 4,
// },
// ],
// });
// // @ts-ignore
// expect(layer.options.data.length).toBe(1);
});
});

View File

@ -7,7 +7,7 @@ const dataLevel2: { [key: string]: any } = {
fill: {
type: 'pbf',
url:
'https://gw.alipayobjects.com/os/bmw-prod/c95e3e43-d68b-4144-b366-3977ca64a822.bin',
'https://gw.alipayobjects.com/os/bmw-prod/ad26cd25-96ea-40fd-935d-7e21a5c08893.bin',
},
line: {
type: 'pbf',
@ -127,7 +127,7 @@ const dataLevel1: { [key: string]: any } = {
fill: {
type: 'pbf',
url:
'//gw.alipayobjects.com/os/bmw-prod/56cb34eb-cf61-4512-a6f3-fe4a45a7b1a3.bin',
'https://gw.alipayobjects.com/os/bmw-prod/56cb34eb-cf61-4512-a6f3-fe4a45a7b1a3.bin',
},
line: {
type: 'pbf',
@ -154,7 +154,7 @@ const dataLevel1: { [key: string]: any } = {
fill: {
type: 'pbf',
url:
'//gw.alipayobjects.com/os/bmw-prod/70ec087e-c48a-4b76-8825-6452f17bae7a.bin',
'https://gw.alipayobjects.com/os/bmw-prod/1d03a9af-1df4-407f-8bae-3638a1e0ad65.bin',
},
line: {
type: 'pbf',

View File

@ -56,7 +56,7 @@ export default class BaseLayer extends EventEmitter {
}
public setOption(newOption: { [key: string]: any }) {
this.options = mergeWith(this.options, newOption);
this.options = mergeWith(this.options, newOption, mergeCustomizer);
}
public updateData(
@ -296,6 +296,8 @@ export default class BaseLayer extends EventEmitter {
strokeWidth: label.strokeWidth,
textAllowOverlap: label.textAllowOverlap,
});
this.setLayerAttribute(labelLayer, 'filter', label.filter);
return labelLayer;
}
@ -333,7 +335,7 @@ export default class BaseLayer extends EventEmitter {
private setLayerAttribute(
layer: ILayer,
type: 'color' | 'size' | 'shape' | 'filter',
attr: AttributeType,
attr: AttributeType | undefined,
) {
if (!attr) {
return;

View File

@ -13,6 +13,7 @@ export interface ILabelOption {
strokeWidth: number;
textAllowOverlap: boolean;
opacity: number;
filter: AttributeType;
}
export interface IAttributeOption {

View File

@ -96,7 +96,7 @@ export default class ProvinceLayer extends BaseLayer {
return features;
}
private async addProvinceFillLayer() {
const { depth, adcode } = this.options as IProvinceLayerOption;
const { depth, adcode, label } = this.options as IProvinceLayerOption;
const countryConfig = getDataConfig(this.options.geoDataLevel).country.CHN[
depth
];
@ -112,7 +112,9 @@ export default class ProvinceLayer extends BaseLayer {
const labelData = this.filterLabelData(this.labelRawData, adcode);
this.fillRawData = fillData;
this.addFillLayer(data);
this.addLabelLayer(labelData);
if (label.enable) {
this.addLabelLayer(labelData);
}
this.lineRawData = fillData;
this.addFillLine(data);
}

View File

@ -18,6 +18,10 @@ import {
} from './IStyleAttributeService';
import StyleAttribute from './StyleAttribute';
function sleep(ms: number) {
return new Promise((resolve) => setTimeout(resolve, ms));
}
const bytesPerElementMap = {
[gl.FLOAT]: 4,
[gl.UNSIGNED_BYTE]: 1,
@ -225,18 +229,21 @@ export default class StyleAttributeService implements IStyleAttributeService {
normals.push(normal);
});
}
// if (featureIdx % 500 === 0) {
// await sleep(100);
// }
size = vertexSize;
const verticesNumForCurrentFeature =
verticesForCurrentFeature.length / vertexSize;
// 记录三角化结果,用于后续精确更新指定 feature
this.featureLayout.sizePerElement = size;
this.featureLayout.elements.push({
featureIdx,
vertices: verticesForCurrentFeature,
normals: normalsForCurrentFeature as number[],
offset: verticesNum,
});
// this.featureLayout.sizePerElement = size;
// this.featureLayout.elements.push({
// featureIdx,
// vertices: verticesForCurrentFeature,
// normals: normalsForCurrentFeature as number[],
// offset: verticesNum,
// });
verticesNum += verticesNumForCurrentFeature;
// 根据 position 顶点生成其他顶点数据

View File

@ -217,15 +217,14 @@ export default class Country extends React.Component {
const { province } = this.state;
this.provinceLayer = new ProvinceLayer(scene, {
data,
geoDataLevel: 1,
joinBy: ['adcode', 'code'],
adcode: ['330000'],
depth: 3,
depth: 2,
label: {
field: 'NAME_CHN',
textAllowOverlap: false,
enable: false,
},
bubble: {
enable: true,
fill: {
color: {
field: 'NAME_CHN',
values: [
@ -239,7 +238,7 @@ export default class Country extends React.Component {
},
},
popup: {
enable: true,
enable: false,
Html: (props) => {
return `<span>${props.NAME_CHN}:</span><span>${props.pop}</span>`;
},

View File

@ -26,10 +26,11 @@ export default class Country extends React.Component {
scene.on('loaded', () => {
const Layer = new WorldLayer(scene, {
data: [],
geoDataLevel: 2,
joinBy: ['SOC', 'SOC'],
fill: {
color: {
field: 'value',
field: 'NAME_CHN',
values: [
'#feedde',
'#fdd0a2',
@ -39,12 +40,6 @@ export default class Country extends React.Component {
'#a63603',
],
},
filter: {
field: 'NAME_CHN',
values: (v: any) => {
return v.length > 5;
},
},
},
stroke: '#ccc',
label: {
@ -59,24 +54,9 @@ export default class Country extends React.Component {
},
},
});
console.time('layer');
Layer.on('loaded', () => {
Layer.updateData(
[
{
SOC: 'CHN',
value: 3000,
},
{
SOC: 'CAN',
value: 5000,
},
{
SOC: 'RUS',
value: 4000,
},
],
['SOC', 'SOC'],
);
console.timeEnd('layer');
});
});
this.scene = scene;

View File

@ -9,7 +9,7 @@ import CountryCity from './Layer/country_city';
import CountryCounty from './Layer/country_county';
// import County from './Layer/county';
import DrillDown from './Layer/drillDown';
// import Province from './Layer/province';
import Province from './Layer/province';
import World from './Layer/world';
storiesOf('行政区划', module)
@ -21,5 +21,5 @@ storiesOf('行政区划', module)
.add('中国地图附图', () => <Country2 />)
// .add('县级地图', () => <County />)
// .add('市级地图', () => <City />)
.add('上钻下取', () => <DrillDown />);
// .add('省级地图', () => <Province />);
.add('上钻下取', () => <DrillDown />)
.add('省级地图', () => <Province />);

100
yarn.lock
View File

@ -5980,56 +5980,6 @@ ansicolors@~0.2.1:
resolved "https://registry.npmjs.org/ansicolors/-/ansicolors-0.2.1.tgz#be089599097b74a5c9c4a84a0cdbcdb62bd87aef"
integrity sha1-vgiVmQl7dKXJxKhKDNvNtivYeu8=
antd@4.2.5, antd@^4.2.4:
version "4.2.5"
resolved "https://registry.npmjs.org/antd/-/antd-4.2.5.tgz#5f68fa9282e49306b8c8d44304321d9b979772d7"
integrity sha512-8rKCvik1gbru/nzodt+21r6ksWP9VPUfC74dhTLlRA1bY+7+ZZCS87+ikbAIARQRTh88LOe6nOxn5+3rJ3yOZA==
dependencies:
"@ant-design/css-animation" "^1.7.2"
"@ant-design/icons" "^4.1.0"
"@ant-design/react-slick" "~0.26.1"
array-tree-filter "^2.1.0"
classnames "~2.2.6"
copy-to-clipboard "^3.2.0"
lodash "^4.17.13"
moment "^2.25.3"
omit.js "^1.0.2"
prop-types "^15.7.2"
raf "^3.4.1"
rc-animate "~3.0.0"
rc-cascader "~1.1.0"
rc-checkbox "~2.2.0"
rc-collapse "~2.0.0"
rc-dialog "~7.7.0"
rc-drawer "~3.2.0"
rc-dropdown "~3.0.0"
rc-field-form "~1.2.0"
rc-input-number "~4.6.1"
rc-mentions "~1.1.0"
rc-menu "~8.2.1"
rc-notification "~4.3.0"
rc-pagination "~2.2.0"
rc-picker "~1.4.16"
rc-progress "~3.0.0"
rc-rate "~2.6.0"
rc-resize-observer "^0.2.0"
rc-select "~10.3.5"
rc-slider "~9.2.3"
rc-steps "~3.6.0"
rc-switch "~3.1.0"
rc-table "~7.5.3"
rc-tabs "~10.1.1"
rc-tooltip "~4.0.2"
rc-tree "~3.2.0"
rc-tree-select "~3.1.0"
rc-trigger "~4.1.0"
rc-upload "~3.0.4"
rc-util "^4.20.0"
rc-virtual-list "^1.1.0"
resize-observer-polyfill "^1.5.1"
scroll-into-view-if-needed "^2.2.20"
warning "~4.0.3"
antd@^4.0.0:
version "4.2.4"
resolved "https://registry.npmjs.org/antd/-/antd-4.2.4.tgz#0a75e178643858960189912b8fe48bf7e8f6abf8"
@ -6080,6 +6030,56 @@ antd@^4.0.0:
scroll-into-view-if-needed "^2.2.20"
warning "~4.0.3"
antd@^4.2.4:
version "4.2.5"
resolved "https://registry.npmjs.org/antd/-/antd-4.2.5.tgz#5f68fa9282e49306b8c8d44304321d9b979772d7"
integrity sha512-8rKCvik1gbru/nzodt+21r6ksWP9VPUfC74dhTLlRA1bY+7+ZZCS87+ikbAIARQRTh88LOe6nOxn5+3rJ3yOZA==
dependencies:
"@ant-design/css-animation" "^1.7.2"
"@ant-design/icons" "^4.1.0"
"@ant-design/react-slick" "~0.26.1"
array-tree-filter "^2.1.0"
classnames "~2.2.6"
copy-to-clipboard "^3.2.0"
lodash "^4.17.13"
moment "^2.25.3"
omit.js "^1.0.2"
prop-types "^15.7.2"
raf "^3.4.1"
rc-animate "~3.0.0"
rc-cascader "~1.1.0"
rc-checkbox "~2.2.0"
rc-collapse "~2.0.0"
rc-dialog "~7.7.0"
rc-drawer "~3.2.0"
rc-dropdown "~3.0.0"
rc-field-form "~1.2.0"
rc-input-number "~4.6.1"
rc-mentions "~1.1.0"
rc-menu "~8.2.1"
rc-notification "~4.3.0"
rc-pagination "~2.2.0"
rc-picker "~1.4.16"
rc-progress "~3.0.0"
rc-rate "~2.6.0"
rc-resize-observer "^0.2.0"
rc-select "~10.3.5"
rc-slider "~9.2.3"
rc-steps "~3.6.0"
rc-switch "~3.1.0"
rc-table "~7.5.3"
rc-tabs "~10.1.1"
rc-tooltip "~4.0.2"
rc-tree "~3.2.0"
rc-tree-select "~3.1.0"
rc-trigger "~4.1.0"
rc-upload "~3.0.4"
rc-util "^4.20.0"
rc-virtual-list "^1.1.0"
resize-observer-polyfill "^1.5.1"
scroll-into-view-if-needed "^2.2.20"
warning "~4.0.3"
any-observable@^0.3.0:
version "0.3.0"
resolved "https://registry.npmjs.org/any-observable/-/any-observable-0.3.0.tgz#af933475e5806a67d0d7df090dd5e8bef65d119b"