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

docs: website remove mapbox demos (#1334) 

* fix: 修复 featureScale 错误

* style: lint style

* fix: remove featureScalePlugin async

* feat: website remove mapbox demos

Co-authored-by: shihui <yiqianyao.yqy@alibaba-inc.com>
This commit is contained in:
YiQianYao 2022-09-09 23:26:41 +08:00 committed by GitHub
parent 16df259e61
commit b43a44844f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
55 changed files with 75 additions and 434 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/site/examples/choropleth/administrative/delete/administrative-switch.tsx
View File

@ -36,7 +36,7 @@ function AdministrativeSwitch() {
const chinaMap = new Choropleth('mapContainer', {
map: {
type: 'mapbox',
type: 'amap',
style: 'blank',
center: [120.19382669582967, 30.258134],
zoom: 3,

4
packages/site/examples/choropleth/administrative/delete/china-city.ts
View File

@ -1,9 +1,9 @@
import { Mapbox, Scene } from '@antv/l7';
import { GaodeMap, Scene } from '@antv/l7';
import { Choropleth } from '@antv/l7plot';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
style: 'blank',
center: [120.19382669582967, 30.258134],
zoom: 3,

4
packages/site/examples/choropleth/administrative/delete/china-map.ts
View File

@ -1,9 +1,9 @@
import { Mapbox, Scene } from '@antv/l7';
import { GaodeMap, Scene } from '@antv/l7';
import { Choropleth } from '@antv/l7plot';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
style: 'blank',
center: [120.19382669582967, 30.258134],
zoom: 3,

4
packages/site/examples/choropleth/administrative/delete/world-map.ts
View File

@ -1,9 +1,9 @@
import { Mapbox, Scene } from '@antv/l7';
import { GaodeMap, Scene } from '@antv/l7';
import { Choropleth } from '@antv/l7plot';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
style: 'blank',
center: [120.19382669582967, 30.258134],
zoom: 3,

4
packages/site/examples/choropleth/administrative/demo/hangzhou-city.ts
View File

@ -1,9 +1,9 @@
import { Mapbox, Scene } from '@antv/l7';
import { GaodeMap, Scene } from '@antv/l7';
import { Choropleth } from '@antv/l7plot';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
style: 'blank',
center: [120.19382669582967, 30.258134],
zoom: 3,

4
packages/site/examples/choropleth/administrative/demo/xihu-district.ts
View File

@ -1,9 +1,9 @@
import { Mapbox, Scene } from '@antv/l7';
import { GaodeMap, Scene } from '@antv/l7';
import { Choropleth } from '@antv/l7plot';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
style: 'blank',
center: [120.19382669582967, 30.258134],
zoom: 3,

5
packages/site/examples/choropleth/administrative/demo/zhejiang-province-district.ts
View File

@ -1,13 +1,12 @@
import { Mapbox, Scene } from '@antv/l7';
import { GaodeMap, Scene } from '@antv/l7';
import { Choropleth } from '@antv/l7plot';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
style: 'blank',
center: [120.19382669582967, 30.258134],
zoom: 3,
pitch: 0,
}),
});

4
packages/site/examples/choropleth/administrative/demo/zhejiang-province.ts
View File

@ -1,9 +1,9 @@
import { Mapbox, Scene } from '@antv/l7';
import { GaodeMap, Scene } from '@antv/l7';
import { Choropleth } from '@antv/l7plot';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
style: 'blank',
center: [120.19382669582967, 30.258134],
zoom: 3,

29
packages/site/examples/draw/UI/demo/mapbox.js
View File

@ -1,29 +0,0 @@
// https://gw.alipayobjects.com/zos/antvdemo/assets/2019_clip/ndvi_201905.tif
import { Scene } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { DrawControl } from '@antv/l7-draw';
const scene = new Scene({
id: 'map',
map: new Mapbox({
pitch: 0,
style: 'mapbox://styles/mapbox/satellite-v9',
center: [ 115.5268, 34.3628 ],
zoom: 15
})
});
scene.on('loaded', () => {
const drawControl = new DrawControl(scene, {
position: 'topright',
layout: 'horizontal', // horizontal vertical
controls: {
point: true,
polygon: true,
line: true,
circle: true,
rect: true,
delete: true
}
});
scene.addControl(drawControl);
});

6
packages/site/examples/draw/UI/demo/meta.json
View File

@ -4,16 +4,10 @@
"en": "Gallery"
},
"demos": [
{
"filename": "amap.js",
"title": "高德地图绘制",
"screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*-5KDT6d7pLcAAAAAAAAAAAAAARQnAQ"
},
{
"filename": "mapbox.js",
"title": "Mapbox 地图绘制",
"screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*bdDFS4ytOhYAAAAAAAAAAAAAARQnAQ"
}
]
}

