mirror of https://gitee.com/antv-l7/antv-l7
parent
177d0f48cc
commit
1081a15e11
|
@ -84,8 +84,16 @@ export default class BaseLayer<ChildLayerStyleOptions = {}>
|
|||
public defaultSourceConfig: {
|
||||
data: any[];
|
||||
options: ISourceCFG | undefined;
|
||||
}={
|
||||
data: [],
|
||||
options: {
|
||||
parser: {
|
||||
type: 'json',
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
|
||||
public dataState: IDataState = {
|
||||
dataSourceNeedUpdate: false,
|
||||
dataMappingNeedUpdate: false,
|
||||
|
|
|
@ -2,6 +2,7 @@ import BaseLayer from '../core/BaseLayer';
|
|||
import EarthAtomSphereModel from './models/atmosphere';
|
||||
import BaseEarthModel from './models/base';
|
||||
import EarthBloomSphereModel from './models/bloomsphere';
|
||||
import { ISourceCFG } from '@antv/l7-core';
|
||||
|
||||
interface IEarthLayerStyleOptions {
|
||||
opacity: number;
|
||||
|
@ -20,6 +21,17 @@ const earthLayerTypes = ['base', 'atomSphere', 'bloomSphere'];
|
|||
|
||||
export default class EarthLayer extends BaseLayer<IEarthLayerStyleOptions> {
|
||||
public type: string = 'EarthLayer';
|
||||
public defaultSourceConfig: {
|
||||
data: any[];
|
||||
options: ISourceCFG | undefined;
|
||||
} = {
|
||||
data: [],
|
||||
options: {
|
||||
parser: {
|
||||
type: 'json',
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
public buildModels() {
|
||||
const shape = this.getModelType();
|
||||
|
|
|
@ -1,74 +0,0 @@
|
|||
import { Scene, PointLayer, EarthLayer } from '@antv/l7';
|
||||
import { Earth } from '@antv/l7-maps';
|
||||
const scene = new Scene({
|
||||
id: 'map',
|
||||
map: new Earth({})
|
||||
});
|
||||
|
||||
const earthlayer = new EarthLayer()
|
||||
.source(
|
||||
'https://gw.alipayobjects.com/mdn/rms_23a451/afts/img/A*3-3NSpqRqUoAAAAAAAAAAAAAARQnAQ',
|
||||
{
|
||||
parser: {
|
||||
type: 'image'
|
||||
}
|
||||
}
|
||||
)
|
||||
.shape('fill')
|
||||
.style({
|
||||
opacity: 1.0,
|
||||
radius: 40,
|
||||
globelOtions: {
|
||||
ambientRatio: 0.6, // 环境光
|
||||
diffuseRatio: 0.4, // 漫反射
|
||||
specularRatio: 0.1 // 高光反射
|
||||
}
|
||||
})
|
||||
.animate(true);
|
||||
|
||||
const atomLayer = new EarthLayer()
|
||||
.color('#2E8AE6')
|
||||
.shape('atomSphere')
|
||||
.style({
|
||||
opacity: 1
|
||||
});
|
||||
|
||||
const bloomLayer = new EarthLayer().color('#fff').shape('bloomSphere')
|
||||
.style({
|
||||
opacity: 0.6
|
||||
});
|
||||
|
||||
scene.on('loaded', () => {
|
||||
scene.addLayer(earthlayer);
|
||||
|
||||
fetch('https://gw.alipayobjects.com/os/bmw-prod/efef6c2b-2922-4c03-b9e0-d3743f68eaf2.json')
|
||||
.then(res => res.json())
|
||||
.then(data => {
|
||||
const pointlayer = new PointLayer()
|
||||
.source(data,
|
||||
{
|
||||
parser: {
|
||||
type: 'json',
|
||||
x: 'lng',
|
||||
y: 'lat'
|
||||
}
|
||||
}
|
||||
)
|
||||
.shape('cylinder')
|
||||
.color('#f00')
|
||||
.size('', () => [ 1, 1, 10 ])
|
||||
.active(true);
|
||||
scene.addLayer(pointlayer);
|
||||
});
|
||||
|
||||
scene.addLayer(atomLayer);
|
||||
scene.addLayer(bloomLayer);
|
||||
|
||||
earthlayer.setEarthTime(4.0);
|
||||
});
|
||||
|
||||
// {
|
||||
// "filename": "cylinder.js",
|
||||
// "title": "圆柱图层",
|
||||
// "screenshot":"https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*v26ESpAZd1AAAAAAAAAAAAAAARQnAQ"
|
||||
// }
|
|
@ -1,4 +0,0 @@
|
|||
---
|
||||
title: PointLayer
|
||||
order: 0
|
||||
---
|
|
@ -1,4 +0,0 @@
|
|||
---
|
||||
title: 点图层
|
||||
order: 0
|
||||
---
|
|
@ -1,73 +0,0 @@
|
|||
import { Scene, PointLayer, EarthLayer } from '@antv/l7';
|
||||
import { Earth } from '@antv/l7-maps';
|
||||
const scene = new Scene({
|
||||
id: 'map',
|
||||
map: new Earth({})
|
||||
});
|
||||
|
||||
const earthlayer = new EarthLayer()
|
||||
.source(
|
||||
'https://gw.alipayobjects.com/mdn/rms_23a451/afts/img/A*3-3NSpqRqUoAAAAAAAAAAAAAARQnAQ',
|
||||
{
|
||||
parser: {
|
||||
type: 'image'
|
||||
}
|
||||
}
|
||||
)
|
||||
.shape('base')
|
||||
.style({
|
||||
opacity: 1.0,
|
||||
radius: 40,
|
||||
globelOtions: {
|
||||
ambientRatio: 0.6, // 环境光
|
||||
diffuseRatio: 0.4, // 漫反射
|
||||
specularRatio: 0.1 // 高光反射
|
||||
}
|
||||
})
|
||||
.animate(true);
|
||||
|
||||
const atomLayer = new EarthLayer()
|
||||
.color('#2E8AE6')
|
||||
.shape('atomSphere')
|
||||
.style({
|
||||
opacity: 1
|
||||
});
|
||||
|
||||
const bloomLayer = new EarthLayer().color('#fff').shape('bloomSphere')
|
||||
.style({
|
||||
opacity: 0.6
|
||||
});
|
||||
|
||||
scene.on('loaded', () => {
|
||||
scene.addLayer(earthlayer);
|
||||
fetch('https://gw.alipayobjects.com/os/bmw-prod/efef6c2b-2922-4c03-b9e0-d3743f68eaf2.json')
|
||||
.then(res => res.json())
|
||||
.then(data => {
|
||||
const pointlayer = new PointLayer()
|
||||
.source(data,
|
||||
{
|
||||
parser: {
|
||||
type: 'json',
|
||||
x: 'lng',
|
||||
y: 'lat'
|
||||
}
|
||||
}
|
||||
)
|
||||
.shape('circle')
|
||||
.color('#f00')
|
||||
.size(10)
|
||||
.active(true);
|
||||
scene.addLayer(pointlayer);
|
||||
});
|
||||
|
||||
scene.addLayer(atomLayer);
|
||||
scene.addLayer(bloomLayer);
|
||||
|
||||
earthlayer.setEarthTime(4.0);
|
||||
});
|
||||
|
||||
// {
|
||||
// "filename": "point.js",
|
||||
// "title": "点图层",
|
||||
// "screenshot":"https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*-kG0TIHBfvgAAAAAAAAAAAAAARQnAQ"
|
||||
// },
|
|
@ -1,7 +0,0 @@
|
|||
{
|
||||
"title": {
|
||||
"zh": "地球模式 - 点图层",
|
||||
"en": "Earth Mode - pointLayer"
|
||||
},
|
||||
"demos": []
|
||||
}
|
|
@ -1,4 +1,4 @@
|
|||
import { ILayer, IMercator } from '@antv/l7-core';
|
||||
import { ILayer, IMercator, ISourceCFG } from '@antv/l7-core';
|
||||
import { BaseLayer } from '@antv/l7-layers';
|
||||
import {
|
||||
AnimationMixer,
|
||||
|
@ -28,6 +28,17 @@ export default class ThreeJSLayer
|
|||
private animateMixer: AnimationMixer[] = [];
|
||||
// 地图中点墨卡托坐标
|
||||
private center: IMercator;
|
||||
public defaultSourceConfig: {
|
||||
data: any[];
|
||||
options: ISourceCFG | undefined;
|
||||
} = {
|
||||
data: [],
|
||||
options: {
|
||||
parser: {
|
||||
type: 'json',
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
public setUpdate(callback: () => void) {
|
||||
this.update = callback;
|
||||
|
|
Loading…
Reference in New Issue