chore(map): update version

This commit is contained in:
thinkinggis 2020-07-21 17:39:42 +08:00
commit bb167de24b
28 changed files with 154 additions and 128 deletions

View File

@ -317,10 +317,13 @@ scene.setPitch(pitch);
参数 :
- `extent` { array} 经纬度范围 [minlng,minlat,maxlng,maxlat]
- `extent` { array} 经纬度范围 [[minlng,minlat],[maxlng,maxlat]]
```javascript
scene.fitBounds([112, 32, 114, 35]);
scene.fitBounds([
[112, 32],
[114, 35],
]);
```
### getContainer

View File

@ -351,10 +351,13 @@ scene.setPitch(pitch);
参数 :
- `extent` { array} 经纬度范围 [minlng,minlat,maxlng,maxlat]
- `extent` { array} 经纬度范围 [[minlng,minlat],[maxlng,maxlat]]
```javascript
scene.fitBounds([112, 32, 114, 35]);
scene.fitBounds([
[112, 32],
[114, 35],
]);
```
### removeLayer

View File

@ -14,7 +14,7 @@
"message": "chore: publish"
}
},
"version": "2.2.21",
"version": "2.2.24",
"npmClient": "yarn",
"useWorkspaces": true,
"publishConfig": {

View File

@ -1,6 +1,6 @@
{
"name": "@antv/l7-district",
"version": "2.2.21",
"version": "2.2.24",
"description": "L7 district moudules",
"keywords": [],
"author": "thinkinggis <lzx199065@gmail.com>",
@ -34,7 +34,7 @@
"test": "jest"
},
"dependencies": {
"@antv/l7": "2.2.21",
"@antv/l7": "2.2.24",
"@babel/runtime": "^7.7.7",
"@turf/circle": "^6.0.1",
"@turf/distance": "^6.0.1",

View File

@ -1,6 +1,6 @@
{
"name": "@antv/l7-component",
"version": "2.2.21",
"version": "2.2.24",
"description": "",
"main": "lib/index.js",
"module": "es/index.js",
@ -24,8 +24,8 @@
"author": "lzxue",
"license": "ISC",
"dependencies": {
"@antv/l7-core": "2.2.21",
"@antv/l7-utils": "2.2.21",
"@antv/l7-core": "2.2.24",
"@antv/l7-utils": "2.2.24",
"@babel/runtime": "^7.7.7",
"eventemitter3": "^4.0.0",
"inversify": "^5.0.1",

View File

@ -1,6 +1,6 @@
{
"name": "@antv/l7-core",
"version": "2.2.21",
"version": "2.2.24",
"description": "",
"main": "lib/index.js",
"module": "es/index.js",
@ -23,7 +23,7 @@
"license": "ISC",
"dependencies": {
"@antv/async-hook": "^2.1.0",
"@antv/l7-utils": "2.2.21",
"@antv/l7-utils": "2.2.24",
"@babel/runtime": "^7.7.7",
"@mapbox/tiny-sdf": "^1.1.1",
"ajv": "^6.10.2",

View File

@ -33,9 +33,12 @@ export default class InteractionService extends EventEmitter
private clickTimer: number;
private $containter: HTMLElement;
public init() {
// 注册事件在地图底图上
this.addEventListenerOnMap();
this.$containter = this.mapService.getMapContainer() as HTMLElement;
}
public destroy() {
@ -147,7 +150,10 @@ export default class InteractionService extends EventEmitter
const lngLat = this.mapService.containerToLngLat([clientX, clientY]);
return { x: clientX, y: clientY, lngLat, type };
}
private onHover = ({ x, y, type }: MouseEvent) => {
private onHover = (event: MouseEvent) => {
let { x, y } = event;
const type = event.type;
const $containter = this.mapService.getMapContainer();
if ($containter) {
const { top, left } = $containter.getBoundingClientRect();

View File

@ -46,8 +46,12 @@ export default class PickingService implements IPickingService {
createTexture2D,
createFramebuffer,
getViewportSize,
getContainer,
} = this.rendererService;
const { width, height } = getViewportSize();
const {
width,
height,
} = (getContainer() as HTMLElement).getBoundingClientRect();
this.pickBufferScale =
this.configService.getSceneConfig(id).pickBufferScale || 1;
// 创建 picking framebuffer后续实时 resize
@ -76,9 +80,16 @@ export default class PickingService implements IPickingService {
this.alreadyInPicking = false;
}
private async pickingLayers(target: IInteractionTarget) {
const { getViewportSize, useFramebuffer, clear } = this.rendererService;
const { width, height } = getViewportSize();
const {
getViewportSize,
useFramebuffer,
clear,
getContainer,
} = this.rendererService;
const {
width,
height,
} = (getContainer() as HTMLElement).getBoundingClientRect();
if (this.width !== width || this.height !== height) {
this.pickingFBO.resize({
width: Math.round(width / this.pickBufferScale),
@ -113,8 +124,11 @@ export default class PickingService implements IPickingService {
{ x, y, lngLat, type }: IInteractionTarget,
) => {
let isPicked = false;
const { getViewportSize, readPixels } = this.rendererService;
const { width, height } = getViewportSize();
const { getViewportSize, readPixels, getContainer } = this.rendererService;
const {
width,
height,
} = (getContainer() as HTMLElement).getBoundingClientRect();
const { enableHighlight, enableSelect } = layer.getLayerConfig();
const xInDevicePixel = x * window.devicePixelRatio;

View File

@ -225,13 +225,13 @@ export default class StyleAttributeService implements IStyleAttributeService {
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

@ -42,7 +42,7 @@ export interface IReadPixelsOptions {
}
export interface IRendererService {
init($container: HTMLDivElement, cfg: IRenderConfig): Promise<void>;
init(canvas: HTMLCanvasElement, cfg: IRenderConfig): Promise<void>;
clear(options: IClearOptions): void;
createModel(options: IModelInitializationOptions): IModel;
createAttribute(options: IAttributeInitializationOptions): IAttribute;

View File

@ -100,6 +100,8 @@ export default class Scene extends EventEmitter implements ISceneService {
*/
private $container: HTMLDivElement | null;
private canvas: HTMLCanvasElement;
private hooks: {
init: AsyncParallelHook;
};
@ -170,11 +172,17 @@ export default class Scene extends EventEmitter implements ISceneService {
this.configService.getSceneConfig(this.id).id || '',
);
this.$container = $container;
if ($container) {
this.canvas = DOM.create('canvas', '', $container) as HTMLCanvasElement;
this.setCanvas();
await this.rendererService.init(
$container,
// @ts-ignore
this.canvas,
this.configService.getSceneConfig(this.id) as IRenderConfig,
);
// this.initContainer();
// window.addEventListener('resize', this.handleWindowResized);
elementResizeEvent(
this.$container as HTMLDivElement,
this.handleWindowResized,
@ -279,35 +287,43 @@ export default class Scene extends EventEmitter implements ISceneService {
this.emit('resize');
// @ts-check
if (this.$container) {
// recalculate the viewport's size and call gl.viewport
// @see https://github.com/regl-project/regl/blob/master/lib/webgl.js#L24-L38
const pixelRatio = window.devicePixelRatio;
let w = window.innerWidth;
let h = window.innerHeight;
if (this.$container !== document.body) {
const bounds = this.$container.getBoundingClientRect();
w = bounds.right - bounds.left;
h = bounds.bottom - bounds.top;
}
const canvas = this.$container?.getElementsByTagName('canvas')[0];
// this.$container.
this.rendererService.viewport({
x: 0,
y: 0,
width: pixelRatio * w,
height: pixelRatio * h,
});
// 触发 Map canvas
this.initContainer();
DOM.triggerResize();
this.coordinateSystemService.needRefresh = true;
if (canvas) {
canvas.width = w * pixelRatio;
canvas.height = h * pixelRatio;
}
// repaint layers
this.render();
}
};
private initContainer() {
const pixelRatio = window.devicePixelRatio;
const w = this.$container?.clientWidth || 400;
const h = this.$container?.clientHeight || 300;
const canvas = this.canvas;
if (canvas) {
canvas.width = w * pixelRatio;
canvas.height = h * pixelRatio;
canvas.style.width = `${w}px`;
canvas.style.height = `${h}px`;
}
this.rendererService.viewport({
x: 0,
y: 0,
width: pixelRatio * w,
height: pixelRatio * h,
});
}
private setCanvas() {
const pixelRatio = window.devicePixelRatio;
const w = this.$container?.clientWidth || 400;
const h = this.$container?.clientHeight || 300;
const canvas = this.canvas;
canvas.width = w * pixelRatio;
canvas.height = h * pixelRatio;
canvas.style.width = `${w}px`;
canvas.style.height = `${h}px`;
}
private handleMapCameraChanged = (viewport: IViewport) => {
this.cameraService.update(viewport);

View File

@ -1,6 +1,6 @@
{
"name": "@antv/l7-draw",
"version": "2.2.21",
"version": "2.2.24",
"description": "L7 Draw moudules",
"keywords": [],
"author": "thinkinggis <lzx199065@gmail.com>",
@ -35,7 +35,7 @@
"test": "jest"
},
"dependencies": {
"@antv/l7": "2.2.21",
"@antv/l7": "2.2.24",
"@babel/runtime": "^7.7.7",
"@turf/circle": "^6.0.1",
"@turf/distance": "^6.0.1",

View File

@ -1,6 +1,6 @@
{
"name": "@antv/l7",
"version": "2.2.21",
"version": "2.2.24",
"description": "A Large-scale WebGL-powered Geospatial Data Visualization",
"main": "lib/index.js",
"module": "es/index.js",
@ -24,12 +24,12 @@
"author": "antv",
"license": "MIT",
"dependencies": {
"@antv/l7-component": "2.2.21",
"@antv/l7-core": "2.2.21",
"@antv/l7-layers": "2.2.21",
"@antv/l7-maps": "2.2.21",
"@antv/l7-scene": "2.2.21",
"@antv/l7-utils": "2.2.21",
"@antv/l7-component": "2.2.24",
"@antv/l7-core": "2.2.24",
"@antv/l7-layers": "2.2.24",
"@antv/l7-maps": "2.2.24",
"@antv/l7-scene": "2.2.24",
"@antv/l7-utils": "2.2.24",
"@babel/runtime": "^7.7.7"
},
"gitHead": "20154fe30d512024b03ac5e40f77731bc0580bb0",

View File

@ -1,2 +1,2 @@
const version = '2.2.21';
const version = '2.2.24';
export { version };

View File

@ -1,6 +1,6 @@
{
"name": "@antv/l7-layers",
"version": "2.2.21",
"version": "2.2.24",
"description": "L7's collection of built-in layers",
"main": "lib/index.js",
"module": "es/index.js",
@ -23,9 +23,9 @@
"license": "ISC",
"dependencies": {
"@antv/async-hook": "^2.1.0",
"@antv/l7-core": "2.2.21",
"@antv/l7-source": "2.2.21",
"@antv/l7-utils": "2.2.21",
"@antv/l7-core": "2.2.24",
"@antv/l7-source": "2.2.24",
"@antv/l7-utils": "2.2.24",
"@babel/runtime": "^7.7.7",
"@mapbox/martini": "^0.2.0",
"@turf/meta": "^6.0.2",

View File

@ -1,6 +1,6 @@
{
"name": "@antv/l7-maps",
"version": "2.2.21",
"version": "2.2.24",
"description": "",
"main": "lib/index.js",
"module": "es/index.js",
@ -25,9 +25,8 @@
"author": "xiaoiver",
"license": "ISC",
"dependencies": {
"@antv/l7-core": "2.2.21",
"@antv/l7-map": "2.2.21",
"@antv/l7-utils": "2.2.21",
"@antv/l7-core": "2.2.24",
"@antv/l7-utils": "2.2.24",
"@babel/runtime": "^7.7.7",
"@types/amap-js-api": "^1.4.6",
"gl-matrix": "^3.1.0",

View File

@ -1,6 +1,6 @@
{
"name": "@antv/l7-react",
"version": "2.2.21",
"version": "2.2.24",
"description": "",
"main": "lib/index.js",
"module": "es/index.js",
@ -24,8 +24,8 @@
"author": "lzxue",
"license": "ISC",
"dependencies": {
"@antv/l7": "2.2.21",
"@antv/l7-maps": "2.2.21",
"@antv/l7": "2.2.24",
"@antv/l7-maps": "2.2.24",
"@babel/runtime": "^7.7.7",
"load-styles": "^2.0.0"
},

View File

@ -1,6 +1,6 @@
{
"name": "@antv/l7-renderer",
"version": "2.2.21",
"version": "2.2.24",
"description": "",
"main": "lib/index.js",
"module": "es/index.js",
@ -25,7 +25,7 @@
"gl": "^4.4.0"
},
"dependencies": {
"@antv/l7-core": "2.2.21",
"@antv/l7-core": "2.2.24",
"@babel/runtime": "^7.7.7",
"inversify": "^5.0.1",
"lodash": "^4.17.15",

View File

@ -35,6 +35,6 @@ export default class ReglElements implements IElements {
}
public destroy() {
this.elements.destroy();
// this.elements.destroy();
}
}

View File

@ -36,19 +36,21 @@ import ReglTexture2D from './ReglTexture2D';
export default class ReglRendererService implements IRendererService {
private gl: regl.Regl;
private $container: HTMLDivElement | null;
private canvas: HTMLCanvasElement;
private width: number;
private height: number;
private isDirty: boolean;
public async init(
$container: HTMLDivElement,
canvas: HTMLCanvasElement,
cfg: IRenderConfig,
): Promise<void> {
this.$container = $container;
// this.$container = $container;
this.canvas = canvas;
// tslint:disable-next-line:typedef
this.gl = await new Promise((resolve, reject) => {
regl({
container: $container,
canvas: this.canvas,
attributes: {
alpha: true,
// use TAA instead of MSAA
@ -141,13 +143,6 @@ export default class ReglRendererService implements IRendererService {
}) => {
// use WebGL context directly
// @see https://github.com/regl-project/regl/blob/gh-pages/API.md#unsafe-escape-hatch
const renderCanvas = this.$container?.getElementsByTagName('canvas')[0];
if (renderCanvas) {
renderCanvas.width = width;
renderCanvas.height = height;
renderCanvas.style.width = width / 2 + 'px';
renderCanvas.style.height = height / 2 + 'px';
}
this.gl._gl.viewport(x, y, width, height);
this.width = width;
this.height = height;
@ -176,11 +171,12 @@ export default class ReglRendererService implements IRendererService {
};
public getContainer = () => {
return this.$container;
return this.canvas?.parentElement;
};
public getCanvas = () => {
return this.$container?.getElementsByTagName('canvas')[0] || null;
// return this.$container?.getElementsByTagName('canvas')[0] || null;
return this.canvas;
};
public getGLContext = () => {

View File

@ -1,6 +1,6 @@
{
"name": "@antv/l7-scene",
"version": "2.2.21",
"version": "2.2.24",
"description": "",
"main": "lib/index.js",
"module": "es/index.js",
@ -22,11 +22,11 @@
"author": "xiaoiver",
"license": "ISC",
"dependencies": {
"@antv/l7-component": "2.2.21",
"@antv/l7-core": "2.2.21",
"@antv/l7-maps": "2.2.21",
"@antv/l7-renderer": "2.2.21",
"@antv/l7-utils": "2.2.21",
"@antv/l7-component": "2.2.24",
"@antv/l7-core": "2.2.24",
"@antv/l7-maps": "2.2.24",
"@antv/l7-renderer": "2.2.24",
"@antv/l7-utils": "2.2.24",
"@babel/runtime": "^7.7.7",
"inversify": "^5.0.1",
"mapbox-gl": "^1.2.1",

View File

@ -1,6 +1,6 @@
{
"name": "@antv/l7-source",
"version": "2.2.21",
"version": "2.2.24",
"description": "",
"main": "lib/index.js",
"module": "es/index.js",
@ -25,8 +25,8 @@
"license": "ISC",
"dependencies": {
"@antv/async-hook": "^2.1.0",
"@antv/l7-core": "2.2.21",
"@antv/l7-utils": "2.2.21",
"@antv/l7-core": "2.2.24",
"@antv/l7-utils": "2.2.24",
"@babel/runtime": "^7.7.7",
"@mapbox/geojson-rewind": "^0.4.0",
"@turf/helpers": "^6.1.4",

View File

@ -1,6 +1,6 @@
{
"name": "@antv/l7-three",
"version": "2.2.21",
"version": "2.2.24",
"description": "three for L7 ",
"keywords": [
"3D",
@ -43,7 +43,7 @@
},
"homepage": "https://github.com/antvis/L7#readme",
"dependencies": {
"@antv/l7": "2.2.21",
"@antv/l7": "2.2.24",
"@babel/runtime": "^7.7.7",
"rollup": "^2.3.3",
"rollup-plugin-less": "^1.1.2"

View File

@ -1,6 +1,6 @@
{
"name": "@antv/l7-utils",
"version": "2.2.21",
"version": "2.2.24",
"description": "",
"main": "lib/index.js",
"module": "es/index.js",

View File

@ -14,7 +14,7 @@ export default class AnimatePoint extends React.Component {
public async componentDidMount() {
const scene = new Scene({
id: document.getElementById('map') as HTMLDivElement,
map: new GaodeMap({
map: new Mapbox({
pitch: 0,
style: 'dark',
center: [112, 23.69],
@ -61,6 +61,7 @@ export default class AnimatePoint extends React.Component {
left: 0,
right: 0,
bottom: 0,
transform: 'scale(1.5)',
}}
/>
);

View File

@ -72,6 +72,7 @@ export default class PointImage extends React.Component {
left: 0,
right: 0,
bottom: 0,
transform: 'scale(0.8)',
}}
/>
);

View File

@ -123,41 +123,27 @@ export default class TextLayerDemo extends React.Component {
});
scene.on('loaded', () => {
const layer = new PolygonLayer({})
.source({
type: 'FeatureCollection',
features: [],
})
.shape('extrude')
.source(data)
.shape('fill')
.scale('childrenNum', {
type: 'quantile',
})
.size('childrenNum', [10, 100000000])
// .color('red')
// .color('childrenNum', [
// '#D92568',
// '#E3507E',
// '#FC7AAB',
// '#F1D3E5',
// '#A7B5E3',
// '#F2EEFF',
// ])
.color('childrenNum*name', (childrenNum, name) => {
console.log(childrenNum, name);
return 'red';
})
.color('childrenNum', [
'#D92568',
'#E3507E',
'#FC7AAB',
'#F1D3E5',
'#A7B5E3',
'#F2EEFF',
])
.style({
opacity: 1.0,
});
scene.addLayer(layer);
setTimeout(() => {
layer.setData(data);
console.log('update');
}, 2000);
layer.on('click', (e) => {
console.log(e);
});
this.scene = scene;
layer.on('remapping', () => {
console.log('remapinbg event');
});
const gui = new dat.GUI();
this.gui = gui;
const styleOptions = {
@ -206,6 +192,7 @@ export default class TextLayerDemo extends React.Component {
])
.onChange((color: any) => {
layer.color('childrenNum', RMBColor[color] as string[]);
// layer.shape('fill');
scene.render();
});
});