antv-l7/demos/demo/arc.js

42 lines
948 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);
});