FGFS-4.1/phpvms
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

draw route when you click on a flight

Browse Source
This commit is contained in:
Nabeel Shahzad
2017-12-28 14:59:42 -06:00
parent 9d92d8af55
commit 5a6bc1a7ba
2 changed files with 61 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
app/Services/GeoService.php
View File

@@ -184,11 +184,12 @@ class GeoService extends BaseService
$route_line[] = [$point->lon, $point->lat];
$route_points[] = new Feature(
new Point([$point->lon, $point->lat]), [
'name' => $point->altitude,
'popup' => $counter . '<br />GS: ' . $point->gs . '<br />Alt: ' . $point->altitude,
]);
'pirep_id' => $pirep->id,
'name' => $point->altitude,
'popup' => $counter . '<br />GS: ' . $point->gs . '<br />Alt: ' . $point->altitude,
]);
$counter += 1;
++$counter;
}
# Arrival
$route_line[] = [$pirep->arr_airport->lon, $pirep->arr_airport->lat];
@@ -222,7 +223,7 @@ class GeoService extends BaseService
'gs' => $point->gs,
'alt' => $point->altitude,
'heading' => $point->heading ?: 0,
'popup' => 'Flight: ' . $pirep->ident,
'popup' => $pirep->ident . '<br />GS: ' . $point->gs . '<br />Alt: ' . $point->altitude,
]);
}

63
public/assets/system/js/system.js
View File

@@ -224,9 +224,7 @@ const phpvms = (function() {
aircraft_icon: '/assets/img/acars/aircraft.png',
});
let flightPositions = null;
const map = draw_base_map(opts);
const aircraftIcon = L.icon({
iconUrl: opts.aircraft_icon,
iconSize: [48, 48],
@@ -234,6 +232,41 @@ const phpvms = (function() {
popupAnchor: [-3, -76],
});
let layerFlights = null;
let layerSelFlight = null;
/**
* When a flight is clicked on, show the path, etc for that flight
* @param feature
* @param layer
*/
const onFlightClick = (feature, layer) => {
const uri = opts.pirep_uri.replace('{id}', feature.properties.pirep_id);
console.log('flight check uri', uri);
const flight_route = $.ajax({
url: uri,
dataType: "json",
error: console.log
});
$.when(flight_route).done((routeJson) => {
if(layerSelFlight !== null) {
map.removeLayer(layerSelFlight);
}
layerSelFlight = L.geodesic([], {
weight: 7,
opacity: 0.9,
color: ACTUAL_ROUTE_COLOR,
wrap: false,
}).addTo(map);
layerSelFlight.geoJson(routeJson.line);
//map.fitBounds(layerSelFlight.getBounds());
});
};
const updateMap = () => {
console.log('reloading flights from acars...');
@@ -250,12 +283,26 @@ const phpvms = (function() {
$.when(flights).done(function (flightGeoJson) {
if (flightPositions !== null) {
flightPositions.clearLayers();
if (layerFlights !== null) {
layerFlights.clearLayers();
}
flightPositions = L.geoJSON(flightGeoJson, {
onEachFeature: onFeaturePointClick,
layerFlights = L.geoJSON(flightGeoJson, {
onEachFeature: (feature, layer) => {
layer.on({
click: (e) => {
onFlightClick(feature, layer);
}
});
let popup_html = "";
if (feature.properties && feature.properties.popup) {
popup_html += feature.properties.popup;
}
layer.bindPopup(popup_html);
},
pointToLayer: function(feature, latlon) {
return L.marker(latlon, {
icon: aircraftIcon,
@@ -264,8 +311,8 @@ const phpvms = (function() {
}
});
flightPositions.addTo(map);
map.fitBounds(flightPositions.getBounds());
layerFlights.addTo(map);
map.fitBounds(layerFlights.getBounds());
});
};