Phi: tweaking the weather diagram
- render actual cloud layers instead of dummy values
This commit is contained in:
parent
e4be2917be
commit
5d78ffa668
1 changed files with 80 additions and 60 deletions
|
@ -2,7 +2,7 @@ define([
|
||||||
'knockout', 'jquery', 'text!./Weather2.html', 'props', 'flot', 'flotresize'
|
'knockout', 'jquery', 'text!./Weather2.html', 'props', 'flot', 'flotresize'
|
||||||
], function(ko, jquery, htmlString, SGPropertyNode) {
|
], function(ko, jquery, htmlString, SGPropertyNode) {
|
||||||
|
|
||||||
if(typeof Math.roundTo === "undefined") {
|
if (typeof Math.roundTo === "undefined") {
|
||||||
Math.roundTo = function(num, step) {
|
Math.roundTo = function(num, step) {
|
||||||
return Math.floor((num / step) + .5) * step;
|
return Math.floor((num / step) + .5) * step;
|
||||||
}
|
}
|
||||||
|
@ -40,27 +40,6 @@ define([
|
||||||
return reply;
|
return reply;
|
||||||
}
|
}
|
||||||
|
|
||||||
function createClouds() {
|
|
||||||
var reply = [];
|
|
||||||
|
|
||||||
reply.push([
|
|
||||||
-50, 0.3, 0.
|
|
||||||
]);
|
|
||||||
reply.push([
|
|
||||||
-30, 3.0, 1.8
|
|
||||||
]);
|
|
||||||
reply.push([
|
|
||||||
-10, 5.0, 4
|
|
||||||
]);
|
|
||||||
reply.push([
|
|
||||||
10, 7.5, 4
|
|
||||||
]);
|
|
||||||
reply.push([
|
|
||||||
30, 12, 11.5
|
|
||||||
]);
|
|
||||||
return reply;
|
|
||||||
}
|
|
||||||
|
|
||||||
jquery.get('/json/environment/config?d=4', null, function(data) {
|
jquery.get('/json/environment/config?d=4', null, function(data) {
|
||||||
var wx = new SGPropertyNode(data);
|
var wx = new SGPropertyNode(data);
|
||||||
|
|
||||||
|
@ -104,6 +83,35 @@ define([
|
||||||
self.wxData.notifySubscribers(self.wxData.peek());
|
self.wxData.notifySubscribers(self.wxData.peek());
|
||||||
});
|
});
|
||||||
|
|
||||||
|
jquery.get('/json/environment/clouds?d=4', null, function(data) {
|
||||||
|
var clouds = new SGPropertyNode(data);
|
||||||
|
function createClouds() {
|
||||||
|
var reply = [];
|
||||||
|
clouds.getChildren("layer").forEach(function(layer) {
|
||||||
|
var coverage = layer.getValue("coverage");
|
||||||
|
if( coverage == "clear" ) return;
|
||||||
|
|
||||||
|
var base = layer.getValue("elevation-ft", -9999 );
|
||||||
|
if( base < -9000 ) return;
|
||||||
|
|
||||||
|
var tops = base + layer.getValue("thickness-ft",0) + base;
|
||||||
|
if( tops == base ) return;
|
||||||
|
|
||||||
|
base *= 0.3048/1000;
|
||||||
|
tops *= 0.3048/1000;
|
||||||
|
|
||||||
|
reply.push( [reply.length, tops, base] );
|
||||||
|
});
|
||||||
|
|
||||||
|
return reply;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
self.wxData()[2].data = createClouds();
|
||||||
|
self.wxData.notifySubscribers(self.wxData.peek());
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
self.wxData = ko.observableArray([
|
self.wxData = ko.observableArray([
|
||||||
{// Series: Isotherms
|
{// Series: Isotherms
|
||||||
color : 'rgb(0, 0, 255)',
|
color : 'rgb(0, 0, 255)',
|
||||||
|
@ -121,6 +129,7 @@ define([
|
||||||
},
|
},
|
||||||
shadowSize : 0,
|
shadowSize : 0,
|
||||||
yaxis : 2, // on linear scale
|
yaxis : 2, // on linear scale
|
||||||
|
xaxis : 1,
|
||||||
}, {// Series: Dry Adiabat
|
}, {// Series: Dry Adiabat
|
||||||
color : 'rgb(0, 255, 0)',
|
color : 'rgb(0, 255, 0)',
|
||||||
data : createDryAdiabates(),
|
data : createDryAdiabates(),
|
||||||
|
@ -137,9 +146,10 @@ define([
|
||||||
},
|
},
|
||||||
shadowSize : 0,
|
shadowSize : 0,
|
||||||
yaxis : 1,
|
yaxis : 1,
|
||||||
|
xaxis : 1,
|
||||||
}, { // clouds
|
}, { // clouds
|
||||||
color : 'rgb(128,128,128)',
|
color : 'rgb(128,128,128)',
|
||||||
data : createClouds(),
|
data : [],
|
||||||
label : 'clouds',
|
label : 'clouds',
|
||||||
lines : {
|
lines : {
|
||||||
show : false
|
show : false
|
||||||
|
@ -147,7 +157,7 @@ define([
|
||||||
bars : {
|
bars : {
|
||||||
show : true,
|
show : true,
|
||||||
lineWidth : 0,
|
lineWidth : 0,
|
||||||
barWidth : 20,
|
barWidth : 1,
|
||||||
fillColor : {
|
fillColor : {
|
||||||
colors : [
|
colors : [
|
||||||
{
|
{
|
||||||
|
@ -160,6 +170,7 @@ define([
|
||||||
},
|
},
|
||||||
shadowSize : 2,
|
shadowSize : 2,
|
||||||
yaxis : 2,
|
yaxis : 2,
|
||||||
|
xaxis : 2,
|
||||||
}, { // Temperature
|
}, { // Temperature
|
||||||
color : 'rgb(255, 0, 0)',
|
color : 'rgb(255, 0, 0)',
|
||||||
data : [],
|
data : [],
|
||||||
|
@ -176,6 +187,7 @@ define([
|
||||||
},
|
},
|
||||||
shadowSize : 0,
|
shadowSize : 0,
|
||||||
yaxis : 2,
|
yaxis : 2,
|
||||||
|
xaxis : 1,
|
||||||
}, { // dewpoint
|
}, { // dewpoint
|
||||||
color : 'rgb(0, 255, 0)',
|
color : 'rgb(0, 255, 0)',
|
||||||
data : [],
|
data : [],
|
||||||
|
@ -192,6 +204,7 @@ define([
|
||||||
},
|
},
|
||||||
shadowSize : 0,
|
shadowSize : 0,
|
||||||
yaxis : 2,
|
yaxis : 2,
|
||||||
|
xaxis : 1,
|
||||||
}, {
|
}, {
|
||||||
color : 'rgb(0, 255, 0)',
|
color : 'rgb(0, 255, 0)',
|
||||||
data : [],
|
data : [],
|
||||||
|
@ -210,7 +223,7 @@ define([
|
||||||
},
|
},
|
||||||
shadowSize : 0,
|
shadowSize : 0,
|
||||||
yaxis : 2,
|
yaxis : 2,
|
||||||
|
xaxis : 1,
|
||||||
}
|
}
|
||||||
]);
|
]);
|
||||||
|
|
||||||
|
@ -218,7 +231,8 @@ define([
|
||||||
legend : {
|
legend : {
|
||||||
show : false,
|
show : false,
|
||||||
},
|
},
|
||||||
xaxis : {
|
xaxes : [
|
||||||
|
{ // Axis 1: Temperature
|
||||||
show : true,
|
show : true,
|
||||||
position : "bottom",
|
position : "bottom",
|
||||||
color : 'blue',
|
color : 'blue',
|
||||||
|
@ -226,7 +240,12 @@ define([
|
||||||
min : -56,
|
min : -56,
|
||||||
max : 50,
|
max : 50,
|
||||||
tickLength : 0,
|
tickLength : 0,
|
||||||
|
}, { // Axis 2: Cloud Layer
|
||||||
|
show : false,
|
||||||
|
min : 0,
|
||||||
|
max : 5,
|
||||||
},
|
},
|
||||||
|
],
|
||||||
yaxes : [
|
yaxes : [
|
||||||
{ // Axis 1: Pressure (hpa), Log-P
|
{ // Axis 1: Pressure (hpa), Log-P
|
||||||
show : true,
|
show : true,
|
||||||
|
@ -251,6 +270,7 @@ define([
|
||||||
min : -.020,
|
min : -.020,
|
||||||
max : 16,
|
max : 16,
|
||||||
tickLength : 0,
|
tickLength : 0,
|
||||||
|
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
|
|
||||||
|
@ -287,40 +307,40 @@ define([
|
||||||
function drawSeriesWindarrows(datapoints) {
|
function drawSeriesWindarrows(datapoints) {
|
||||||
var points = datapoints.points, ps = datapoints.pointsize;
|
var points = datapoints.points, ps = datapoints.pointsize;
|
||||||
for (var i = 0; i < points.length; i += ps) {
|
for (var i = 0; i < points.length; i += ps) {
|
||||||
var ws = Math.roundTo( points[i],5 ),
|
var ws = Math.roundTo(points[i], 5), y = points[i + 1], wd = points[i + 2];
|
||||||
y = points[i+1], wd = points[i+2];
|
|
||||||
|
|
||||||
var x = series.xaxis.p2c(40);
|
var x = series.xaxis.p2c(40);
|
||||||
y = series.yaxis.p2c(y);
|
y = series.yaxis.p2c(y);
|
||||||
|
|
||||||
ctx.save();
|
ctx.save();
|
||||||
ctx.translate(x,y);
|
ctx.translate(x, y);
|
||||||
ctx.rotate((wd+180) * Math.PI/180);
|
ctx.rotate((wd + 180) * Math.PI / 180);
|
||||||
|
|
||||||
ctx.beginPath();
|
ctx.beginPath();
|
||||||
ctx.arc(0,0, 3, 0, Math.PI * 2, false);
|
ctx.arc(0, 0, 3, 0, Math.PI * 2, false);
|
||||||
ctx.closePath();
|
ctx.closePath();
|
||||||
|
|
||||||
ctx.moveTo(0,0);
|
ctx.moveTo(0, 0);
|
||||||
ctx.lineTo(0,9*5);
|
ctx.lineTo(0, 9 * 5);
|
||||||
var pos = 0;
|
var pos = 0;
|
||||||
while( ws >= 5 ) {
|
while (ws >= 5) {
|
||||||
if( ws >= 50 ) {
|
if (ws >= 50) {
|
||||||
ws -= 50;
|
ws -= 50;
|
||||||
ctx.moveTo(0,(9-pos)*5);
|
ctx.moveTo(0, (9 - pos) * 5);
|
||||||
ctx.lineTo(-10,(8.5-pos)*5);
|
ctx.lineTo(-10, (8.5 - pos) * 5);
|
||||||
ctx.lineTo(0,(8-pos)*5);
|
ctx.lineTo(0, (8 - pos) * 5);
|
||||||
|
pos++;
|
||||||
|
} else if (ws >= 10) {
|
||||||
|
if (pos > 0)
|
||||||
pos++;
|
pos++;
|
||||||
} else if( ws >= 10 ) {
|
|
||||||
if( pos > 0 ) pos++;
|
|
||||||
ws -= 10;
|
ws -= 10;
|
||||||
ctx.moveTo(0,(9-pos)*5);
|
ctx.moveTo(0, (9 - pos) * 5);
|
||||||
ctx.lineTo(-10,(9.5-pos)*5);
|
ctx.lineTo(-10, (9.5 - pos) * 5);
|
||||||
} else {
|
} else {
|
||||||
pos++;
|
pos++;
|
||||||
ws -= 5;
|
ws -= 5;
|
||||||
ctx.moveTo(0,(9-pos)*5);
|
ctx.moveTo(0, (9 - pos) * 5);
|
||||||
ctx.lineTo(-5,(9.25-pos)*5);
|
ctx.lineTo(-5, (9.25 - pos) * 5);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Add table
Reference in a new issue