mirror of https://gitee.com/antv-l7/antv-l7
Shihui dev (#793)
* feat: add getModelMatrix into viewport * feat: 新增地球模式 (初步构建) * feat: 完善地球交互 * style: lint style * feat: 调整地球图层缩放的方向 * style: lint style * feat: 增加地球模式的 pointLayer/fill 图层 * style: lint style * feat: 增加地球、太阳的简单运动系统,优化部分代码结构 * fix: 修复时间点击出错 * style: lint style * fix: 修复地图 panBy 方法参数错误 * style: lint style * feat: pointLayer/cylinder 圆柱兼容地球模式 * style: lint style * feat: 修复 pointLayer/fill 在拾取是破面严重的情况 * style: lint style * feat: 增加 arc 弧度调节 * chore: update version 2.5.29 -> 2.5.30 * feat: 增加 lineLayer/arc3d 兼容地球模式 * style: lint style * chore: update version 2.5.30 -> 2.5.31 * style: lint style * feat: 增加地球图层 - 大气层 * style: lint style * feat: 增加设置可视化层背景色的能力 * style: lint style
This commit is contained in:
parent
958faeccfd
commit
0e53f84199
|
@ -36,13 +36,13 @@ DrillDownLayer 提供默认提供通过 Layer 的交互事件,实现上钻下
|
|||
|
||||
向下钻取的触发事件 ⛔customTrigger 为 true 时不生效
|
||||
|
||||
### drillDownEvent
|
||||
### drillDownEvent
|
||||
|
||||
根据drillDownTriggerEvent类型下钻触发的回调事件 属性
|
||||
根据 drillDownTriggerEvent 类型下钻触发的回调事件 属性
|
||||
|
||||
### drillUpEvent
|
||||
|
||||
根据drillUpTriggleEvent类型上钻触发的回调事件 属性
|
||||
根据 drillUpTriggleEvent 类型上钻触发的回调事件 属性
|
||||
|
||||
### drillUpTriggleEvent
|
||||
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
"message": "chore: publish"
|
||||
}
|
||||
},
|
||||
"version": "2.5.30",
|
||||
"version": "2.5.31",
|
||||
"npmClient": "yarn",
|
||||
"useWorkspaces": true,
|
||||
"publishConfig": {
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-component",
|
||||
"version": "2.5.30",
|
||||
"version": "2.5.31",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
@ -25,8 +25,8 @@
|
|||
"author": "lzxue",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@antv/l7-core": "^2.5.30",
|
||||
"@antv/l7-utils": "^2.5.30",
|
||||
"@antv/l7-core": "^2.5.31",
|
||||
"@antv/l7-utils": "^2.5.31",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"eventemitter3": "^4.0.0",
|
||||
"inversify": "^5.0.1",
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-core",
|
||||
"version": "2.5.30",
|
||||
"version": "2.5.31",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
@ -24,7 +24,7 @@
|
|||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@antv/async-hook": "^2.1.0",
|
||||
"@antv/l7-utils": "^2.5.30",
|
||||
"@antv/l7-utils": "^2.5.31",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"@mapbox/tiny-sdf": "^1.1.1",
|
||||
"ajv": "^6.10.2",
|
||||
|
|
|
@ -1,9 +1,11 @@
|
|||
import { rgb2arr } from '@antv/l7';
|
||||
import { inject, injectable } from 'inversify';
|
||||
import 'reflect-metadata';
|
||||
import { ILayer } from '../..';
|
||||
import { TYPES } from '../../types';
|
||||
import Clock from '../../utils/clock';
|
||||
import { IGlobalConfigService } from '../config/IConfigService';
|
||||
import { IMapService } from '../map/IMapService';
|
||||
import { IRendererService } from '../renderer/IRendererService';
|
||||
import { ILayerModel, ILayerService } from './ILayerService';
|
||||
|
||||
|
@ -28,6 +30,9 @@ export default class LayerService implements ILayerService {
|
|||
@inject(TYPES.IRendererService)
|
||||
private readonly renderService: IRendererService;
|
||||
|
||||
@inject(TYPES.IMapService)
|
||||
private readonly mapService: IMapService;
|
||||
|
||||
@inject(TYPES.IGlobalConfigService)
|
||||
private readonly configService: IGlobalConfigService;
|
||||
|
||||
|
@ -178,8 +183,14 @@ export default class LayerService implements ILayerService {
|
|||
}
|
||||
|
||||
private clear() {
|
||||
const color = rgb2arr(this.mapService.bgColor) as [
|
||||
number,
|
||||
number,
|
||||
number,
|
||||
number,
|
||||
];
|
||||
this.renderService.clear({
|
||||
color: [0, 0, 0, 0],
|
||||
color,
|
||||
depth: 1,
|
||||
stencil: 0,
|
||||
framebuffer: null,
|
||||
|
|
|
@ -32,6 +32,8 @@ export interface IMapWrapper {
|
|||
export interface IMapService<RawMap = {}> {
|
||||
version?: string;
|
||||
map: RawMap;
|
||||
bgColor: string;
|
||||
setBgColor(color: string): void;
|
||||
init(): void;
|
||||
initViewPort?(): void;
|
||||
destroy(): void;
|
||||
|
@ -104,6 +106,7 @@ export interface IMapService<RawMap = {}> {
|
|||
}
|
||||
| undefined,
|
||||
): void;
|
||||
clearColor?(): void;
|
||||
}
|
||||
|
||||
export const MapServiceEvent = ['mapload'];
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7",
|
||||
"version": "2.5.30",
|
||||
"version": "2.5.31",
|
||||
"description": "A Large-scale WebGL-powered Geospatial Data Visualization",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
@ -25,12 +25,12 @@
|
|||
"author": "antv",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@antv/l7-component": "^2.5.30",
|
||||
"@antv/l7-core": "^2.5.30",
|
||||
"@antv/l7-layers": "^2.5.30",
|
||||
"@antv/l7-maps": "^2.5.30",
|
||||
"@antv/l7-scene": "^2.5.30",
|
||||
"@antv/l7-utils": "^2.5.30",
|
||||
"@antv/l7-component": "^2.5.31",
|
||||
"@antv/l7-core": "^2.5.31",
|
||||
"@antv/l7-layers": "^2.5.31",
|
||||
"@antv/l7-maps": "^2.5.31",
|
||||
"@antv/l7-scene": "^2.5.31",
|
||||
"@antv/l7-utils": "^2.5.31",
|
||||
"@babel/runtime": "^7.7.7"
|
||||
},
|
||||
"gitHead": "684ba4eb806a798713496d3fc0b4d1e17517dc31",
|
||||
|
|
|
@ -1,2 +1,2 @@
|
|||
const version = '2.5.30';
|
||||
const version = '2.5.31';
|
||||
export { version };
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-layers",
|
||||
"version": "2.5.30",
|
||||
"version": "2.5.31",
|
||||
"description": "L7's collection of built-in layers",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
@ -24,9 +24,9 @@
|
|||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@antv/async-hook": "^2.1.0",
|
||||
"@antv/l7-core": "^2.5.30",
|
||||
"@antv/l7-source": "^2.5.30",
|
||||
"@antv/l7-utils": "^2.5.30",
|
||||
"@antv/l7-core": "^2.5.31",
|
||||
"@antv/l7-source": "^2.5.31",
|
||||
"@antv/l7-utils": "^2.5.31",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"@mapbox/martini": "^0.2.0",
|
||||
"@turf/meta": "^6.0.2",
|
||||
|
|
|
@ -1,20 +1,25 @@
|
|||
import BaseLayer from '../core/BaseLayer';
|
||||
import EarthAtomSphereModel from './models/atmosphere';
|
||||
import BaseEarthModel from './models/base';
|
||||
|
||||
export type EarthType = 'base';
|
||||
interface IEarthLayerStyleOptions {
|
||||
setEarthTime(time: number): void;
|
||||
}
|
||||
|
||||
const EarthModels: { [key in EarthType]: any } = {
|
||||
export type EarthModelType = 'base' | 'atomSphere';
|
||||
|
||||
const EarthModels: { [key in EarthModelType]: any } = {
|
||||
base: BaseEarthModel,
|
||||
atomSphere: EarthAtomSphereModel,
|
||||
};
|
||||
|
||||
const earthLayerTypes = ['base', 'atomSphere'];
|
||||
|
||||
export default class EarthLayer extends BaseLayer<IEarthLayerStyleOptions> {
|
||||
public type: string = 'EarthLayer';
|
||||
|
||||
public buildModels() {
|
||||
const shape = 'base';
|
||||
const shape = this.getModelType();
|
||||
this.layerModel = new EarthModels[shape](this);
|
||||
this.models = this.layerModel.initModels();
|
||||
}
|
||||
|
@ -30,4 +35,15 @@ export default class EarthLayer extends BaseLayer<IEarthLayerStyleOptions> {
|
|||
console.error('请在 scene loaded 之后执行该方法!');
|
||||
}
|
||||
}
|
||||
|
||||
protected getModelType(): EarthModelType {
|
||||
const shapeAttribute = this.styleAttributeService.getLayerStyleAttribute(
|
||||
'shape',
|
||||
);
|
||||
let shape = (shapeAttribute?.scale?.field || 'base') as string;
|
||||
if (earthLayerTypes.indexOf(shape) < 0) {
|
||||
shape = 'base';
|
||||
}
|
||||
return shape as EarthModelType;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -0,0 +1,128 @@
|
|||
import {
|
||||
AttributeType,
|
||||
BlendType,
|
||||
gl,
|
||||
IEncodeFeature,
|
||||
ILayerConfig,
|
||||
IModel,
|
||||
IModelUniform,
|
||||
ITexture2D,
|
||||
} from '@antv/l7-core';
|
||||
import { rgb2arr } from '@antv/l7-utils';
|
||||
import { isNumber } from 'lodash';
|
||||
|
||||
import BaseModel, { styleOffset, styleSingle } from '../../core/BaseModel';
|
||||
import { earthTriangulation } from '../../core/triangulation';
|
||||
import atmoSphereFrag from '../shaders/atmosphere_frag.glsl';
|
||||
import atmoSphereVert from '../shaders/atmosphere_vert.glsl';
|
||||
interface IAtmoLayerStyleOptions {
|
||||
opacity: number;
|
||||
}
|
||||
|
||||
export default class EarthAtomSphereModel extends BaseModel {
|
||||
public getUninforms(): IModelUniform {
|
||||
const {
|
||||
opacity = 1,
|
||||
} = this.layer.getLayerConfig() as IAtmoLayerStyleOptions;
|
||||
return {
|
||||
u_opacity: isNumber(opacity) ? opacity : 1.0,
|
||||
};
|
||||
}
|
||||
|
||||
public initModels(): IModel[] {
|
||||
return this.buildModels();
|
||||
}
|
||||
|
||||
public clearModels() {
|
||||
return '';
|
||||
}
|
||||
|
||||
public buildModels(): IModel[] {
|
||||
return [
|
||||
this.layer.buildLayerModel({
|
||||
moduleName: 'earthAtmoSphere',
|
||||
vertexShader: atmoSphereVert,
|
||||
fragmentShader: atmoSphereFrag,
|
||||
triangulation: earthTriangulation,
|
||||
depth: {
|
||||
enable: false,
|
||||
},
|
||||
blend: this.getBlend(),
|
||||
}),
|
||||
];
|
||||
}
|
||||
|
||||
protected registerBuiltinAttributes() {
|
||||
// point layer size;
|
||||
this.styleAttributeService.registerStyleAttribute({
|
||||
name: 'size',
|
||||
type: AttributeType.Attribute,
|
||||
descriptor: {
|
||||
name: 'a_Size',
|
||||
buffer: {
|
||||
// give the WebGL driver a hint that this buffer may change
|
||||
usage: gl.DYNAMIC_DRAW,
|
||||
data: [],
|
||||
type: gl.FLOAT,
|
||||
},
|
||||
size: 1,
|
||||
update: (
|
||||
feature: IEncodeFeature,
|
||||
featureIdx: number,
|
||||
vertex: number[],
|
||||
attributeIdx: number,
|
||||
) => {
|
||||
const { size = 1 } = feature;
|
||||
return Array.isArray(size) ? [size[0]] : [size as number];
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
this.styleAttributeService.registerStyleAttribute({
|
||||
name: 'normal',
|
||||
type: AttributeType.Attribute,
|
||||
descriptor: {
|
||||
name: 'a_Normal',
|
||||
buffer: {
|
||||
// give the WebGL driver a hint that this buffer may change
|
||||
usage: gl.STATIC_DRAW,
|
||||
data: [],
|
||||
type: gl.FLOAT,
|
||||
},
|
||||
size: 3,
|
||||
update: (
|
||||
feature: IEncodeFeature,
|
||||
featureIdx: number,
|
||||
vertex: number[],
|
||||
attributeIdx: number,
|
||||
normal: number[],
|
||||
) => {
|
||||
return normal;
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
this.styleAttributeService.registerStyleAttribute({
|
||||
name: 'uv',
|
||||
type: AttributeType.Attribute,
|
||||
descriptor: {
|
||||
name: 'a_Uv',
|
||||
buffer: {
|
||||
// give the WebGL driver a hint that this buffer may change
|
||||
usage: gl.DYNAMIC_DRAW,
|
||||
data: [],
|
||||
type: gl.FLOAT,
|
||||
},
|
||||
size: 2,
|
||||
update: (
|
||||
feature: IEncodeFeature,
|
||||
featureIdx: number,
|
||||
vertex: number[],
|
||||
attributeIdx: number,
|
||||
) => {
|
||||
return [vertex[3], vertex[4]];
|
||||
},
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
|
@ -0,0 +1,15 @@
|
|||
|
||||
uniform float u_opacity;
|
||||
uniform vec3 u_CameraPosition;
|
||||
varying vec3 vVertexNormal;
|
||||
|
||||
varying vec4 v_Color;
|
||||
void main() {
|
||||
|
||||
|
||||
float intensity = pow(0.5 + dot(normalize(vVertexNormal), normalize(u_CameraPosition)), 3.0);
|
||||
// TODO: 去除背面
|
||||
if(intensity > 1.0) intensity = 0.0;
|
||||
|
||||
gl_FragColor = vec4(v_Color.rgb, v_Color.a * intensity * u_opacity);
|
||||
}
|
|
@ -0,0 +1,20 @@
|
|||
|
||||
attribute vec3 a_Position;
|
||||
attribute vec3 a_Normal;
|
||||
attribute vec2 a_Uv;
|
||||
attribute vec4 a_Color;
|
||||
uniform vec3 u_CameraPosition;
|
||||
uniform mat4 u_ViewProjectionMatrix;
|
||||
uniform mat4 u_ModelMatrix;
|
||||
uniform mat4 u_ViewMatrix;
|
||||
|
||||
varying vec3 vVertexNormal;
|
||||
varying vec4 v_Color;
|
||||
|
||||
void main() {
|
||||
v_Color = a_Color;
|
||||
|
||||
vVertexNormal = a_Normal;
|
||||
|
||||
gl_Position = u_ViewProjectionMatrix * u_ModelMatrix * vec4(a_Position, 1.0);
|
||||
}
|
|
@ -61,7 +61,6 @@ export function primitiveSphere(
|
|||
const indicesArr = [];
|
||||
const positions = [];
|
||||
const positionsArr = [];
|
||||
const normals = [];
|
||||
const normalArr = [];
|
||||
const uvs = [];
|
||||
|
||||
|
@ -96,7 +95,6 @@ export function primitiveSphere(
|
|||
positionsArr.push(...tmpVec3.slice());
|
||||
|
||||
vec3.normalize(tmpVec3, tmpVec3);
|
||||
normals.push(tmpVec3.slice());
|
||||
normalArr.push(...tmpVec3.slice());
|
||||
|
||||
uvs.push([normalizedY, 1 - normalizedZ]);
|
||||
|
@ -141,7 +139,6 @@ export function primitiveSphere(
|
|||
return {
|
||||
cells: indices,
|
||||
positions,
|
||||
normals,
|
||||
uvs,
|
||||
positionsArr,
|
||||
indicesArr,
|
||||
|
|
|
@ -9,7 +9,6 @@ import {
|
|||
IModel,
|
||||
IModelUniform,
|
||||
} from '@antv/l7-core';
|
||||
import { rgb2arr } from '@antv/l7-utils';
|
||||
import BaseModel, {
|
||||
styleColor,
|
||||
styleOffset,
|
||||
|
@ -22,7 +21,7 @@ import {
|
|||
import pointFillFrag from '../shaders/fill_frag.glsl';
|
||||
import pointFillVert from '../shaders/fill_vert.glsl';
|
||||
|
||||
import { isNumber, isString } from 'lodash';
|
||||
import { isNumber } from 'lodash';
|
||||
|
||||
import { mat4, vec3 } from 'gl-matrix';
|
||||
|
||||
|
@ -32,7 +31,6 @@ interface IPointLayerStyleOptions {
|
|||
stroke: styleColor;
|
||||
strokeOpacity: styleSingle;
|
||||
offsets: styleOffset;
|
||||
isGlobel?: boolean;
|
||||
}
|
||||
// 判断当前使用的 style 中的变量属性是否需要进行数据映射
|
||||
export default class FillModel extends BaseModel {
|
||||
|
@ -43,8 +41,6 @@ export default class FillModel extends BaseModel {
|
|||
strokeWidth = 0,
|
||||
stroke = 'rgba(0,0,0,0)',
|
||||
offsets = [0, 0],
|
||||
// TODO: 判断当前图层是否为地球模式
|
||||
isGlobel = false,
|
||||
} = this.layer.getLayerConfig() as IPointLayerStyleOptions;
|
||||
|
||||
if (
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-map",
|
||||
"version": "2.5.30",
|
||||
"version": "2.5.31",
|
||||
"description": "l7 map",
|
||||
"keywords": [],
|
||||
"author": "thinkinggis <lzx199065@gmail.com>",
|
||||
|
@ -37,7 +37,7 @@
|
|||
},
|
||||
"homepage": "https://github.com/antvis/L7#readme",
|
||||
"dependencies": {
|
||||
"@antv/l7-utils": "^2.5.30",
|
||||
"@antv/l7-utils": "^2.5.31",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"@mapbox/point-geometry": "^0.1.0",
|
||||
"@mapbox/unitbezier": "^0.0.0",
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-maps",
|
||||
"version": "2.5.30",
|
||||
"version": "2.5.31",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
@ -27,9 +27,9 @@
|
|||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@amap/amap-jsapi-loader": "^0.0.3",
|
||||
"@antv/l7-core": "^2.5.30",
|
||||
"@antv/l7-map": "^2.5.30",
|
||||
"@antv/l7-utils": "^2.5.30",
|
||||
"@antv/l7-core": "^2.5.31",
|
||||
"@antv/l7-map": "^2.5.31",
|
||||
"@antv/l7-utils": "^2.5.31",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"@types/amap-js-api": "^1.4.6",
|
||||
"@types/mapbox-gl": "^1.11.2",
|
||||
|
|
|
@ -61,6 +61,9 @@ export default class AMapService
|
|||
*/
|
||||
public map: AMap.Map & IAMapInstance;
|
||||
|
||||
// 背景色
|
||||
public bgColor: string = 'rgba(0, 0, 0, 0)';
|
||||
|
||||
@inject(TYPES.IGlobalConfigService)
|
||||
private readonly configService: IGlobalConfigService;
|
||||
|
||||
|
@ -79,6 +82,9 @@ export default class AMapService
|
|||
private viewport: Viewport;
|
||||
|
||||
private cameraChangedCallback: (viewport: IViewport) => void;
|
||||
public setBgColor(color: string) {
|
||||
this.bgColor = color;
|
||||
}
|
||||
|
||||
public addMarkerContainer(): void {
|
||||
const mapContainer = this.map.getContainer();
|
||||
|
|
|
@ -70,6 +70,9 @@ export default class AMapService
|
|||
public sceneCenter!: [number, number]; // 一般使用用户数据的第一个
|
||||
public sceneCenterMKT!: [number, number]; // 莫卡托
|
||||
|
||||
// 背景色
|
||||
public bgColor: string = 'rgba(0, 0, 0, 0)';
|
||||
|
||||
@inject(TYPES.IGlobalConfigService)
|
||||
private readonly configService: IGlobalConfigService;
|
||||
|
||||
|
@ -88,6 +91,9 @@ export default class AMapService
|
|||
private viewport: Viewport;
|
||||
|
||||
private cameraChangedCallback: (viewport: IViewport) => void;
|
||||
public setBgColor(color: string) {
|
||||
this.bgColor = color;
|
||||
}
|
||||
|
||||
/**
|
||||
* 设置数据的绘制中心 高德2.0
|
||||
|
|
|
@ -11,6 +11,7 @@ import {
|
|||
IMapService,
|
||||
IMercator,
|
||||
IPoint,
|
||||
IRendererService,
|
||||
IStatusOptions,
|
||||
IViewport,
|
||||
MapServiceEvent,
|
||||
|
@ -42,6 +43,9 @@ export default class L7MapService implements IMapService<Map> {
|
|||
public version: string = Version.GLOBEL;
|
||||
public map: Map;
|
||||
|
||||
// 背景色
|
||||
public bgColor: string = '#000';
|
||||
|
||||
@inject(TYPES.MapConfig)
|
||||
private readonly config: Partial<IMapConfig>;
|
||||
|
||||
|
@ -51,6 +55,9 @@ export default class L7MapService implements IMapService<Map> {
|
|||
@inject(TYPES.ICoordinateSystemService)
|
||||
private readonly coordinateSystemService: ICoordinateSystemService;
|
||||
|
||||
@inject(TYPES.IRendererService)
|
||||
private readonly renderService: IRendererService;
|
||||
|
||||
@inject(TYPES.IEventEmitter)
|
||||
private eventEmitter: any;
|
||||
private viewport: Viewport;
|
||||
|
@ -60,7 +67,9 @@ export default class L7MapService implements IMapService<Map> {
|
|||
// T: 用于记录鼠标对相机的控制
|
||||
private handleCameraChanging: boolean;
|
||||
private handleCameraTimer: any;
|
||||
|
||||
public setBgColor(color: string) {
|
||||
this.bgColor = color;
|
||||
}
|
||||
// init
|
||||
public addMarkerContainer(): void {
|
||||
const container = this.map.getCanvasContainer();
|
||||
|
@ -331,9 +340,15 @@ export default class L7MapService implements IMapService<Map> {
|
|||
// mapbox 中固定相机高度为 viewport 高度的 1.5 倍
|
||||
cameraHeight: 0,
|
||||
});
|
||||
|
||||
this.cameraChangedCallback(this.viewport);
|
||||
}
|
||||
}
|
||||
|
||||
public clearColor() {
|
||||
this.renderService.clear({ color: [0.0, 0.0, 0.0, 1.0] });
|
||||
}
|
||||
|
||||
private handleCameraChanged = (e: any) => {
|
||||
const DELAY_TIME = 2000;
|
||||
this.handleCameraChanging = true;
|
||||
|
|
|
@ -43,6 +43,9 @@ export default class L7MapService implements IMapService<Map> {
|
|||
public version: string = Version.L7MAP;
|
||||
public map: Map;
|
||||
|
||||
// 背景色
|
||||
public bgColor: string = 'rgba(0.0, 0.0, 0.0, 0.0)';
|
||||
|
||||
@inject(TYPES.MapConfig)
|
||||
private readonly config: Partial<IMapConfig>;
|
||||
|
||||
|
@ -58,6 +61,9 @@ export default class L7MapService implements IMapService<Map> {
|
|||
private markerContainer: HTMLElement;
|
||||
private cameraChangedCallback: (viewport: IViewport) => void;
|
||||
private $mapContainer: HTMLElement | null;
|
||||
public setBgColor(color: string) {
|
||||
this.bgColor = color;
|
||||
}
|
||||
|
||||
// init
|
||||
public addMarkerContainer(): void {
|
||||
|
|
|
@ -50,6 +50,9 @@ export default class MapboxService
|
|||
public version: string = Version.MAPBOX;
|
||||
public map: Map & IMapboxInstance;
|
||||
|
||||
// 背景色
|
||||
public bgColor: string = 'rgba(0.0, 0.0, 0.0, 0.0)';
|
||||
|
||||
@inject(TYPES.MapConfig)
|
||||
private readonly config: Partial<IMapConfig>;
|
||||
|
||||
|
@ -65,6 +68,9 @@ export default class MapboxService
|
|||
private markerContainer: HTMLElement;
|
||||
private cameraChangedCallback: (viewport: IViewport) => void;
|
||||
private $mapContainer: HTMLElement | null;
|
||||
public setBgColor(color: string) {
|
||||
this.bgColor = color;
|
||||
}
|
||||
|
||||
// init
|
||||
public addMarkerContainer(): void {
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-renderer",
|
||||
"version": "2.5.30",
|
||||
"version": "2.5.31",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
@ -26,7 +26,7 @@
|
|||
"gl": "^4.4.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"@antv/l7-core": "^2.5.30",
|
||||
"@antv/l7-core": "^2.5.31",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"inversify": "^5.0.1",
|
||||
"l7regl": "^0.0.14",
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-scene",
|
||||
"version": "2.5.30",
|
||||
"version": "2.5.31",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
@ -23,12 +23,12 @@
|
|||
"author": "xiaoiver",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@antv/l7-component": "^2.5.30",
|
||||
"@antv/l7-core": "^2.5.30",
|
||||
"@antv/l7-layers": "^2.5.30",
|
||||
"@antv/l7-maps": "^2.5.30",
|
||||
"@antv/l7-renderer": "^2.5.30",
|
||||
"@antv/l7-utils": "^2.5.30",
|
||||
"@antv/l7-component": "^2.5.31",
|
||||
"@antv/l7-core": "^2.5.31",
|
||||
"@antv/l7-layers": "^2.5.31",
|
||||
"@antv/l7-maps": "^2.5.31",
|
||||
"@antv/l7-renderer": "^2.5.31",
|
||||
"@antv/l7-utils": "^2.5.31",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"inversify": "^5.0.1",
|
||||
"mapbox-gl": "^1.2.1",
|
||||
|
|
|
@ -153,6 +153,10 @@ class Scene
|
|||
return this.mapService.map;
|
||||
}
|
||||
|
||||
public setBgColor(color: string) {
|
||||
this.mapService.setBgColor(color);
|
||||
}
|
||||
|
||||
// layer 管理
|
||||
public addLayer(layer: ILayer): void {
|
||||
// 为当前图层创建一个容器
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-source",
|
||||
"version": "2.5.30",
|
||||
"version": "2.5.31",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
@ -26,8 +26,8 @@
|
|||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@antv/async-hook": "^2.1.0",
|
||||
"@antv/l7-core": "^2.5.30",
|
||||
"@antv/l7-utils": "^2.5.30",
|
||||
"@antv/l7-core": "^2.5.31",
|
||||
"@antv/l7-utils": "^2.5.31",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"@mapbox/geojson-rewind": "^0.4.0",
|
||||
"@turf/helpers": "^6.1.4",
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-three",
|
||||
"version": "2.5.30",
|
||||
"version": "2.5.31",
|
||||
"description": "three for L7 ",
|
||||
"keywords": [
|
||||
"3D",
|
||||
|
@ -44,9 +44,9 @@
|
|||
},
|
||||
"homepage": "https://github.com/antvis/L7#readme",
|
||||
"dependencies": {
|
||||
"@antv/l7-core": "^2.5.30",
|
||||
"@antv/l7-layers": "^2.5.30",
|
||||
"@antv/l7-scene": "^2.5.30",
|
||||
"@antv/l7-core": "^2.5.31",
|
||||
"@antv/l7-layers": "^2.5.31",
|
||||
"@antv/l7-scene": "^2.5.31",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"inversify": "^5.0.1",
|
||||
"reflect-metadata": "^0.1.13",
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-utils",
|
||||
"version": "2.5.30",
|
||||
"version": "2.5.31",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
|
|
@ -21,6 +21,8 @@ export default class ScaleComponent extends React.Component {
|
|||
}),
|
||||
});
|
||||
|
||||
scene.setBgColor('#333');
|
||||
|
||||
let data = [
|
||||
{
|
||||
lng1: 100,
|
||||
|
@ -102,7 +104,8 @@ export default class ScaleComponent extends React.Component {
|
|||
},
|
||||
},
|
||||
)
|
||||
.color('#2E8AE6')
|
||||
// .color('#2E8AE6')
|
||||
.color('#f00')
|
||||
.shape('fill')
|
||||
.style({
|
||||
opacity: 1.0,
|
||||
|
@ -114,16 +117,43 @@ export default class ScaleComponent extends React.Component {
|
|||
// earthTime: 4.0
|
||||
earthTime: 0.1,
|
||||
},
|
||||
});
|
||||
// .animate(true);
|
||||
})
|
||||
.animate(true);
|
||||
// earthlayer.setEarthTime(4.0)
|
||||
|
||||
const atomLayer = new EarthLayer()
|
||||
.source(
|
||||
[
|
||||
{
|
||||
lng1: 100,
|
||||
lat1: 30.0,
|
||||
lng2: 130,
|
||||
lat2: 30,
|
||||
},
|
||||
],
|
||||
{
|
||||
parser: {
|
||||
type: 'json',
|
||||
x: 'lng1',
|
||||
y: 'lat1',
|
||||
x1: 'lng2',
|
||||
y1: 'lat2',
|
||||
},
|
||||
},
|
||||
)
|
||||
.color('#2E8AE6')
|
||||
.shape('atomSphere')
|
||||
.style({
|
||||
opacity: 1.5,
|
||||
});
|
||||
|
||||
scene.on('loaded', () => {
|
||||
scene.addLayer(earthlayer);
|
||||
// scene.addLayer(pointlayer);
|
||||
// console.log(pointlayer)
|
||||
|
||||
// earthlayer.setEarthTime(4.0);
|
||||
|
||||
scene.addLayer(atomLayer);
|
||||
scene.addLayer(lineLayer);
|
||||
});
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue