125 行
		
	
	
	
		
			3 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			125 行
		
	
	
	
		
			3 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
| $('#distplot_bands').change(function(){
 | |
| 	var band = $("#distplot_bands option:selected").text();
 | |
| 	if (band != "SAT") {
 | |
| 		$("#distplot_sats").prop('disabled', true);
 | |
| 	} else {
 | |
| 		$("#distplot_sats").prop('disabled', false);
 | |
| 	}
 | |
| });
 | |
| 
 | |
| function distPlot(form) {
 | |
| 	$(".alert").remove();
 | |
| 	var baseURL= "<?php echo base_url();?>";
 | |
| 	$.ajax({
 | |
| 		url: base_url+'index.php/distances/get_distances',
 | |
| 		type: 'post',
 | |
| 		data: {'band': form.distplot_bands.value,
 | |
| 			'sat': form.distplot_sats.value},
 | |
| 		success: function(tmp) {
 | |
| 			if (tmp.ok == 'OK') {
 | |
| 				if (!($('#information').length > 0))
 | |
| 					$("#distances_div").append('<div id="information"></div><div id="graphcontainer" style="height: 600px; margin: 0 auto"></div>');
 | |
| 				var color = ifDarkModeThemeReturn('white', 'grey');
 | |
| 				var options = {
 | |
| 					chart: {
 | |
| 						type: 'column',
 | |
| 						zoomType: 'xy',
 | |
| 						renderTo: 'graphcontainer',
 | |
| 						backgroundColor: getBodyBackground()
 | |
| 					},
 | |
| 					title: {
 | |
| 						text: 'Distance Distribution',
 | |
| 						style: {
 | |
| 							color: color
 | |
| 						}
 | |
| 					},
 | |
| 					xAxis: {
 | |
| 						categories: [],
 | |
| 						crosshair: true,
 | |
| 						type: "category",
 | |
| 						min:0,
 | |
| 						max:100,
 | |
| 						labels: {
 | |
| 							style: {
 | |
| 								color: color
 | |
| 							}
 | |
| 						}
 | |
| 					},
 | |
| 					yAxis: {
 | |
| 						title: {
 | |
| 							text: '# QSOs',
 | |
| 							style: {
 | |
| 								color: color
 | |
| 							}
 | |
| 						},
 | |
| 						labels: {
 | |
| 							style: {
 | |
| 								color: color
 | |
| 							}
 | |
| 						}
 | |
| 					},
 | |
| 					navigator: {
 | |
| 						enabled: true,
 | |
| 						xAxis: {
 | |
| 							labels: {
 | |
| 								formatter: function() {
 | |
| 									return this.value * '50' + ' ' + tmp.unit;
 | |
| 								},
 | |
| 								style: {
 | |
| 									color: color
 | |
| 								}
 | |
| 							}
 | |
| 						}
 | |
| 					},
 | |
| 					rangeSelector: {
 | |
| 						selected: 1
 | |
| 					},
 | |
| 					tooltip: {
 | |
| 						formatter: function () {
 | |
| 							if(this.point) {
 | |
| 								return "Distance: " + options.xAxis.categories[this.point.x] +
 | |
| 									"<br />Callsign(s) worked (max 5 shown): " + myComments[this.point.x] +
 | |
| 									"<br />Number of QSOs: <strong>" + series.data[this.point.x] + "</strong>";
 | |
| 							}
 | |
| 						}
 | |
| 					},
 | |
| 					legend: {
 | |
| 						itemStyle: {
 | |
| 							color: color
 | |
| 						}
 | |
| 					},
 | |
| 					series: []
 | |
| 				};
 | |
| 				var myComments=[];
 | |
| 
 | |
| 				var series = {
 | |
| 					data: [],
 | |
| 					showInNavigator: true
 | |
| 				};
 | |
| 
 | |
| 				$.each(tmp.qsodata, function(){
 | |
| 					myComments.push(this.calls);
 | |
| 					options.xAxis.categories.push(this.dist);
 | |
| 					series.name = 'Number of QSOs';
 | |
| 					series.data.push(this.count);
 | |
| 				});
 | |
| 
 | |
| 				options.series.push(series);
 | |
| 
 | |
| 				$('#information').html(tmp.qrb.Qsos + " contacts were plotted.<br /> Your furthest contact was with " + tmp.qrb.Callsign
 | |
| 					+ " in gridsquare "+ tmp.qrb.Grid
 | |
| 					+"; the distance was "
 | |
| 					+tmp.qrb.Distance + tmp.unit +".");
 | |
| 
 | |
| 				var chart = new Highcharts.Chart(options);
 | |
| 			}
 | |
| 			else {
 | |
| 				if (($('#information').length > 0)) {
 | |
| 					$("#information").remove();
 | |
| 					$("#graphcontainer").remove();
 | |
| 				}
 | |
| 				$("#distances_div").append('<div class="alert alert-danger" role="alert"><a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>' + tmp.Error + '</div>');
 | |
| 			}
 | |
| 		}
 | |
| 	});
 | |
| }
 |