adds dots for navigation flights too
This commit is contained in:
parent
e48882bf49
commit
53afd1ee77
1 changed files with 78 additions and 29 deletions
101
index.html
101
index.html
|
@ -82,7 +82,10 @@
|
|||
|
||||
function _updateMap(csvData, airportsData) {
|
||||
const lines = csvData.split('\n');
|
||||
const features = lines.map(line => {
|
||||
|
||||
const features_nav = new Array();
|
||||
const features_local = new Array();
|
||||
for(const line of lines) {
|
||||
const [from, to] = line.split(',');
|
||||
|
||||
const fromAirport = airportsData[from];
|
||||
|
@ -97,45 +100,80 @@
|
|||
const toLatitude = parseFloat(toAirport.latitude);
|
||||
|
||||
// if from == to, draw a point
|
||||
var geometry;
|
||||
if(fromAirport == toAirport) {
|
||||
geometry = {
|
||||
type: 'Point',
|
||||
coordinates: [fromLongitude, fromLatitude]
|
||||
};
|
||||
}
|
||||
else {
|
||||
geometry = {
|
||||
type: 'LineString',
|
||||
coordinates: [
|
||||
[fromLongitude, fromLatitude],
|
||||
[toLongitude, toLatitude]
|
||||
]
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
features_local.push( {
|
||||
type: 'Feature',
|
||||
properties: {
|
||||
from,
|
||||
to
|
||||
},
|
||||
geometry: geometry
|
||||
};
|
||||
geometry: {
|
||||
type: 'Point',
|
||||
coordinates: [fromLongitude, fromLatitude]
|
||||
}
|
||||
} );
|
||||
}
|
||||
else {
|
||||
features_nav.push( {
|
||||
type: 'Feature',
|
||||
properties: {
|
||||
from,
|
||||
to
|
||||
},
|
||||
geometry: {
|
||||
type: 'LineString',
|
||||
coordinates: [
|
||||
[fromLongitude, fromLatitude],
|
||||
[toLongitude, toLatitude]
|
||||
]
|
||||
}
|
||||
} );
|
||||
|
||||
map.addSource('routes', {
|
||||
// Add a point for each airport
|
||||
features_nav.push( {
|
||||
type: 'Feature',
|
||||
properties: {
|
||||
name: fromAirport.name
|
||||
},
|
||||
geometry: {
|
||||
type: 'Point',
|
||||
coordinates: [fromLongitude, fromLatitude]
|
||||
}
|
||||
} );
|
||||
|
||||
features_nav.push( {
|
||||
type: 'Feature',
|
||||
properties: {
|
||||
name: toAirport.name
|
||||
},
|
||||
geometry: {
|
||||
type: 'Point',
|
||||
coordinates: [toLongitude, toLatitude]
|
||||
}
|
||||
} );
|
||||
}
|
||||
}
|
||||
|
||||
map.addSource('nav', {
|
||||
type: 'geojson',
|
||||
data: {
|
||||
type: 'FeatureCollection',
|
||||
features
|
||||
features: features_nav
|
||||
}
|
||||
});
|
||||
|
||||
map.addSource('local', {
|
||||
type: 'geojson',
|
||||
data: {
|
||||
type: 'FeatureCollection',
|
||||
features: features_local
|
||||
}
|
||||
});
|
||||
|
||||
map.addLayer({
|
||||
id: 'routes',
|
||||
id: 'nav_lines',
|
||||
type: 'line',
|
||||
source: 'routes',
|
||||
source: 'nav',
|
||||
layout: {
|
||||
'line-join': 'round',
|
||||
'line-cap': 'round'
|
||||
|
@ -147,9 +185,20 @@
|
|||
});
|
||||
|
||||
map.addLayer({
|
||||
id: 'points',
|
||||
id: 'nav_points',
|
||||
type: 'circle',
|
||||
source: 'routes',
|
||||
source: 'nav',
|
||||
paint: {
|
||||
'circle-radius': 5,
|
||||
'circle-color': '#ce42f5'
|
||||
},
|
||||
filter: ['==', '$type', 'Point']
|
||||
});
|
||||
|
||||
map.addLayer({
|
||||
id: 'local_points',
|
||||
type: 'circle',
|
||||
source: 'local',
|
||||
paint: {
|
||||
'circle-radius': 5,
|
||||
'circle-color': '#f00'
|
||||
|
|
Loading…
Reference in a new issue