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 #411 from antvis/fix_boundry 

fix(layer): 更新空数据& filter 方法
This commit is contained in:
@thinkinggis 2020-06-23 01:12:45 +08:00 committed by GitHub
parent aa0d82808f ac84164b27
commit 87ec38b6e4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
13 changed files with 105 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
examples/react/layer/demo/world.jsx
View File

@ -7,7 +7,7 @@ const World = React.memo(function Map() {
React.useEffect(() => {
const fetchData = async () => {
const response = await fetch(
'https://gw.alipayobjects.com/os/basement_prod/68dc6756-627b-4e9e-a5ba-e834f6ba48f8.json'
'https://gw.alipayobjects.com/os/antvdemo/assets/data/world.geo.json'
);
const data = await response.json();
setData(data);

3
packages/boundry/package.json
View File

@ -46,9 +46,6 @@
"lodash": "^4.6.2",
"pbf": "^3.2.1"
},
"peerDependencies": {
"@antv/l7": "^2.2.3"
},
"bugs": {
"url": "https://github.com/antvis/L7/issues"
},

6
packages/boundry/src/config.ts
View File

@ -1,18 +1,18 @@
// tslint:disable-next-line:no-submodule-imports
import merge from 'lodash/merge';
let DataLevel = 2;
let DataLevel = 2; // d
const dataLevel2: { [key: string]: any } = {
world: {
fill: {
type: 'pbf',
url:
'https://gw.alipayobjects.com/os/bmw-prod/e66cdd3f-cd41-4533-9746-d8fdbe0a0056.bin',
'https://gw.alipayobjects.com/os/bmw-prod/c95e3e43-d68b-4144-b366-3977ca64a822.bin',
},
line: {
type: 'pbf',
url:
'https://gw.alipayobjects.com/os/bmw-prod/f1b0fd97-ac90-4adb-b99c-01709e0e52c8.bin',
'https://gw.alipayobjects.com/os/bmw-prod/62f61f5f-cca7-4137-845d-13c8f9969664.bin',
},
label: {
type: 'pbf',

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

@ -126,7 +126,7 @@ export default class BaseLayer extends EventEmitter {
style: {
opacity: 1.0,
},
activeColor: 'rgba(0,0,255,0.3)',
activeColor: false,
},
autoFit: true,
stroke: '#bdbdbd',
@ -176,18 +176,20 @@ export default class BaseLayer extends EventEmitter {
],
});
this.setLayerAttribute(fillLayer, 'color', fill.color as AttributeType);
this.setLayerAttribute(fillLayer, 'filter', fill.filter as AttributeType);
if (fill.scale && isObject(fill.color)) {
fillLayer.scale('color', {
type: fill.scale,
field: fill.color.field as string,
});
}
fillLayer
.shape('fill')
.active({
fillLayer.shape('fill').style(fill.style);
if (fill.activeColor) {
fillLayer.active({
color: fill.activeColor as string,
})
.style(fill.style);
});
}
this.fillLayer = fillLayer;
this.layers.push(fillLayer);
this.scene.addLayer(fillLayer);
@ -256,6 +258,11 @@ export default class BaseLayer extends EventEmitter {
this.setLayerAttribute(bubbleLayer, 'color', bubble.color as AttributeType);
this.setLayerAttribute(bubbleLayer, 'size', bubble.size as AttributeType);
this.setLayerAttribute(bubbleLayer, 'shape', bubble.shape as AttributeType);
this.setLayerAttribute(
bubbleLayer,
'filter',
bubble.filter as AttributeType,
);
if (bubble.scale) {
bubbleLayer.scale(bubble.scale.field, {
type: bubble.scale.type,
@ -325,12 +332,17 @@ export default class BaseLayer extends EventEmitter {
private setLayerAttribute(
layer: ILayer,
type: 'color' | 'size' | 'shape',
type: 'color' | 'size' | 'shape' | 'filter',
attr: AttributeType,
) {
if (!attr) {
return;
}
if (isObject(attr)) {
// @ts-ignore
layer[type](attr.field, attr.values);
} else {
// @ts-ignore
layer[type](attr);
}
}

4
packages/boundry/src/layer/interface.ts
View File

@ -36,7 +36,8 @@ export interface IFillOptions {
color: AttributeType;
values: StyleAttributeOption;
style: any;
activeColor: string;
activeColor: string | boolean;
filter: AttributeType;
}
export type TriggeEventType =
| 'mousemove'
@ -60,6 +61,7 @@ export interface IBubbleOption {
shape: AttributeType;
size: AttributeType;
color: AttributeType;
filter: AttributeType;
scale: {
field: string;
type: ScaleTypeName;

2
packages/draw/src/draw_control.ts
View File

@ -2,7 +2,7 @@
* @Author: lzxue
* @Date: 2020-04-03 19:24:16
* @Last Modified by: lzxue
* @Last Modified time: 2020-05-13 11:58:01
* @Last Modified time: 2020-06-22 17:33:14
*/
import { Control, DOM, IControlOption, PositionType, Scene } from '@antv/l7';
import './css/draw.less';

1
packages/draw/src/modes/draw_feature.ts
View File

@ -243,6 +243,7 @@ export default abstract class DrawFeature extends DrawMode {
if (this.drawStatus === 'DrawSelected') {
this.clear();
this.source.removeFeature(this.currentFeature as Feature);
this.normalLayer.update(this.source.data);
this.drawLayer.disableSelect();
this.selectMode.disable();

6
packages/layers/src/plugins/FeatureScalePlugin.ts
View File

@ -72,9 +72,9 @@ export default class FeatureScalePlugin implements ILayerPlugin {
this.scaleOptions = layer.getScaleOptions();
const attributes = styleAttributeService.getLayerStyleAttributes();
const { dataArray } = layer.getSource().data;
if (dataArray.length === 0) {
return;
}
// if (dataArray.length === 0) {
// return;
// }
this.caculateScalesForAttributes(attributes || [], dataArray);
return true;
});

49
packages/layers/src/point/__tests__/layer.spec.ts Normal file
View File

@ -0,0 +1,49 @@
import { Mapbox } from '../../../../maps/src';
import { Scene } from '../../../../scene/src';
import PointLayer from '../';
describe('pointLayer', () => {
const el = document.createElement('div');
el.id = 'test-div-id';
el.style.width = '500px';
el.style.height = '500px';
document.querySelector('body')?.appendChild(el);
const pointdata = {
type: 'FeatureCollection',
features: [],
};
it('init', () => {
const scene = new Scene({
id: 'test-div-id',
map: new Mapbox({
style: 'dark',
center: [110.19382669582967, 30.258134],
pitch: 0,
zoom: 3,
}),
});
scene.on('loaded', () => {
const layer = new PointLayer()
.source(pointdata)
.color('red')
.shape('circle')
.size(5);
scene.addLayer(layer);
scene.render();
layer.setData({
type: 'FeatureCollection',
features: [
{
type: 'Feature',
properties: {},
geometry: {
type: 'Point',
coordinates: [99.84374999999999, 32.54681317351514],
},
},
],
});
expect(layer.getEncodedData().length).toBe(1);
});
});
});

3
packages/source/src/transform/join.ts
View File

@ -15,13 +15,14 @@ export function join(geoData: IParserData, options: IJoinOption) {
const { sourceField, targetField, data } = options;
const dataObj: { [key: string]: any } = {};
data.forEach((element: { [key: string]: any }) => {
// 属性数据
dataObj[element[sourceField]] = element;
});
geoData.dataArray = geoData.dataArray.map((item: IParseDataItem) => {
const joinName = item[targetField];
return {
...dataObj[joinName],
...item,
...dataObj[joinName],
};
});
return geoData;

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

@ -39,12 +39,18 @@ export default class Country extends React.Component {
'#a63603',
],
},
filter: {
field: 'NAME_CHN',
values: (v: any) => {
return v.length > 5;
},
},
},
stroke: '#ccc',
label: {
enable: true,
textAllowOverlap: false,
field: 'NAME_CHN',
field: 'NAME_ENG',
},
popup: {
enable: true,
@ -54,7 +60,6 @@ export default class Country extends React.Component {
},
});
Layer.on('loaded', () => {
console.log('完成');
Layer.updateData(
[
{

15
stories/Layers/components/Point.tsx
View File

@ -61,6 +61,21 @@ export default class Point3D extends React.Component {
scene.addLayer(pointLayer);
this.scene = scene;
setTimeout(() => {
console.log('updatedata');
pointLayer.setData(
{
type: 'FeatureCollection',
features: [],
},
{
parser: {
type: 'geojson',
},
},
);
console.log(pointLayer);
}, 3000);
});
});
}

2
tslint.test.json
View File

@ -1,7 +1,7 @@
{
"extends": ["./tslint.json"],
"rules": {
"no-implicit-dependencies": [true, "dev"]
"no-implicit-dependencies": [false, "dev"]
},
"linterOptions": {
"exclude": ["**/*.d.ts", "**/data/*.ts"]