73
packages/site/examples/engine/three/demo/mapbox_ant.js
View File

@ -1,73 +0,0 @@
import { Scene } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { ThreeLayer, ThreeRender } from '@antv/l7-three';
import * as THREE from 'three';
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader';
const scene = new Scene({
id: 'map',
map: new Mapbox({
center: [ 121.4, 31.258134 ],
pitch: 45,
rotation: 30,
zoom: 15
})
});
scene.on('loaded', () => {
scene.registerRenderService(ThreeRender);
const threeJSLayer = new ThreeLayer({
enableMultiPassRenderer: false,
onAddMeshes: (threeScene, layer) => {
threeScene.add(new THREE.AmbientLight(0xffffff));
const sunlight = new THREE.DirectionalLight(0xffffff, 0.25);
sunlight.position.set(0, 80000000, 100000000);
sunlight.matrixWorldNeedsUpdate = true;
threeScene.add(sunlight);
// 使用 Three.js glTFLoader 加载模型
const loader = new GLTFLoader();
loader.load(
'https://gw.alipayobjects.com/os/bmw-prod/3ca0a546-92d8-4ba0-a89c-017c218d5bea.gltf',
gltf => {
// 根据 GeoJSON 数据放置模型
layer.getSource().data.dataArray.forEach(() => {
const gltfScene = gltf.scene;
layer.adjustMeshToMap(gltfScene);
layer.setMeshScale(gltfScene, 10, 10, 10);
const animations = gltf.animations;
if (animations && animations.length) {
const mixer = new THREE.AnimationMixer(gltfScene);
const animation = animations[2];
const action = mixer.clipAction(animation);
action.play();
layer.addAnimateMixer(mixer);
}
// 向场景中添加模型
threeScene.add(gltfScene);
});
// 重绘图层
layer.render();
}
);
}
})
.source({
type: 'FeatureCollection',
features: [
{
type: 'Feature',
properties: {},
geometry: {
type: 'Point',
coordinates: [ 121.4, 31.258134 ]
}
}
]
})
.animate(true);
scene.addLayer(threeJSLayer);
});

5
packages/site/examples/engine/three/demo/meta.json
View File

@ -9,11 +9,6 @@
"title": "高德地图",
"screenshot":"https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*mjmxT7DaVQgAAAAAAAAAAAAAARQnAQ"
},
{
"filename": "mapbox_ant.js",
"title": "mapbox 地图",
"screenshot":"https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*dsbURZ87Rv8AAAAAAAAAAAAAARQnAQ"
},
{
"filename": "space_click.js",
"title": "点击建筑",

20
packages/site/examples/gallery/animate/delete/plane_animate.js
View File

@ -1,27 +1,11 @@
/* eslint-disable no-eval */
import { Scene, LineLayer, PointLayer, PolygonLayer } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
pitch: 40,
style: {
version: 8,
sprite: 'https://lzxue.github.io/font-glyphs/sprite/sprite',
glyphs:
'https://gw.alipayobjects.com/os/antvdemo/assets/mapbox/glyphs/{fontstack}/{range}.pbf',
sources: {},
layers: [
{
id: 'background',
type: 'background',
paint: {
'background-color': '#2b2b3a'
}
}
]
},
center: [ 3.438, 40.16797 ],
zoom: 1
})

4
packages/site/examples/gallery/animate/demo/turin.js
View File

@ -1,9 +1,9 @@
import { Scene, LineLayer } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
center: [ 7.65, 45.053 ],
pitch: 0,
zoom: 12,

5
packages/site/examples/gallery/basic/demo/arcCircle.js
View File

@ -1,11 +1,10 @@
import { Scene, LineLayer } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
style: 'dark',
pitch: 0,
center: [ 107.77791556935472, 35.443286920228644 ],
zoom: 2.9142882493605033
})

4
packages/site/examples/gallery/basic/demo/bus_dark.js
View File

@ -1,11 +1,11 @@
// Data Source https://busrouter.sg/visualization/
import { Scene, LineLayer } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
style: 'dark',
center: [ 103.83735604457024, 1.360253881403068 ],
pitch: 4.00000000000001,

4
packages/site/examples/gallery/basic/demo/light.js
View File

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

