antv-l7/examples/line/arc/demo/arc.js

42 lines
943 B
JavaScript

import { Scene, LineLayer } from '@antv/l7';
import { Mapbox } from '@antv/l7-maps';
const scene = new Scene({
id: 'map',
map: new Mapbox({
pitch: 0,
style: 'dark',
center: [ 0, 23.107329 ],
zoom: 0
})
});
fetch(
'https://gw.alipayobjects.com/os/basement_prod/b83699f9-a96d-49b8-b2ea-f99299faebaf.json'
)
.then(res => res.json())
.then(data => {
function getAirportCoord(idx) {
return [ data.airports[idx][3], data.airports[idx][4] ];
}
const routes = data.routes.map(function(airline) {
return {
coord: [ getAirportCoord(airline[1]), getAirportCoord(airline[2]) ]
};
});
const layer = new LineLayer({})
.source(routes, {
parser: {
type: 'json',
coordinates: 'coord'
}
})
.size(0.6)
.shape('arc')
.color('rgb(5, 5, 50)')
.style({
opacity: 0.05
});
scene.addLayer(layer);
});