Replace polar plot in station view with svg implentation from observation view
Fabian P. Schmidt
parent
0f80ceb350
commit
703e366e94
|
|
@ -718,6 +718,8 @@ def pass_predictions(request, id):
|
|||
'bad_count': str(satellite.bad_count),
|
||||
'unknown_count': str(satellite.unknown_count),
|
||||
'norad_cat_id': str(satellite.norad_cat_id),
|
||||
'tle1': str(satellite.latest_tle.tle1),
|
||||
'tle2': str(satellite.latest_tle.tle2),
|
||||
'tr': tr.datetime(), # Rise time
|
||||
'azr': azimuth_r, # Rise Azimuth
|
||||
'tt': tt.datetime(), # Max altitude time
|
||||
|
|
@ -733,7 +735,10 @@ def pass_predictions(request, id):
|
|||
|
||||
data = {
|
||||
'id': id,
|
||||
'nextpasses': sorted(nextpasses, key=itemgetter('tr'))
|
||||
'nextpasses': sorted(nextpasses, key=itemgetter('tr')),
|
||||
'ground_station': {'lng': str(station.lng),
|
||||
'lat': str(station.lat),
|
||||
'alt': station.alt}
|
||||
}
|
||||
|
||||
return JsonResponse(data, safe=False)
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
/* global mapboxgl, polarplot, moment, Slider */
|
||||
/* global mapboxgl, polarplot, moment, Slider, calcPolarPlotSVG */
|
||||
/* jshint esversion: 6 */
|
||||
|
||||
$(document).ready(function() {
|
||||
|
|
@ -208,6 +208,8 @@ $(document).ready(function() {
|
|||
var tr_display_time = moment(data.nextpasses[i].tr).format('HH:mm');
|
||||
var ts_display_date = moment(data.nextpasses[i].ts).format('YYYY-MM-DD');
|
||||
var ts_display_time = moment(data.nextpasses[i].ts).format('HH:mm');
|
||||
var tr_svg = moment.utc(data.nextpasses[i].tr).format();
|
||||
var ts_svg = moment.utc(data.nextpasses[i].ts).format();
|
||||
|
||||
var overlap_style = null;
|
||||
var overlap = check_overlap(jobs, moment.utc(data.nextpasses[i].tr), moment.utc(data.nextpasses[i].ts));
|
||||
|
|
@ -261,7 +263,51 @@ $(document).ready(function() {
|
|||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<canvas class="polar-plot" width="100" height="100" data-points="${json_polar_data}"></canvas>
|
||||
<div id="polar_plot">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg" version="1.1"
|
||||
id="polar${i}"
|
||||
data-tle1="${data.nextpasses[i].tle1}"
|
||||
data-tle2="${data.nextpasses[i].tle2}"
|
||||
data-timeframe-start="${tr_svg}"
|
||||
data-timeframe-end="${ts_svg}"
|
||||
data-groundstation-lat="${data.ground_station.lat}"
|
||||
data-groundstation-lon="${data.ground_station.lng}"
|
||||
data-groundstation-alt="${data.ground_station.alt}"
|
||||
width="120px" height="120px"
|
||||
viewBox="-110 -110 220 220"
|
||||
overflow="hidden">
|
||||
<path
|
||||
fill="none" stroke="black" stroke-width="1"
|
||||
d="M 0 -95 v 190 M -95 0 h 190"
|
||||
/>
|
||||
<circle
|
||||
fill="none" stroke="black"
|
||||
cx="0" cy="0" r="30"
|
||||
/>
|
||||
<circle
|
||||
fill="none" stroke="black"
|
||||
cx="0" cy="0" r="60"
|
||||
/>
|
||||
<circle
|
||||
fill="none" stroke="black"
|
||||
cx="0" cy="0" r="90"
|
||||
/>
|
||||
<text x="-4" y="-96">
|
||||
N
|
||||
</text>
|
||||
<text x="-4" y="105">
|
||||
S
|
||||
</text>
|
||||
<text x="96" y="4">
|
||||
E
|
||||
</text>
|
||||
<text x="-106" y="4">
|
||||
W
|
||||
</text>
|
||||
</svg>
|
||||
</div>
|
||||
<!-- <canvas class="polar-plot" width="100" height="100" data-points="${json_polar_data}"></canvas> -->
|
||||
</td>
|
||||
<td class="pass-schedule">
|
||||
${overlap ? `<div class="overlap-ribbon" aria-hidden="true"
|
||||
|
|
@ -285,8 +331,30 @@ $(document).ready(function() {
|
|||
</td>
|
||||
</tr>
|
||||
`);
|
||||
|
||||
// Draw orbit in polar plot
|
||||
var tleLine1 = $('svg#polar' + i.toString()).data('tle1');
|
||||
var tleLine2 = $('svg#polar' + i.toString()).data('tle2');
|
||||
|
||||
var timeframe = {
|
||||
start: new Date($('svg#polar' + i.toString()).data('timeframe-start')),
|
||||
end: new Date($('svg#polar' + i.toString()).data('timeframe-end'))
|
||||
};
|
||||
|
||||
var groundstation = {
|
||||
lon: $('svg#polar' + i.toString()).data('groundstation-lon'),
|
||||
lat: $('svg#polar' + i.toString()).data('groundstation-lat'),
|
||||
alt: $('svg#polar' + i.toString()).data('groundstation-alt')
|
||||
};
|
||||
|
||||
const polarPlotSVG = calcPolarPlotSVG(timeframe,
|
||||
groundstation,
|
||||
tleLine1,
|
||||
tleLine2);
|
||||
|
||||
$('svg#polar' + i.toString()).append(polarPlotSVG);
|
||||
}
|
||||
polarplot();
|
||||
//polarplot();
|
||||
|
||||
// Show predicion results count
|
||||
$('#prediction_results').show();
|
||||
|
|
|
|||
|
|
@ -285,7 +285,9 @@
|
|||
<script src="{% static 'lib/mapbox-gl/dist/mapbox-gl.js' %}"></script>
|
||||
<script src="{% static 'lib/moment/min/moment.min.js' %}"></script>
|
||||
<script src="{% static 'lib/bootstrap-slider/dist/bootstrap-slider.min.js' %}"></script>
|
||||
<script src="{% static 'lib/satellite.js/dist/satellite.min.js' %}"></script>
|
||||
<script src="{% static 'js/polar.js' %}"></script>
|
||||
<script src="{% static 'js/polar_svg.js' %}"></script>
|
||||
<script src="{% static 'js/station_view.js' %}"></script>
|
||||
<script src="{% static 'js/gridsquare.js' %}"></script>
|
||||
<script src="{% static 'js/satellite.js' %}"></script>
|
||||
|
|
|
|||
Loading…
Reference in New Issue