4
packages/site/examples/heatmap/grid/demo/grid_world.js
View File

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

4
packages/site/examples/heatmap/heatmap/demo/heatmap.js
View File

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

4
packages/site/examples/heatmap/heatmap/demo/heatmap_purple.js
View File

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

4
packages/site/examples/heatmap/hexagon/demo/china.js
View File

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

4
packages/site/examples/heatmap/hexagon/demo/hexagon.js
View File

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

4
packages/site/examples/heatmap/hexagon/demo/light.js
View File

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

4
packages/site/examples/line/animate/demo/animate_line.js
View File

@ -1,8 +1,8 @@
import { Scene, LineLayer } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
center: [ -74.006, 40.7128 ],
zoom: 14,
style: 'dark'

5
packages/site/examples/line/animate/demo/line_animate.js
View File

@ -1,10 +1,9 @@
import { Scene, LineLayer } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
pitch: 0,
map: new GaodeMap({
style: 'dark',
center: [ 107.77791556935472, 35.443286920228644 ],
zoom: 2.9142882493605033

21
packages/site/examples/line/animate/demo/plane_animate2.js
View File

@ -1,28 +1,13 @@
/* eslint-disable no-eval */
import { Scene, LineLayer, PointLayer } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
pitch: 40,
style: {
version: 8,
sprite: 'https://lzxue.github.io/font-glyphs/sprite/sprite',
glyphs:
'https://gw.alipayobjects.com/os/antvdemo/assets/mapbox/glyphs/{fontstack}/{range}.pbf',
sources: {},
layers: [
{
id: 'background',
type: 'background',
paint: {
'background-color': '#2b2b3a'
}
}
]
},
center: [ 40, 40.16797 ],
style: 'dark',
zoom: 2.5
})
});

5
packages/site/examples/line/animate/demo/trip_animate.js
View File

@ -1,11 +1,10 @@
import { Scene, LineLayer } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
pitch: 60,
type: 'mapbox',
style: 'light',
center: [ -74.05371169148452, 40.72573640479783 ],
zoom: 12.45977,

1
packages/site/examples/line/animate/demo/wind_animate.js
View File

@ -4,7 +4,6 @@ import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new GaodeMap({
pitch: 0,
style: 'light',
center: [ 60, 40.7128 ],
zoom: 2

5
packages/site/examples/line/arc/demo/arcCircle.js
View File

@ -1,10 +1,9 @@
import { Scene, LineLayer } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
pitch: 0,
map: new GaodeMap({
style: 'dark',
center: [ 107.77791556935472, 35.443286920228644 ],
zoom: 2.9142882493605033

5
packages/site/examples/line/arc/demo/trip_arc.js
View File

@ -1,11 +1,10 @@
import { Scene, LineLayer } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
pitch: 60,
type: 'mapbox',
style: 'light',
center: [ -74.06967, 40.720399 ],
zoom: 12.45977

4
packages/site/examples/line/arc/demo/trip_arc_dark.js
View File

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

4
packages/site/examples/line/arc/demo/trip_arc_dark_linear.js
View File

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

4
packages/site/examples/line/path/demo/bus_dark.js
View File

@ -1,11 +1,11 @@
// Data Source https://busrouter.sg/visualization/
import { Scene, LineLayer } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
center: [ 103.83735, 1.3602538 ],
zoom: 9.4678190476727,
pitch: 20,

4
packages/site/examples/line/path/demo/bus_light.js
View File

@ -1,11 +1,11 @@
// Data Source https://busrouter.sg/visualization/
import { Scene, LineLayer, Popup } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
center: [ 103.83735604457024, 1.360253881403068 ],
zoom: 9.4678190476727,
pitch: 20,

5
packages/site/examples/line/path/demo/road_dark.js
View File

@ -1,13 +1,12 @@
import { Scene, LineLayer } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
center: [ 116.3956, 39.9392 ],
pitch: 20,
zoom: 10,
rotation: 0,
style: 'dark'
})
});

4
packages/site/examples/line/path/demo/road_dark_dash.js
View File

@ -1,9 +1,9 @@
import { Scene, LineLayer } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
center: [ 116.3956, 39.9392 ],
pitch: 0,
zoom: 10,

1
packages/site/examples/line/path/demo/shanghai_bus.js
View File

@ -8,7 +8,6 @@ const scene = new Scene({
map: new GaodeMap({
center: [ 121.472644, 31.231706 ],
zoom: 8.15,
pitch: 0,
style: 'dark'
})
});

