mirror of https://gitee.com/antv-l7/antv-l7
Merge branch 'master' of github.com:antvis/L7
This commit is contained in:
commit
c44689c7e2
|
@ -81,3 +81,4 @@ packages/l7/package_bak.json
|
|||
stories/Test
|
||||
packages/draw/node_modules/@turf
|
||||
packages/district/src/data
|
||||
yarn.lock
|
|
@ -1,5 +1,5 @@
|
|||
# L7
|
||||
|
||||
.
|
||||
[![travis ci](https://travis-ci.com/antvis/L7.svg?branch=master)](https://travis-ci.com/antvis/L7) [![](https://flat.badgen.net/npm/v/@antv/l7?icon=npm)](https://www.npmjs.com/package/@antv/l7) ![最近提交](https://badgen.net/github/last-commit/antvis/L7)
|
||||
|
||||
Large-scale WebGL-powered Geospatial data visualization analysis framework.
|
||||
|
@ -86,6 +86,12 @@ scene.addLayer(pointLayer);
|
|||
- [Examples](https://l7.antv.vision/en/examples/gallery/basic)
|
||||
- [Contributor documentation](./.github/CONTRIBUTING.md)
|
||||
|
||||
## 🔗 Links
|
||||
|
||||
- [L7 React](https://github.com/antvis/L7-React)
|
||||
- [L7 Boundary](https://github.com/antvis/L7-boundary)
|
||||
- [L7 draw](https://github.com/antvis/L7-draw)
|
||||
|
||||
## ✅ License
|
||||
|
||||
[MIT license](./LICENSE).
|
||||
|
|
|
@ -120,6 +120,12 @@ scene.addLayer(pointLayer);
|
|||
- [示例](https://l7.antv.vision/en/examples/gallery/basic)
|
||||
- [贡献](./.github/CONTRIBUTING.md)
|
||||
|
||||
## 🔗 Links
|
||||
|
||||
- [L7 React](https://github.com/antvis/L7-React)
|
||||
- [L7 Boundary](https://github.com/antvis/L7-boundary)
|
||||
- [L7 draw](https://github.com/antvis/L7-draw)
|
||||
|
||||
## ✅ License
|
||||
|
||||
[MIT license](./LICENSE).
|
||||
|
|
|
@ -19,7 +19,7 @@ module.exports = api => {
|
|||
[
|
||||
'@babel/plugin-proposal-decorators',
|
||||
{
|
||||
legacy: true
|
||||
legacy: true,
|
||||
}
|
||||
],
|
||||
[
|
||||
|
|
|
@ -15,7 +15,7 @@ L7 目前支持 Control
|
|||
|
||||
## 构造函数
|
||||
|
||||
#### option
|
||||
### option
|
||||
|
||||
position: `string` 控件位置支持是个方位
|
||||
|
||||
|
|
|
@ -12,6 +12,7 @@ order: 0
|
|||
Popup
|
||||
|
||||
```javascript
|
||||
const option = {};
|
||||
const popup = new L7.Popup(option);
|
||||
```
|
||||
|
||||
|
|
|
@ -12,10 +12,11 @@ order: 0
|
|||
Popup
|
||||
|
||||
```javascript
|
||||
const option = {};
|
||||
const popup = new L7.Popup(option);
|
||||
```
|
||||
|
||||
#### option
|
||||
### option
|
||||
|
||||
- closeButton
|
||||
- closeOnClick
|
||||
|
|
|
@ -542,6 +542,7 @@ layer.setSelect(id);
|
|||
|
||||
```javascript
|
||||
layer.on('click', (ev) => {}); // 鼠标左键点击图层事件
|
||||
layer.on('mouseenter', (ev) => {}); // 鼠标进入图层要素
|
||||
layer.on('mousemove', (ev) => {}); // 鼠标在图层上移动时触发
|
||||
layer.on('mouseout', (ev) => {}); // 鼠标移出图层要素时触发
|
||||
layer.on('mouseup', (ev) => {}); // 鼠标在图层上单击抬起时触发
|
||||
|
|
|
@ -2,4 +2,4 @@
|
|||
title: LineLayer
|
||||
order: 0
|
||||
---
|
||||
`markdown:docs/api/layer/line_layer/linelayer.zh.md`
|
||||
`markdown:docs/api/layer/line_layer/linelayer.en.md`
|
||||
|
|
|
@ -2,4 +2,4 @@
|
|||
title: 数据
|
||||
order: 2
|
||||
---
|
||||
`markdown:docs/tutorial/data.zh.md`
|
||||
`markdown:docs/tutorial/data.en.md`
|
||||
|
|
|
@ -2,4 +2,4 @@
|
|||
title: 离线使用
|
||||
order: 0
|
||||
---
|
||||
`markdown:docs/tutorial/map/offline.zh.md`
|
||||
`markdown:docs/tutorial/map/offline.en.md`
|
||||
|
|
|
@ -55,7 +55,7 @@ const scene = new Scene({
|
|||
id: 'map',
|
||||
map: new GaodeMap({
|
||||
pitch: 35.210526315789465,
|
||||
style: 'dark',
|
||||
mapStyle: 'dark',
|
||||
center: [ 104.288144, 31.239692 ],
|
||||
zoom: 4.4
|
||||
})
|
||||
|
|
|
@ -61,7 +61,7 @@ const scene = new Scene({
|
|||
id: 'map',
|
||||
map: new GaodeMap({
|
||||
pitch: 35.210526315789465,
|
||||
style: 'dark',
|
||||
mapStyle: 'dark',
|
||||
center: [ 104.288144, 31.239692 ],
|
||||
zoom: 4.4
|
||||
})
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
"message": "chore: publish"
|
||||
}
|
||||
},
|
||||
"version": "2.3.9",
|
||||
"version": "2.3.10",
|
||||
"npmClient": "yarn",
|
||||
"useWorkspaces": true,
|
||||
"publishConfig": {
|
||||
|
|
13
package.json
13
package.json
|
@ -7,10 +7,10 @@
|
|||
},
|
||||
"devDependencies": {
|
||||
"@antv/g2": "^3.5.9",
|
||||
"@antv/gatsby-theme-antv": "^1.1.1",
|
||||
"@antv/l7-district": "^2.2.46",
|
||||
"@antv/l7-draw": "^2.3.40",
|
||||
"@antv/l7-react": "^2.2.37",
|
||||
"@antv/gatsby-theme-antv": "^1.0.6",
|
||||
"@babel/cli": "^7.6.4",
|
||||
"@babel/core": "^7.6.4",
|
||||
"@babel/plugin-proposal-decorators": "^7.6.0",
|
||||
|
@ -23,13 +23,14 @@
|
|||
"@babel/preset-env": "^7.5.5",
|
||||
"@babel/preset-react": "^7.0.0",
|
||||
"@babel/preset-typescript": "^7.3.3",
|
||||
"@babel/standalone": "^7.13.15",
|
||||
"@commitlint/cli": "^8.1.0",
|
||||
"@commitlint/config-conventional": "^8.1.0",
|
||||
"@rollup/plugin-alias": "2.2.0",
|
||||
"@rollup/plugin-commonjs": "11.0.2",
|
||||
"@rollup/plugin-json": "^4.0.0",
|
||||
"@rollup/plugin-node-resolve": "^6.0.0",
|
||||
"@storybook/react": "^5.1.9",
|
||||
"@storybook/react": "^6.2.2",
|
||||
"@turf/turf": "^5.1.6",
|
||||
"@types/dat.gui": "^0.7.1",
|
||||
"@types/enzyme": "^3.1.14",
|
||||
|
@ -37,7 +38,7 @@
|
|||
"@types/gl": "^4.1.0",
|
||||
"@types/jest": "^25.2.1",
|
||||
"@types/node": "13.11.1",
|
||||
"@types/storybook__react": "^4.0.2",
|
||||
"@types/storybook__react": "^5.2.1",
|
||||
"@types/supercluster": "^5.0.1",
|
||||
"antd": "^4.12.3",
|
||||
"awesome-typescript-loader": "^5.2.1",
|
||||
|
@ -70,7 +71,7 @@
|
|||
"eslint": "^6.6.0",
|
||||
"eslint-config-egg": "^7.5.1",
|
||||
"eslint-plugin-html": "^6.0.0",
|
||||
"gatsby": "^2.19.15",
|
||||
"gatsby": "2.25.0",
|
||||
"gatsby-plugin-google-analytics": "^2.1.27",
|
||||
"gatsby-remark-prettier": "^1.0.0",
|
||||
"geotiff": "1.0.0-beta.10",
|
||||
|
@ -131,7 +132,7 @@
|
|||
},
|
||||
"scripts": {
|
||||
"start": "yarn run site:clean && yarn run site:develop",
|
||||
"site:develop": "cross-env BABEL_ENV=site gatsby develop --open -H 0.0.0.0",
|
||||
"site:develop": "cross-env BABEL_ENV=site GATSBY_LOGGER=ink gatsby develop --open --host 127.0.0.1",
|
||||
"site:build": "yarn run site:clean && cross-env BABEL_ENV=site gatsby build --prefix-paths",
|
||||
"site:clean": "gatsby clean",
|
||||
"site:deploy": "yarn run site:build && gh-pages -d public",
|
||||
|
@ -145,7 +146,7 @@
|
|||
"fix": "run-p -c 'lint:ts-* --fix'",
|
||||
"lint:css": "stylelint 'packages/**/*.js{,x}'",
|
||||
"lint:ts-prod": "tslint --fix --config tslint.prod.json 'packages/**/*.ts{,x}'",
|
||||
"lint:ts-test": "tslint --fix --config tslint.test.json 'packages/**/*.{spec,story}.ts{,x}'",
|
||||
"lint:ts-test": "tslint --fix --config tslint.json 'packages/**/*.{spec,story}.ts{,x}'",
|
||||
"lint:ts": "run-p -c lint:ts-*",
|
||||
"lint": "run-p -c lint:*",
|
||||
"commit": "git-cz",
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-component",
|
||||
"version": "2.3.9",
|
||||
"version": "2.3.10",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
@ -25,8 +25,8 @@
|
|||
"author": "lzxue",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@antv/l7-core": "2.3.9",
|
||||
"@antv/l7-utils": "2.3.9",
|
||||
"@antv/l7-core": "^2.3.10",
|
||||
"@antv/l7-utils": "^2.3.10",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"eventemitter3": "^4.0.0",
|
||||
"inversify": "^5.0.1",
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-core",
|
||||
"version": "2.3.9",
|
||||
"version": "2.3.10",
|
||||
"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.3.9",
|
||||
"@antv/l7-utils": "^2.3.10",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"@mapbox/tiny-sdf": "^1.1.1",
|
||||
"ajv": "^6.10.2",
|
||||
|
|
|
@ -51,7 +51,7 @@ export interface IMapService<RawMap = {}> {
|
|||
// get map params
|
||||
getType(): string;
|
||||
getZoom(): number;
|
||||
getCenter(): ILngLat;
|
||||
getCenter(option?: ICameraOptions): ILngLat;
|
||||
getPitch(): number;
|
||||
getRotation(): number;
|
||||
getBounds(): Bounds;
|
||||
|
@ -66,7 +66,7 @@ export interface IMapService<RawMap = {}> {
|
|||
panBy(pixel: Point): void;
|
||||
fitBounds(bound: Bounds, fitBoundsOptions?: unknown): void;
|
||||
setZoomAndCenter(zoom: number, center: Point): void;
|
||||
setCenter(center: [number, number]): void;
|
||||
setCenter(center: [number, number], option?: ICameraOptions): void;
|
||||
setPitch(pitch: number): void;
|
||||
setZoom(zoom: number): void;
|
||||
setMapStyle(style: any): void;
|
||||
|
@ -181,3 +181,14 @@ export interface IMapCamera {
|
|||
// 偏移原点,例如 P20 坐标系下
|
||||
offsetOrigin: [number, number];
|
||||
}
|
||||
export interface ICameraOptions {
|
||||
padding:
|
||||
| number
|
||||
| [number, number, number, number]
|
||||
| {
|
||||
top?: number;
|
||||
bottom?: number;
|
||||
right?: number;
|
||||
left?: number;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -30,3 +30,8 @@ void setPickingColor(vec3 pickingColor) {
|
|||
float setPickingSize(float x) {
|
||||
return u_PickingStage == PICKING_ENCODE ? x + u_PickingBuffer : x;
|
||||
}
|
||||
|
||||
float setPickingOrder(float z) {
|
||||
bool selected = bool(v_PickingResult.a);
|
||||
return selected ? z + 1. : 0.;
|
||||
}
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7",
|
||||
"version": "2.3.9",
|
||||
"version": "2.3.10",
|
||||
"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.3.9",
|
||||
"@antv/l7-core": "2.3.9",
|
||||
"@antv/l7-layers": "2.3.9",
|
||||
"@antv/l7-maps": "2.3.9",
|
||||
"@antv/l7-scene": "2.3.9",
|
||||
"@antv/l7-utils": "2.3.9",
|
||||
"@antv/l7-component": "^2.3.10",
|
||||
"@antv/l7-core": "^2.3.10",
|
||||
"@antv/l7-layers": "^2.3.10",
|
||||
"@antv/l7-maps": "^2.3.10",
|
||||
"@antv/l7-scene": "^2.3.10",
|
||||
"@antv/l7-utils": "^2.3.10",
|
||||
"@babel/runtime": "^7.7.7"
|
||||
},
|
||||
"gitHead": "20154fe30d512024b03ac5e40f77731bc0580bb0",
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-layers",
|
||||
"version": "2.3.9",
|
||||
"version": "2.3.10",
|
||||
"description": "L7's collection of built-in layers",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
@ -24,9 +24,10 @@
|
|||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@antv/async-hook": "^2.1.0",
|
||||
"@antv/l7-core": "2.3.9",
|
||||
"@antv/l7-source": "2.3.9",
|
||||
"@antv/l7-utils": "2.3.9",
|
||||
"@antv/l7-core": "^2.3.10",
|
||||
"@antv/l7-layers": "^2.3.10",
|
||||
"@antv/l7-source": "^2.3.10",
|
||||
"@antv/l7-utils": "^2.3.10",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"@mapbox/martini": "^0.2.0",
|
||||
"@turf/meta": "^6.0.2",
|
||||
|
|
|
@ -13,12 +13,12 @@ export default class DataSourcePlugin implements ILayerPlugin {
|
|||
this.updateClusterData(layer);
|
||||
});
|
||||
|
||||
// 检测数据不否需要更新
|
||||
// 检测数据是否需要更新
|
||||
layer.hooks.beforeRenderData.tap('DataSourcePlugin', () => {
|
||||
const neeUpdate1 = this.updateClusterData(layer);
|
||||
const neeUpdate2 = layer.dataState.dataSourceNeedUpdate;
|
||||
const neeUpdateCluster = this.updateClusterData(layer);
|
||||
const dataSourceNeedUpdate = layer.dataState.dataSourceNeedUpdate;
|
||||
layer.dataState.dataSourceNeedUpdate = false;
|
||||
return neeUpdate1 || neeUpdate2;
|
||||
return neeUpdateCluster || dataSourceNeedUpdate;
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -27,7 +27,13 @@ export default class DataSourcePlugin implements ILayerPlugin {
|
|||
const cluster = source.cluster;
|
||||
const { zoom = 0, maxZoom = 16 } = source.clusterOptions;
|
||||
const newZoom = this.mapService.getZoom() - 1;
|
||||
if (cluster && Math.abs(zoom - newZoom) > 1 && maxZoom > zoom) {
|
||||
const dataSourceNeedUpdate = layer.dataState.dataSourceNeedUpdate;
|
||||
// 如果 dataSource 有更新,跳过 zoom 的判断,直接更新一次
|
||||
if (
|
||||
cluster &&
|
||||
(dataSourceNeedUpdate || Math.abs(zoom - newZoom) > 1) &&
|
||||
maxZoom > zoom
|
||||
) {
|
||||
source.updateClusterData(Math.floor(newZoom));
|
||||
return true;
|
||||
}
|
||||
|
|
|
@ -30,7 +30,9 @@ void main() {
|
|||
vec2 offset = project_pixel(extrude * (newSize + u_stroke_width) + u_offsets);
|
||||
vec4 project_pos = project_position(vec4(a_Position.xy, 0.0, 1.0));
|
||||
|
||||
gl_Position = project_common_position_to_clipspace(vec4(project_pos.xy + offset, 0.0, 1.0));
|
||||
|
||||
|
||||
|
||||
|
||||
// TODO: billboard
|
||||
// anti-alias
|
||||
|
@ -40,4 +42,7 @@ void main() {
|
|||
v_data = vec4(extrude, antialiasblur,shape_type);
|
||||
|
||||
setPickingColor(a_PickingColor);
|
||||
|
||||
gl_Position = project_common_position_to_clipspace(vec4(project_pos.xy + offset, 0.0, 1.0));
|
||||
|
||||
}
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-map",
|
||||
"version": "2.3.9",
|
||||
"version": "2.3.10",
|
||||
"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.3.9",
|
||||
"@antv/l7-utils": "^2.3.10",
|
||||
"@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.3.9",
|
||||
"version": "2.3.10",
|
||||
"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.3.9",
|
||||
"@antv/l7-map": "2.3.9",
|
||||
"@antv/l7-utils": "2.3.9",
|
||||
"@antv/l7-core": "^2.3.10",
|
||||
"@antv/l7-map": "^2.3.10",
|
||||
"@antv/l7-utils": "^2.3.10",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"@types/amap-js-api": "^1.4.6",
|
||||
"@types/mapbox-gl": "^1.11.2",
|
||||
|
|
|
@ -5,6 +5,7 @@ import AMapLoader from '@amap/amap-jsapi-loader';
|
|||
import {
|
||||
Bounds,
|
||||
CoordinateSystem,
|
||||
ICameraOptions,
|
||||
ICoordinateSystemService,
|
||||
IGlobalConfigService,
|
||||
ILngLat,
|
||||
|
@ -23,6 +24,7 @@ import { DOM } from '@antv/l7-utils';
|
|||
import { mat4, vec2, vec3 } from 'gl-matrix';
|
||||
import { inject, injectable } from 'inversify';
|
||||
import { IAMapEvent, IAMapInstance } from '../../typings/index';
|
||||
import { toPaddingOptions } from '../utils';
|
||||
import './logo.css';
|
||||
import { MapTheme } from './theme';
|
||||
import Viewport from './Viewport';
|
||||
|
@ -135,15 +137,45 @@ export default class AMapService
|
|||
return this.map.setZoom(zoom);
|
||||
}
|
||||
|
||||
public getCenter(): ILngLat {
|
||||
public getCenter(options?: ICameraOptions): ILngLat {
|
||||
if (options?.padding) {
|
||||
const originCenter = this.getCenter();
|
||||
const [w, h] = this.getSize();
|
||||
const padding = toPaddingOptions(options.padding);
|
||||
const px = this.lngLatToPixel([originCenter.lng, originCenter.lat]);
|
||||
const offsetPx = [
|
||||
(padding.right - padding.left) / 2,
|
||||
(padding.bottom - padding.top) / 2,
|
||||
];
|
||||
|
||||
const newCenter = this.pixelToLngLat([
|
||||
px.x - offsetPx[0],
|
||||
px.y - offsetPx[1],
|
||||
]);
|
||||
return newCenter;
|
||||
}
|
||||
const center = this.map.getCenter();
|
||||
return {
|
||||
lng: center.getLng(),
|
||||
lat: center.getLat(),
|
||||
};
|
||||
}
|
||||
public setCenter(lnglat: [number, number]): void {
|
||||
this.map.setCenter(lnglat);
|
||||
public setCenter(lnglat: [number, number], options?: ICameraOptions): void {
|
||||
if (options?.padding) {
|
||||
const padding = toPaddingOptions(options.padding);
|
||||
const px = this.lngLatToPixel(lnglat);
|
||||
const offsetPx = [
|
||||
(padding.right - padding.left) / 2,
|
||||
(padding.bottom - padding.top) / 2,
|
||||
];
|
||||
const newCenter = this.pixelToLngLat([
|
||||
px.x + offsetPx[0],
|
||||
px.y + offsetPx[1],
|
||||
]);
|
||||
this.map.setCenter([newCenter.lng, newCenter.lat]);
|
||||
} else {
|
||||
this.map.setCenter(lnglat);
|
||||
}
|
||||
}
|
||||
public getPitch(): number {
|
||||
return this.map.getPitch();
|
||||
|
|
|
@ -0,0 +1,49 @@
|
|||
export type IPadding =
|
||||
| number
|
||||
| [number, number, number, number]
|
||||
| {
|
||||
top?: number;
|
||||
bottom?: number;
|
||||
right?: number;
|
||||
left?: number;
|
||||
};
|
||||
|
||||
export function toPaddingOptions(padding: IPadding = {}) {
|
||||
const defaultPadding = {
|
||||
top: 0,
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
};
|
||||
if (typeof padding === 'number') {
|
||||
return {
|
||||
top: padding,
|
||||
right: padding,
|
||||
bottom: padding,
|
||||
left: padding,
|
||||
};
|
||||
}
|
||||
if (Array.isArray(padding)) {
|
||||
if (padding.length === 4) {
|
||||
return {
|
||||
top: padding[0],
|
||||
right: padding[1],
|
||||
bottom: padding[2],
|
||||
left: padding[3],
|
||||
};
|
||||
}
|
||||
if (padding.length === 2) {
|
||||
return {
|
||||
top: padding[0],
|
||||
right: padding[1],
|
||||
bottom: padding[0],
|
||||
left: padding[1],
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
...defaultPadding,
|
||||
...padding,
|
||||
};
|
||||
}
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-renderer",
|
||||
"version": "2.3.9",
|
||||
"version": "2.3.10",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
@ -26,7 +26,7 @@
|
|||
"gl": "^4.4.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"@antv/l7-core": "2.3.9",
|
||||
"@antv/l7-core": "^2.3.10",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"inversify": "^5.0.1",
|
||||
"lodash": "^4.17.15",
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-scene",
|
||||
"version": "2.3.9",
|
||||
"version": "2.3.10",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
@ -23,11 +23,12 @@
|
|||
"author": "xiaoiver",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@antv/l7-component": "2.3.9",
|
||||
"@antv/l7-core": "2.3.9",
|
||||
"@antv/l7-maps": "2.3.9",
|
||||
"@antv/l7-renderer": "2.3.9",
|
||||
"@antv/l7-utils": "2.3.9",
|
||||
"@antv/l7-component": "^2.3.10",
|
||||
"@antv/l7-core": "^2.3.10",
|
||||
"@antv/l7-layers": "^2.3.10",
|
||||
"@antv/l7-maps": "^2.3.10",
|
||||
"@antv/l7-renderer": "^2.3.10",
|
||||
"@antv/l7-utils": "^2.3.10",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"inversify": "^5.0.1",
|
||||
"mapbox-gl": "^1.2.1",
|
||||
|
|
|
@ -1,4 +1,11 @@
|
|||
import { Bounds, ILngLat, IPoint, IStatusOptions, Point } from '@antv/l7-core';
|
||||
import {
|
||||
Bounds,
|
||||
ICameraOptions,
|
||||
ILngLat,
|
||||
IPoint,
|
||||
IStatusOptions,
|
||||
Point,
|
||||
} from '@antv/l7-core';
|
||||
|
||||
export default interface IMapController {
|
||||
/**
|
||||
|
@ -9,7 +16,7 @@ export default interface IMapController {
|
|||
/**
|
||||
* 中心点经纬度
|
||||
*/
|
||||
getCenter(): ILngLat;
|
||||
getCenter(options?: ICameraOptions): ILngLat;
|
||||
|
||||
/**
|
||||
* 仰角
|
||||
|
@ -64,7 +71,7 @@ export default interface IMapController {
|
|||
// control with raw map
|
||||
setRotation(rotation: number): void;
|
||||
setZoomAndCenter(zoom: number, center: Point): void;
|
||||
setCenter(center: [number, number]): void;
|
||||
setCenter(center: [number, number], options?: ICameraOptions): void;
|
||||
setPitch(pitch: number): void;
|
||||
setZoom(zoom: number): void;
|
||||
setMapStyle(style: any): void;
|
||||
|
|
|
@ -3,6 +3,7 @@ import {
|
|||
Bounds,
|
||||
createLayerContainer,
|
||||
createSceneContainer,
|
||||
ICameraOptions,
|
||||
IControl,
|
||||
IControlService,
|
||||
IFontService,
|
||||
|
@ -254,12 +255,12 @@ class Scene
|
|||
return this.mapService.getZoom();
|
||||
}
|
||||
|
||||
public getCenter(): ILngLat {
|
||||
return this.mapService.getCenter();
|
||||
public getCenter(options?: ICameraOptions): ILngLat {
|
||||
return this.mapService.getCenter(options);
|
||||
}
|
||||
|
||||
public setCenter(center: [number, number]) {
|
||||
return this.mapService.setCenter(center);
|
||||
public setCenter(center: [number, number], options?: ICameraOptions) {
|
||||
return this.mapService.setCenter(center, options);
|
||||
}
|
||||
|
||||
public getPitch(): number {
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-source",
|
||||
"version": "2.3.9",
|
||||
"version": "2.3.10",
|
||||
"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.3.9",
|
||||
"@antv/l7-utils": "2.3.9",
|
||||
"@antv/l7-core": "^2.3.10",
|
||||
"@antv/l7-utils": "^2.3.10",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"@mapbox/geojson-rewind": "^0.4.0",
|
||||
"@turf/helpers": "^6.1.4",
|
||||
|
|
|
@ -11,7 +11,11 @@ import {
|
|||
lazyInject,
|
||||
TYPES,
|
||||
} from '@antv/l7-core';
|
||||
import { bBoxToBounds, extent, padBounds } from '@antv/l7-utils';
|
||||
import {
|
||||
bBoxToBounds,
|
||||
extent,
|
||||
padBounds,
|
||||
} from '@antv/l7-utils';
|
||||
import {
|
||||
BBox,
|
||||
Feature,
|
||||
|
@ -54,6 +58,8 @@ export default class Source extends EventEmitter {
|
|||
zoom: -99,
|
||||
method: 'count',
|
||||
};
|
||||
// 是否有效范围
|
||||
private invalidExtent: boolean = false;
|
||||
|
||||
// 原始数据
|
||||
private originData: any;
|
||||
|
@ -89,16 +95,15 @@ export default class Source extends EventEmitter {
|
|||
this.emit('update');
|
||||
}
|
||||
public getClusters(zoom: number): any {
|
||||
return this.clusterIndex.getClusters(this.extent, zoom);
|
||||
return this.clusterIndex.getClusters(this.caculClusterExtent(2), zoom);
|
||||
}
|
||||
public getClustersLeaves(id: number): any {
|
||||
return this.clusterIndex.getLeaves(id, Infinity);
|
||||
}
|
||||
public updateClusterData(zoom: number): void {
|
||||
const { method = 'sum', field } = this.clusterOptions;
|
||||
const newBounds = padBounds(bBoxToBounds(this.extent), 2);
|
||||
let data = this.clusterIndex.getClusters(
|
||||
newBounds[0].concat(newBounds[1]),
|
||||
this.caculClusterExtent(2),
|
||||
Math.floor(zoom),
|
||||
);
|
||||
this.clusterOptions.zoom = zoom;
|
||||
|
@ -169,6 +174,19 @@ export default class Source extends EventEmitter {
|
|||
this.data = null;
|
||||
}
|
||||
|
||||
private caculClusterExtent(bufferRatio: number): any {
|
||||
let newBounds = [
|
||||
[-Infinity, -Infinity],
|
||||
[Infinity, Infinity],
|
||||
];
|
||||
|
||||
if (!this.invalidExtent) {
|
||||
|
||||
newBounds = padBounds(bBoxToBounds(this.extent), bufferRatio);
|
||||
}
|
||||
return newBounds[0].concat(newBounds[1]);
|
||||
}
|
||||
|
||||
private initCfg(option?: ISourceCFG) {
|
||||
this.cfg = mergeWith(this.cfg, option, mergeCustomizer);
|
||||
const cfg = this.cfg;
|
||||
|
@ -196,6 +214,8 @@ export default class Source extends EventEmitter {
|
|||
this.data = sourceParser(this.originData, parser);
|
||||
// 计算范围
|
||||
this.extent = extent(this.data.dataArray);
|
||||
this.invalidExtent = this.extent[0]===this.extent[2] || this.extent[1]===this.extent[3]
|
||||
|
||||
}
|
||||
/**
|
||||
* 数据统计
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-three",
|
||||
"version": "2.3.9",
|
||||
"version": "2.3.10",
|
||||
"description": "three for L7 ",
|
||||
"keywords": [
|
||||
"3D",
|
||||
|
@ -44,7 +44,7 @@
|
|||
},
|
||||
"homepage": "https://github.com/antvis/L7#readme",
|
||||
"dependencies": {
|
||||
"@antv/l7": "2.3.9",
|
||||
"@antv/l7": "^2.3.10",
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"inversify": "^5.0.1",
|
||||
"rollup": "^2.3.3",
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@antv/l7-utils",
|
||||
"version": "2.3.9",
|
||||
"version": "2.3.10",
|
||||
"description": "",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
|
|
|
@ -19,7 +19,7 @@ export default class Point3D extends React.Component {
|
|||
style: 'light',
|
||||
center: [-121.24357, 37.58264],
|
||||
pitch: 0,
|
||||
zoom: 10.45,
|
||||
zoom: 6.45,
|
||||
}),
|
||||
});
|
||||
scene.on('loaded', () => {
|
||||
|
@ -29,7 +29,7 @@ export default class Point3D extends React.Component {
|
|||
.then((res) => res.text())
|
||||
.then((data) => {
|
||||
const pointLayer = new PointLayer({})
|
||||
.source(data, {
|
||||
.source(data.slice(0, 1000), {
|
||||
parser: {
|
||||
type: 'csv',
|
||||
x: 'Longitude',
|
||||
|
@ -37,8 +37,8 @@ export default class Point3D extends React.Component {
|
|||
},
|
||||
})
|
||||
.shape('circle')
|
||||
.size(8)
|
||||
.active({
|
||||
.size(16)
|
||||
.select({
|
||||
color: 'red',
|
||||
})
|
||||
.color('Magnitude', [
|
||||
|
@ -59,34 +59,7 @@ export default class Point3D extends React.Component {
|
|||
stroke: '#fff',
|
||||
});
|
||||
|
||||
const textLayer = new PointLayer({})
|
||||
.source(data, {
|
||||
parser: {
|
||||
type: 'csv',
|
||||
x: 'Longitude',
|
||||
y: 'Latitude',
|
||||
},
|
||||
})
|
||||
.shape('EventID', 'text')
|
||||
.size(8)
|
||||
|
||||
.color('red')
|
||||
.style({
|
||||
opacity: 1,
|
||||
strokeWidth: 0,
|
||||
stroke: '#fff',
|
||||
});
|
||||
|
||||
scene.addLayer(pointLayer);
|
||||
scene.addLayer(textLayer);
|
||||
pointLayer.on('click', (e) => {
|
||||
const res = pointLayer.boxSelect(
|
||||
[e.x - 10, e.y - 10, e.x + 10, e.y + 10],
|
||||
(fe) => {
|
||||
console.log(fe);
|
||||
},
|
||||
);
|
||||
});
|
||||
this.scene = scene;
|
||||
});
|
||||
});
|
||||
|
|
|
@ -0,0 +1,142 @@
|
|||
// @ts-ignore
|
||||
import { ILngLat, PointLayer, PolygonLayer, Scene } from '@antv/l7';
|
||||
import { GaodeMap } from '@antv/l7-maps';
|
||||
import * as React from 'react';
|
||||
|
||||
export default class GaodeMapComponent extends React.Component {
|
||||
// @ts-ignore
|
||||
private scene: Scene;
|
||||
|
||||
public componentWillUnmount() {
|
||||
this.scene.destroy();
|
||||
}
|
||||
|
||||
public async componentDidMount() {
|
||||
const scene = new Scene({
|
||||
id: 'map',
|
||||
map: new GaodeMap({
|
||||
center: [121.107846, 30.267069],
|
||||
pitch: 0,
|
||||
style: 'normal',
|
||||
zoom: 11,
|
||||
animateEnable: false,
|
||||
}),
|
||||
});
|
||||
|
||||
const layer = new PointLayer()
|
||||
.source(
|
||||
[
|
||||
{
|
||||
lng: 121.107846,
|
||||
lat: 30.267069,
|
||||
},
|
||||
],
|
||||
{
|
||||
parser: {
|
||||
type: 'json',
|
||||
x: 'lng',
|
||||
y: 'lat',
|
||||
},
|
||||
},
|
||||
)
|
||||
.shape('circle')
|
||||
.color('blue')
|
||||
.size(10)
|
||||
.style({
|
||||
stroke: '#fff',
|
||||
storkeWidth: 2,
|
||||
});
|
||||
scene.addLayer(layer);
|
||||
scene.render();
|
||||
this.scene = scene;
|
||||
|
||||
scene.on('loaded', () => {
|
||||
const padding = {
|
||||
top: 50,
|
||||
right: 0,
|
||||
bottom: 200,
|
||||
left: 800,
|
||||
};
|
||||
// const px = scene.lngLatToPixel([center.lng, center.lat]);
|
||||
// const offsetPx = [
|
||||
// (padding.right - padding.left) / 2,
|
||||
// (padding.bottom - padding.top) / 2,
|
||||
// ];
|
||||
scene.setCenter([121.107846, 30.267069], { padding });
|
||||
// const newCenter = scene.pixelToLngLat([
|
||||
// px.x + offsetPx[0],
|
||||
// px.y + offsetPx[1],
|
||||
// ]);
|
||||
// @ts-ignore
|
||||
// scene.setCenter();
|
||||
|
||||
// get originCenter
|
||||
|
||||
// const originCenter = scene.getCenter();
|
||||
// const originPx = scene.lngLatToPixel([
|
||||
// originCenter.lng,
|
||||
// originCenter.lat,
|
||||
// ]);
|
||||
// const offsetPx2 = [
|
||||
// (-padding.right + padding.left) / 2,
|
||||
// (-padding.bottom + padding.top) / 2,
|
||||
// ];
|
||||
// const newCenter2 = scene.pixelToLngLat([
|
||||
// originPx.x - offsetPx[0],
|
||||
// originPx.y - offsetPx[1],
|
||||
// ]);
|
||||
|
||||
// lngLatToContainer
|
||||
// 获取当前地图像素坐标
|
||||
// console.log(originCenter, center, newCenter2);
|
||||
// console.log(w,h);
|
||||
});
|
||||
}
|
||||
|
||||
public render() {
|
||||
return (
|
||||
<>
|
||||
<div
|
||||
id="map"
|
||||
style={{
|
||||
position: 'absolute',
|
||||
top: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
}}
|
||||
/>
|
||||
<div
|
||||
style={{
|
||||
position: 'absolute',
|
||||
bottom: '0px',
|
||||
zIndex: 10,
|
||||
background: '#fff',
|
||||
height: '200px',
|
||||
width: '100%',
|
||||
}}
|
||||
/>
|
||||
<div
|
||||
style={{
|
||||
position: 'absolute',
|
||||
top: '0px',
|
||||
zIndex: 10,
|
||||
background: '#f00',
|
||||
height: '50px',
|
||||
width: '100%',
|
||||
}}
|
||||
/>
|
||||
<div
|
||||
style={{
|
||||
position: 'absolute',
|
||||
left: '0px',
|
||||
zIndex: 10,
|
||||
background: '#ff0',
|
||||
height: '100%',
|
||||
width: '800px',
|
||||
}}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
|
@ -0,0 +1,6 @@
|
|||
import { storiesOf } from '@storybook/react';
|
||||
import * as React from 'react';
|
||||
import MapCenter from './components/mapCenter';
|
||||
|
||||
// @ts-ignore
|
||||
storiesOf('地图方法', module).add('地图中心点', () => <MapCenter />);
|
|
@ -1,9 +0,0 @@
|
|||
{
|
||||
"extends": ["./tslint.json"],
|
||||
"rules": {
|
||||
"no-implicit-dependencies": [false, "dev"]
|
||||
},
|
||||
"linterOptions": {
|
||||
"exclude": ["**/*.d.ts", "**/data/*.ts"]
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue