p90524618
/
antv-l7
mirror of https://gitee.com/antv-l7/antv-l7
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

refactor(amap): rename Amap to GaodeMap 避免和高德全局对象Amap冲突

This commit is contained in:
thinkinggis 2019-11-27 14:54:53 +08:00
parent a4a618e3a4
commit e134a5598c
59 changed files with 352 additions and 258 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
docs/api/scene.en.md
View File

@ -10,10 +10,10 @@ order: 2
```javascript
// Module 引用
import { Scene } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
style: 'dark',
center: [ 110.770672, 34.159869 ],
pitch: 45,
@ -23,7 +23,7 @@ const scene = new Scene({
// CDN 使用方法
const scene = new L7.Scene({
id: 'map',
map: new L7.AMap({
map: new L7.GaodeMap({
style: 'dark',
center: [ 110.770672, 34.159869 ],
pitch: 45,
@ -58,7 +58,7 @@ const map = scene.map
```javascript
const scene =new L7.Scene({
id: 'map',
map: new L7.AMap({
map: new L7.GaodeMap({
style: 'dark',
center: [ 110.770672, 34.159869 ],
pitch: 45,

8
docs/api/scene.zh.md
View File

@ -10,10 +10,10 @@ order: 2
```javascript
// Module 引用
import { Scene } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
style: 'dark',
center: [ 110.770672, 34.159869 ],
pitch: 45,
@ -23,7 +23,7 @@ const scene = new Scene({
// CDN 使用方法
const scene = new L7.Scene({
id: 'map',
map: new L7.AMap({
map: new L7.GaodeMap({
style: 'dark',
center: [ 110.770672, 34.159869 ],
pitch: 45,
@ -58,7 +58,7 @@ const map = scene.map
```javascript
const scene =new L7.Scene({
id: 'map',
map: new L7.AMap({
map: new L7.GaodeMap({
style: 'dark',
center: [ 110.770672, 34.159869 ],
pitch: 45,

6
docs/tutorial/map/amap.en.md
View File

@ -1,5 +1,5 @@
---
title: AMap BaseMap
title: GaodeMap BaseMap
order: 0
---
@ -35,7 +35,7 @@ order: 0
``` javascript
const scene = new L7.Scene({
id: 'map',
map: new L7.AMap({
map: new L7.GaodeMap({
style: 'dark', // 样式URL
center: [120.19382669582967, 30.258134],
pitch: 0,
@ -111,7 +111,7 @@ fetch('https://gw.alipayobjects.com/os/rmsportal/oVTMqfzuuRFKiDwhPSFL.json')
const scene = new L7.Scene({
id: 'map',
map: new L7.AMap({
map: new L7.GaodeMap({
style: 'dark', // 样式URL
center: [120.19382669582967, 30.258134],
pitch: 0,

4
docs/tutorial/map/amap.zh.md
View File

@ -35,7 +35,7 @@ order: 0
``` javascript
const scene = new L7.Scene({
id: 'map',
map: new L7.AMap({
map: new L7.GaodeMap({
style: 'dark', // 样式URL
center: [120.19382669582967, 30.258134],
pitch: 0,
@ -111,7 +111,7 @@ fetch('https://gw.alipayobjects.com/os/rmsportal/oVTMqfzuuRFKiDwhPSFL.json')
const scene = new L7.Scene({
id: 'map',
map: new L7.AMap({
map: new L7.GaodeMap({
style: 'dark', // 样式URL
center: [120.19382669582967, 30.258134],
pitch: 0,

12
docs/tutorial/quickstart.en.md
View File

@ -47,7 +47,7 @@ yarn add --save @antv/l7@beta
然后就可以使用其中包含的场景和各类图层：
```typescript
import { Scene, PolygonLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
(async function() {
// 获取数据
@ -59,7 +59,7 @@ import { AMap } from '@antv/l7-maps';
// 创建场景
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
center: [110.19382669582967, 50.258134],
pitch: 0,
style: 'dark',
@ -93,7 +93,7 @@ import { AMap } from '@antv/l7-maps';
L7 目前的文档都通过这种方式使用，可以参考项目中的 stories：
* [高德地图](https://github.com/antvis/L7/blob/next/stories/MapAdaptor/components/AMap.tsx)
* [高德地图](https://github.com/antvis/L7/blob/next/stories/MapAdaptor/components/GaodeMap.tsx)
* [Mapbox](https://github.com/antvis/L7/blob/next/stories/MapAdaptor/components/Mapbox.tsx)
@ -102,10 +102,10 @@ L7 目前的文档都通过这种方式使用，可以参考项目中的 stories
React 组件待开发，目前可以暂时以 Submodule 方式使用：
```tsx
import { Scene, PolygonLayer} from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
import * as React from 'react';
export default class AMap extends React.Component {
export default class GaodeMap extends React.Component {
private scene: Scene;
public componentWillUnmount() {
@ -118,7 +118,7 @@ export default class AMap extends React.Component {
);
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
center: [110.19382669582967, 50.258134],
pitch: 0,
style: 'dark',

12
docs/tutorial/quickstart.zh.md
View File

@ -47,7 +47,7 @@ yarn add --save @antv/l7@beta
然后就可以使用其中包含的场景和各类图层：
```typescript
import { Scene, PolygonLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
(async function() {
// 获取数据
@ -59,7 +59,7 @@ import { AMap } from '@antv/l7-maps';
// 创建场景
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
center: [110.19382669582967, 50.258134],
pitch: 0,
style: 'dark',
@ -93,7 +93,7 @@ import { AMap } from '@antv/l7-maps';
L7 目前的文档都通过这种方式使用，可以参考项目中的 stories：
* [高德地图](https://github.com/antvis/L7/blob/next/stories/MapAdaptor/components/AMap.tsx)
* [高德地图](https://github.com/antvis/L7/blob/next/stories/MapAdaptor/components/GaodeMap.tsx)
* [Mapbox](https://github.com/antvis/L7/blob/next/stories/MapAdaptor/components/Mapbox.tsx)
@ -102,10 +102,10 @@ L7 目前的文档都通过这种方式使用，可以参考项目中的 stories
React 组件待开发，目前可以暂时以 Submodule 方式使用：
```tsx
import { Scene, PolygonLayer} from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
import * as React from 'react';
export default class AMap extends React.Component {
export default class GaodeMap extends React.Component {
private scene: Scene;
public componentWillUnmount() {
@ -118,7 +118,7 @@ export default class AMap extends React.Component {
);
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
center: [110.19382669582967, 50.258134],
pitch: 0,
style: 'dark',

4
examples/gallery/basic/demo/column_dark.js
View File

@ -1,9 +1,9 @@
import { Scene, PointLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 35.210526315789465,
style: 'dark',
center: [ 104.288144, 31.239692 ],

4
examples/gallery/basic/demo/normal.js
View File

@ -1,9 +1,9 @@
import { Scene, PointLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
center: [ 121.417463, 31.215175 ],
pitch: 0,
zoom: 11

4
examples/gallery/basic/demo/point.js
View File

@ -1,9 +1,9 @@
import { Scene, PointLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 64.88,
style: 'dark',
center: [ 114.060288, 22.53684 ],

4
examples/heatmap/grid/demo/china.js
View File

@ -1,9 +1,9 @@
import { Scene, HeatmapLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
style: 'light',
pitch: 0,
center: [ 107.054293, 35.246265 ],

4
examples/heatmap/grid/demo/grid1.js
View File

@ -1,9 +1,9 @@
import { Scene, HeatmapLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
style: 'dark',
pitch: 0,
center: [ 110.097892, 33.853662 ],

4
examples/heatmap/grid/demo/heatmap3.js
View File

@ -1,9 +1,9 @@
import { Scene, HeatmapLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
style: 'light',
pitch: 0,
center: [ 110.097892, 33.853662 ],

4
examples/heatmap/grid/demo/world.js
View File

@ -1,9 +1,9 @@
import { Scene, HeatmapLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
style: 'dark',
pitch: 0,
center: [ 110.097892, 33.853662 ],

4
examples/heatmap/hexagon/demo/world.js
View File

@ -1,9 +1,9 @@
import { Scene, HeatmapLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
style: 'light',
pitch: 0,
center: [ 104.995156, 31.450658 ],

4
examples/line/isoline/demo/ele.js
View File

@ -1,9 +1,9 @@
import { Scene, LineLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 53.6305,
style: 'light',
center: [ 102.600579, 23.114887 ],

4
examples/line/isoline/demo/ele_dark.js
View File

@ -1,9 +1,9 @@
import { Scene, LineLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 26.842105263157915,
style: 'dark',
center: [ 102.599436, 23.116371 ],

4
examples/line/isoline/demo/isoline.js
View File

@ -1,9 +1,9 @@
import { Scene, LineLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 0,
style: 'light',
center: [ 104.117492, 36.492696 ],

4
examples/line/line/demo/isoline.js
View File

@ -1,9 +1,9 @@
import { Scene, LineLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 0,
style: 'light',
center: [ 104.117492, 36.492696 ],

4
examples/point/bubble/demo/color.js
View File

@ -1,9 +1,9 @@
import { Scene, PointLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 0,
style: 'light',
center: [ 121.435159, 31.256971 ],

4
examples/point/bubble/demo/point.js
View File

@ -1,9 +1,9 @@
import { Scene, PointLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 0,
type: 'amap',
style: 'light',

4
examples/point/bubble/demo/scatter.js
View File

@ -1,9 +1,9 @@
import { Scene, PointLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
style: 'light',
center: [ -121.24357, 37.58264 ],
pitch: 0,

4
examples/point/chart/demo/bar.js
View File

@ -1,10 +1,10 @@
import { Scene, Marker } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
import * as G2 from '@antv/g2';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
style: 'light',
center: [ 2.6125016864608597, 49.359131 ],
pitch: 0,

4
examples/point/chart/demo/chart.js
View File

@ -1,10 +1,10 @@
import { Scene, Marker } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
import * as G2 from '@antv/g2';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
style: 'light',
center: [ 2.6125016864608597, 49.359131 ],
pitch: 0,

4
examples/point/column/demo/clumn_shape.js
View File

@ -1,9 +1,9 @@
import { Scene, PointLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 66.02383,
style: 'dark',
center: [ 121.400257, 31.25287 ],

4
examples/point/column/demo/column_dark.js
View File

@ -1,9 +1,9 @@
import { Scene, PointLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 35.210526315789465,
style: 'dark',
center: [ 104.288144, 31.239692 ],

4
examples/point/column/demo/column_light.js
View File

@ -1,9 +1,9 @@
import { Scene, PointLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 48.62562,
style: 'light',
center: [ 104.026043, 31.847 ],

4
examples/point/image/demo/image.js
View File

@ -1,9 +1,9 @@
import { Scene, PointLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 0,
style: 'light',
center: [ 121.434765, 31.256735 ],

4
examples/point/image/demo/locate.js
View File

@ -1,9 +1,9 @@
import { Scene, PointLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 0,
style: 'light',
center: [ 116.276227, 35.256776 ],

4
examples/point/image/demo/weather.js
View File

@ -1,9 +1,9 @@
import { Scene, PointLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
style: 'dark',
center: [ 120.5969, 29.7918 ],
pitch: 35,

4
examples/point/marker/demo/marker.js
View File

@ -1,9 +1,9 @@
import { Scene, Marker } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
style: 'light',
center: [ 105.790327, 36.495636 ],
pitch: 0,

4
examples/point/scatter/demo/normal.js
View File

@ -1,9 +1,9 @@
import { Scene, PointLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
style: 'dark',
center: [ 121.417463, 31.215175 ],
pitch: 0,

4
examples/point/scatter/demo/normal2.js
View File

@ -1,9 +1,9 @@
import { Scene, PointLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 64.88,
style: 'dark',
center: [ 114.060288, 22.53684 ],

4
examples/polygon/3d/demo/polygon.js
View File

@ -1,9 +1,9 @@
import { Scene, PolygonLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 0,
style: 'dark',
center: [ 114.050008, 22.529272 ],

4
examples/polygon/fill/demo/fill.js
View File

@ -1,9 +1,9 @@
import { Scene, PolygonLayer, LineLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 0,
style: 'light',
center: [ 116.368652, 39.93866 ],

4
examples/polygon/fill/demo/polygon.js
View File

@ -1,9 +1,9 @@
import { Scene, PolygonLayer, LineLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 0,
style: 'light',
center: [ 107.042225, 37.66565 ],

4
examples/raster/basic/demo/image.js
View File

@ -1,9 +1,9 @@
import { Scene, ImageLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 0,
style: 'light',
center: [ 121.268, 30.3628 ],

4
examples/raster/basic/demo/radar.js
View File

@ -1,9 +1,9 @@
import { Scene, ImageLayer } from '@antv/l7';
import { AMap } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new AMap({
map: new GaodeMap({
pitch: 0,
style: 'dark',
center: [ 115.5268, 34.3628 ],

51
examples/tutorial/control/demo/amap.js Normal file
View File

@ -0,0 +1,51 @@
import { PointLayer, Scale, Scene, Layers, Zoom } from '@antv/l7';
const scene = new Scene({
id: 'map',
pitch: 0,
type: 'amap',
style: 'dark',
center: [ 121.40, 31.258134 ],
zoom: 14
});
fetch('https://gw.alipayobjects.com/os/basement_prod/893d1d5f-11d9-45f3-8322-ee9140d288ae.json')
.then(res => res.json())
.then(data => {
const pointLayer =
new PointLayer({
})
.source(data, {
parser: {
type: 'json',
x: 'longitude',
y: 'latitude'
}
}).shape('circle')
.size('unit_price', [ 5, 25 ])
.color('name', [ '#49B5AD', '#5B8FF9' ])
.style({
opacity: 0.3,
strokeWidth: 1
});
scene.addLayer(pointLayer);
const overlayers = {
围栏填充: pointLayer
};
const layersControl = new Layers({
overlayers
});
scene.addControl(layersControl);
});
const zoomControl = new Zoom();
const scaleControl = new Scale({
position: 'bottomright'
});
scene.addControl(zoomControl);
scene.addControl(scaleControl);

17
examples/tutorial/control/demo/mapbox.js Normal file
View File

@ -0,0 +1,17 @@
import { Scale, Zoom, Scene } from '@antv/l7';
const scene = new Scene({
id: 'map',
pitch: 0,
type: 'mapbox',
style: 'light',
center: [ -97.119140625, 38.75408327579141 ],
zoom: 2
});
const zoomControl = new Zoom();
const scaleControl = new Scale({
position: 'rightbottom'
});
scene.addControl(zoomControl);
scene.addControl(scaleControl);

16
examples/tutorial/control/demo/meta.json Normal file
View File

@ -0,0 +1,16 @@
{
"title": {
"zh": "地图",
"en": "Category"
},
"demos": [
{
"filename": "amap.js",
"title": "高德底图组件",
},
{
"filename": "mapbox.js",
"title": "MapBox底图组件"
}
]
}

53
examples/tutorial/control/demo/popup.js Normal file
View File

@ -0,0 +1,53 @@
import { Scale, Zoom, Scene, Layers, PointLayer } from '@antv/l7';
const scene = new Scene({
id: 'map',
pitch: 0,
type: 'amap',
style: 'dark',
center: [ 121.40, 31.258134 ],
zoom: 5
});
fetch('https://gw.alipayobjects.com/os/basement_prod/893d1d5f-11d9-45f3-8322-ee9140d288ae.json')
.then(res => res.json())
.then(data => {
const pointLayer =
new PointLayer({
})
.source(data, {
parser: {
type: 'json',
x: 'longitude',
y: 'latitude'
}
}).shape('circle')
.size('unit_price', [ 5, 25 ])
.color('name', [ '#49B5AD', '#5B8FF9' ])
.style({
opacity: 0.3,
strokeWidth: 1
});
scene.addLayer(pointLayer);
const overlayers = {
围栏填充: pointLayer
};
const baseLayers = {
基础地图: pointLayer
};
const layersControl = new Layers({
overlayers,
baseLayers
});
scene.addControl(layersControl);
});
const zoomControl = new Zoom();
const scaleControl = new Scale();
scene.addControl(zoomControl);
scene.addControl(scaleControl);

4
examples/tutorial/control/index.en.md Normal file
View File

@ -0,0 +1,4 @@
---
title: control
order: 2
---

6
examples/tutorial/control/index.zh.md Normal file
View File

@ -0,0 +1,6 @@
---
title: 组件
order: 2
---

37
examples/tutorial/data/demo/line.js Normal file
View File

@ -0,0 +1,37 @@
import { LineLayer, Scene } from '@antv/l7';
const scene = new Scene({
id: 'map',
pitch: 0,
type: 'mapbox',
style: 'light',
center: [ 102.602992, 23.107329 ],
zoom: 13
});
fetch('https://gw.alipayobjects.com/os/rmsportal/ZVfOvhVCzwBkISNsuKCc.json')
.then(res => res.json())
.then(data => {
const layer =
new LineLayer({
})
.source(data)
.size(1)
.shape('line')
.color(
'ELEV',
[
'#E8FCFF',
'#CFF6FF',
'#A1E9ff',
'#65CEF7',
'#3CB1F0',
'#2894E0',
'#1772c2',
'#105CB3',
'#0D408C',
'#002466'
].reverse()
);
scene.addLayer(layer);
});

13
examples/tutorial/data/demo/meta.json Normal file
View File

@ -0,0 +1,13 @@
{
"title": {
"zh": "图库",
"en": "Gallery"
},
"demos": [
{
"filename": "line.js",
"title": "线图层",
"screenshot": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*KCyXTJrePiYAAAAAAAAAAABkARQnAQ"
}
]
}

4
examples/tutorial/data/index.en.md Normal file
View File

@ -0,0 +1,4 @@
---
title: Data
order: 1
---

4
examples/tutorial/data/index.zh.md Normal file
View File

@ -0,0 +1,4 @@
---
title: 数据
order: 1
---

9
examples/tutorial/map/demo/amap.js Normal file
View File

@ -0,0 +1,9 @@
import { Scene } from '@antv/l7';
new Scene({
id: 'map',
pitch: 0,
type: 'amap',
style: 'dark',
center: [ 121.40, 31.258134 ],
zoom: 5
});

10
examples/tutorial/map/demo/mapbox.js Normal file
View File

@ -0,0 +1,10 @@
import { Scene } from '@antv/l7';
new Scene({
id: 'map',
pitch: 0,
type: 'mapbox',
style: 'light',
center: [ -97.119140625, 38.75408327579141 ],
zoom: 2
});

18
examples/tutorial/map/demo/meta.json Normal file
View File

@ -0,0 +1,18 @@
{
"title": {
"zh": "地图",
"en": "Category"
},
"demos": [
{
"filename": "amap.js",
"title": "高德底图",
"screenshot": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*KCyXTJrePiYAAAAAAAAAAABkARQnAQ"
},
{
"filename": "mapbox.js",
"title": "MapBox底图",
"screenshot": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*KCyXTJrePiYAAAAAAAAAAABkARQnAQ"
}
]
}

6
examples/tutorial/map/index.en.md Normal file
View File

@ -0,0 +1,6 @@
---
title: map
order: 0
---
初始 L7 地图实例

9
examples/tutorial/map/index.zh.md Normal file
View File

@ -0,0 +1,9 @@
---
title: 地图
order: 0
redirect_from:
- /zh/tutorial
---
初始 L7 地图实例

2
packages/layers/src/point/models/extrude.ts
View File

@ -1,7 +1,7 @@
import { AttributeType, gl, IEncodeFeature, IModel } from '@antv/l7-core';
import BaseModel from '../../core/BaseModel';
import { PointExtrudeTriangulation } from '../../core/triangulation';
import pointExtrudeVert from '../shaders/extrude3_vert.glsl';
import pointExtrudeVert from '../shaders/extrude_vert.glsl';
import pointExtrudeFrag from '../shaders/extrude_frag.glsl';
interface IPointLayerStyleOptions {
opacity: number;

33
packages/layers/src/point/shaders/extrude3_vert.glsl
View File

@ -1,33 +0,0 @@
precision highp float;
#define ambientRatio 0.5
#define diffuseRatio 0.3
#define specularRatio 0.2
attribute vec3 a_Position;
attribute vec3 a_Pos;
attribute vec4 a_Color;
attribute vec3 a_Size;
attribute vec3 a_Normal;
uniform mat4 u_ModelMatrix;
varying vec4 v_color;
#pragma include "projection"
#pragma include "light"
#pragma include "picking"
void main() {
vec3 size = a_Size * a_Position;
vec2 offset = project_pixel(size.xy);
vec4 project_pos = project_position(vec4(a_Pos.xy, 0, 1.0));
vec4 pos = vec4(project_pos.xy + offset, project_pixel(size.z), 1.0);
float lightWeight = calc_lighting(pos);
v_color =vec4(a_Color.rgb * lightWeight, a_Color.w);
gl_Position = project_common_position_to_clipspace(pos);
setPickingColor(a_PickingColor);
}

19
packages/layers/src/point/shaders/extrude_vert.glsl
View File

@ -26,24 +26,7 @@ void main() {
vec4 pos = vec4(project_pos.xy + offset, project_pixel(size.z), 1.0);
float lightWeight = calc_lighting(pos);
// vec3 worldPos = vec3(pos * u_ModelMatrix);
// vec3 worldNormal = vec3(vec4(a_Normal,1.0));
// // //cal light weight
// vec3 viewDir = normalize(u_CameraPosition - worldPos);
// vec3 lightDir = normalize(vec3(1, -10.5, 12));
// vec3 halfDir = normalize(viewDir+lightDir);
// // //lambert
// float lambert = dot(worldNormal, lightDir);
// //specular
// float specular = pow( max(0.0, dot(worldNormal, halfDir)), 32.0);
// //sum to light weight
// float lightWeight = ambientRatio + diffuseRatio * lambert + specularRatio * specular;
v_color =vec4(a_Color.rgb*lightWeight, a_Color.w);
v_color =vec4(a_Color.rgb * lightWeight, a_Color.w);
gl_Position = project_common_position_to_clipspace(pos);
setPickingColor(a_PickingColor);

98
packages/layers/src/polygon/polygon3D.ts
View File

@ -1,98 +0,0 @@
import { AttributeType, gl, IEncodeFeature, ILayer } from '@antv/l7-core';
import BaseLayer from '../core/BaseLayer';
import { PolygonExtrudeTriangulation } from '../core/triangulation';
import polygonExtrudeFrag from './shaders/polygon_extrude_frag.glsl';
import polygonExtrudeVert from './shaders/polygon_extrude_vert.glsl';
interface IPointLayerStyleOptions {
opacity: number;
}
export default class PolygonLayer extends BaseLayer<IPointLayerStyleOptions> {
public name: string = 'PolygonLayer';
protected getConfigSchema() {
return {
properties: {
opacity: {
type: 'number',
minimum: 0,
maximum: 1,
},
},
};
}
protected renderModels() {
const { opacity } = this.getLayerConfig();
this.models.forEach((model) =>
model.draw({
uniforms: {
u_opacity: opacity || 1.0,
},
}),
);
return this;
}
protected buildModels() {
this.registerBuiltinAttributes();
this.models = [
this.buildLayerModel({
moduleName: 'polygonExtrude',
vertexShader: polygonExtrudeVert,
fragmentShader: polygonExtrudeFrag,
triangulation: PolygonExtrudeTriangulation,
}),
];
}
private registerBuiltinAttributes() {
// point layer size;
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: '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 } = feature;
return Array.isArray(size) ? [size[0]] : [size as number];
},
},
});
}
}

22
packages/layers/src/polygon/shaders/polygon_extrude_vert.glsl
View File

@ -13,6 +13,7 @@ uniform mat4 u_ModelMatrix;
varying vec4 v_Color;
#pragma include "projection"
#pragma include "light"
#pragma include "picking"
void main() {
@ -20,24 +21,9 @@ void main() {
gl_Position = project_common_position_to_clipspace(vec4(project_pos.xyz, 1.0));
vec3 worldPos = vec3(project_pos * u_ModelMatrix);
vec3 worldNormal = vec3(vec4(a_Normal,1.0) * u_ModelMatrix);
// vec3 worldNormal = project_normal(a_Normal);
// //cal light weight
vec3 viewDir = normalize(u_CameraPosition - worldPos);
vec3 lightDir = normalize(vec3(1, -10.5, 12));
vec3 halfDir = normalize(viewDir+lightDir);
// //lambert
float lambert = dot(worldNormal, lightDir);
//specular
float specular = pow( max(0.0, dot(worldNormal, halfDir)), 16.0);
//sum to light weight
float lightWeight = ambientRatio + diffuseRatio * lambert + specularRatio * specular;
float lightWeight = calc_lighting(pos);
// v_Color = a_Color;
v_Color = vec4(a_Color.rgb * lightWeight, a_Color.w);
v_Color = vec4(a_Color.rgb * lightWeight, a_Color.w);
setPickingColor(a_PickingColor);
}
}

4
packages/maps/src/index.ts
View File

@ -1,4 +1,4 @@
import AMap from './amap/Wrapper';
import GaodeMap from './amap/Wrapper';
import Mapbox from './mapbox/Wrapper';
export { AMap, Mapbox };
export { GaodeMap, Mapbox };

1
packages/renderer/src/regl/index.ts
View File

@ -54,7 +54,6 @@ export default class ReglRendererService implements IRendererService {
'OES_element_index_uint',
'EXT_shader_texture_lod', // IBL
'OES_standard_derivatives', // wireframe
'EXT_SRGB', // baseColor emmisive
'OES_texture_float', // shadow map
'WEBGL_depth_texture',
'angle_instanced_arrays',