5
packages/site/examples/point/bubble/demo/world.js
View File

@ -1,10 +1,9 @@
import { Scene, PointLayer } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
pitch: 0,
map: new GaodeMap({
style: 'dark',
center: [ 96.99215001469588, 29.281597225674773 ],
zoom: 2.194613775109773,

5
packages/site/examples/point/text/demo/polygon_text.js
View File

@ -1,10 +1,9 @@
import { Scene, PolygonLayer } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
pitch: 0,
map: new GaodeMap({
style: 'light',
center: [ -96, 37.8 ],
zoom: 3

5
packages/site/examples/polygon/delete/city.js
View File

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

5
packages/site/examples/polygon/delete/province.js
View File

@ -1,11 +1,10 @@
import { Scene, PolygonLayer, LineLayer, PointLayer } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
pitch: 0,
map: new GaodeMap({
style: 'blank',
center: [ 116.368652, 39.93866 ],
zoom: 10.07

5
packages/site/examples/polygon/fill/demo/usa.js
View File

@ -1,10 +1,9 @@
import { Scene, PolygonLayer, LineLayer, Popup } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
pitch: 0,
map: new GaodeMap({
style: 'light',
center: [ -96, 37.8 ],
zoom: 3

2
packages/site/examples/react/layer/demo/marker.tsx
View File

@ -1,4 +1,4 @@
import { AMapScene, Marker, PointLayer } from '@antv/l7-react';
import { AMapScene, Marker } from '@antv/l7-react';
import * as React from 'react';
import ReactDOM from 'react-dom';
import './index.less';

1
packages/site/examples/react/layer/demo/popup.tsx
View File

@ -2,7 +2,6 @@ import {
AMapScene,
LayerEvent,
LineLayer,
MapboxScene,
PolygonLayer,
Popup,
} from '@antv/l7-react';

24
packages/site/examples/react/scene/demo/mapbox.jsx
View File

@ -1,24 +0,0 @@
import { MapboxScene } from '@antv/l7-react';
import * as React from 'react';
import ReactDOM from 'react-dom';
const MapScene = React.memo(function Map() {
return (
<MapboxScene
map={{
center: [ 110.19382669582967, 50.258134 ],
pitch: 0,
style: 'dark',
zoom: 1
}}
style={{
position: 'absolute',
top: 0,
left: 0,
right: 0,
bottom: 0
}}
/>
);
});
ReactDOM.render(<MapScene/>, document.getElementById('map'));

5
packages/site/examples/react/scene/demo/meta.json
View File

@ -9,11 +9,6 @@
"filename": "amap.jsx",
"title": "高德地图",
"screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*TmYmT7t5fmQAAAAAAAAAAAAAARQnAQ"
},
{
"filename": "mapbox.jsx",
"title": "Mapbox 地图",
"screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*po3TSKc4SUMAAAAAAAAAAAAAARQnAQ"
}
]
}

106
packages/site/examples/tile/raster/demo/dem.js
View File

@ -1,106 +0,0 @@
import { Scene, RasterLayer, Source } from '@antv/l7';
import { Map } from '@antv/l7-maps';
const colorList = [
'#f7fcf5',
'#e5f5e0',
'#c7e9c0',
'#a1d99b',
'#74c476',
'#41ab5d',
'#238b45',
'#006d2c',
'#00441b'
];
const positions = [ 0, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 1.0 ];
const scene = new Scene({
id: 'map',
map: new Map({
center: [ 90.268, 35.3628 ],
zoom: 3
})
});
const canvas = document.createElement('canvas');
canvas.width = 256;
canvas.height = 256;
const ctx = canvas.getContext('2d');
scene.on('loaded', () => {
const layer = new RasterLayer();
const tileSource = new Source('https://api.mapbox.com/v4/mapbox.terrain-rgb/{z}/{x}/{y}.pngraw?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw',
{
parser: {
type: 'rasterTile',
dataType: 'arraybuffer',
tileSize: 256,
minZoom: 1,
maxZoom: 18,
zoomOffset: 0,
format: async data => {
const blob = new Blob([ new Uint8Array(data) ], {
type: 'image/png'
});
const img = await createImageBitmap(blob);
ctx.clearRect(0, 0, 256, 256);
ctx.drawImage(img, 0, 0, 256, 256);
const imgData = ctx.getImageData(0, 0, 256, 256).data;
const arr = [];
for (let i = 0; i < imgData.length; i += 4) {
const R = imgData[i];
const G = imgData[i + 1];
const B = imgData[i + 2];
const d = -10000 + (R * 256 * 256 + G * 256 + B) * 0.1;
arr.push(d);
}
return {
rasterData: arr,
width: 256,
height: 256
};
}
}
});
layer.source(tileSource)
.style({
domain: [ 0, 1024 ],
clampLow: true,
rampColors: {
colors: colorList,
positions
}
});
scene.addLayer(layer);
return '';
});
const wrap = document.getElementById('map');
const legend = document.createElement('div');
const data = [];
for (let i = 0; i < colorList.length; i++) {
data.push({
color: colorList[i],
text: positions[i]
});
}
const strArr = [];
data.map(({ color, text }) => {
strArr.push(` <div style="display:inline-block;background:#fff;padding:5px;">
<div style="fontSize:12px;lineHeight:12px;">
${text}
</div>
<div style="width: 30px;height:8px; background: ${color};"></div>
</div>`);
return '';
});
legend.innerHTML = strArr.join('');
legend.style.position = 'absolute';
legend.style.left = '10px';
legend.style.bottom = '30px';
legend.style.background = '#fff';
legend.style.zIndex = 10;
wrap.appendChild(legend);

5
packages/site/examples/tile/raster/demo/meta.json
View File

@ -29,11 +29,6 @@
"title": "天地图卫星影像瓦片",
"screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*sV6gSYSdpl4AAAAAAAAAAAAAARQnAQ"
},
{
"filename": "dem.js",
"title": "png 高程栅格",
"screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*MNYOSbk1-KIAAAAAAAAAAAAAARQnAQ"
},
{
"filename": "lerc.js",
"title": "lerc 高程栅格",

17
packages/site/examples/tutorial/control/demo/mapbox.js
View File

@ -1,17 +0,0 @@
import { Scale, Zoom, Scene } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
style: 'light',
pitch: 0,
center: [ 107.054293, 35.246265 ],
zoom: 4.056
})
});
scene.on('loaded', () => {
const zoomControl = new Zoom();
const scaleControl = new Scale();
scene.addControl(zoomControl);
scene.addControl(scaleControl);
});

5
packages/site/examples/tutorial/control/demo/meta.json
View File

@ -8,11 +8,6 @@
"filename": "amap.js",
"title": "高德底图组件",
"screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*4Jj2RJQIQTAAAAAAAAAAAAAAARQnAQ"
},
{
"filename": "mapbox.js",
"title": "MapBox底图组件",
"screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*npkTSLPCtvwAAAAAAAAAAAAAARQnAQ"
}
]
}

11
packages/site/examples/tutorial/map/demo/mapbox.js
View File

@ -1,11 +0,0 @@
import { Scene } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
new Scene({
id: 'map',
map: new Mapbox({
style: 'light',
pitch: 0,
center: [ 107.054293, 35.246265 ],
zoom: 4.056
})
});

5
packages/site/examples/tutorial/map/demo/meta.json
View File

@ -9,11 +9,6 @@
"title": "高德底图",
"screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*C4BvT5gcclMAAAAAAAAAAAAAARQnAQ"
},
{
"filename": "mapbox.js",
"title": "MapBox底图",
"screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*jALRQaDoT-0AAAAAAAAAAAAAARQnAQ"
},
{
"filename": "amapInstance.js",
"title": "高德地图实例化",

4
packages/site/examples/tutorial/marker/demo/amap.js
View File

@ -1,8 +1,8 @@
import { Scene, Marker, Popup } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
import { GaodeMap } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
map: new GaodeMap({
style: 'light',
pitch: 0,
center: [ 121.4316962, 31.26082325 ],

17
packages/site/examples/tutorial/marker/demo/mapbox.js
View File

@ -1,17 +0,0 @@
import { Scale, Zoom, Scene } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
style: 'light',
pitch: 0,
center: [ 107.054293, 35.246265 ],
zoom: 4.056
})
});
scene.on('loaded', () => {
const zoomControl = new Zoom();
const scaleControl = new Scale();
scene.addControl(zoomControl);
scene.addControl(scaleControl);
});

5
packages/site/examples/tutorial/marker/demo/meta.json
View File

@ -8,11 +8,6 @@
"filename": "amap.js",
"title": "添加默认Marker",
"screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*VEy6S6UrAV8AAAAAAAAAAAAAARQnAQ"
},
{
"filename": "mapbox.js",
"title": "MapBox底图组件",
"screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*npkTSLPCtvwAAAAAAAAAAAAAARQnAQ"
}
]
}