Web Programming with html5, css, and JavaScript

FIGUre 12.23D 
JavaScript file for Solar Shadowing web page
function computeAngles() {
var latitude; // earth latitude 
var month; // month number (1 = Jan, 2 = Feb, ...) 
var hour; // hour of day 
// Using 1985 ASHRAE Fundamentals Guide, Chapter 27, Table 1, and 
// approximating earth's elliptical orbit as a circle: 
var solarDeclination; // solar altitude angle at north pole 
var hourAngle; // angle after noon in radians 
var cosAzimuth; // horizontal solar angle from south in radians 
// Using 1985 ASHRAE Fundamentals Guide, Chapter 27, equation (3):
var sinAltitude; // solar altitude in radians 
latitude = form.elements["latitude"].value * Math.PI/180; 
month = form.elements["month"].value; 
hour = form.elements["hour"].value; 
solarDeclination = (-23.45 * Math.PI/180) 
* Math.cos(month * Math.PI/6); 
hourAngle = Math.abs((hour - 12) * Math.PI/12); 
cosAzimuth = 0;
sinAltitude = Math.cos(hourAngle) * 
Math.cos(latitude) * Math.cos(solarDeclination) 
+ Math.sin(latitude) * Math.sin(solarDeclination); 
altitude = Math.asin(sinAltitude * 0.999999); 
if (altitude > 0) { 
// Using 1985 ASHRAE Fundamentals Guide, Chapter 27, equation (4): 
cosAzimuth =
(Math.sin(solarDeclination) - sinAltitude * Math.sin(latitude)) 
/ (Math.cos(altitude) * Math.cos(latitude)); 
azimuth = Math.acos(cosAzimuth * 0.999999); 
azimuth = (hour <= 12) ? azimuth : 2 * Math.PI - azimuth; 
cosIncidenceAngle = sinAltitude * Math.cos(slope) 
- cosAzimuth * Math.cos(altitude) * Math.sin(slope); 
if (cosIncidenceAngle < 0) {cosIncidenceAngle = 0.0;}
} // end if altitude > 0 
} // end computeAngles 
619
12.12 Case Study: Solar Shadowing Dynamics

---

FIGUre 12.23e
shows the 
showOneShadow
function. It uses opaque paint that covers every-
thing below it. The key question is “Where does the paint go?” To answer this question, focus on 
corners. The function’s 
x0
and 
y0
parameters are the coordinates of the collector array’s lower 
west corner. The 
xB
and 
yB
variables are the coordinates of the corresponding shadow corner. The 
xT
and 
yT
variables are the coordinates of the shadow corner corresponding to the array’s upper 
west corner. The 
botDxS
, 
botDyS
, 
topDxS
, and 
topDyS
variables are the 
x
- and 
y
-offsets from 
the array’s west corners to the shadow’s corresponding corners. Because the other array corners 
are one image width to the east, the other shadow corners are also one image width to the east. 
The 
context
’s 
moveTo
and 
lineTo
method calls start at the shadow corner corresponding to 
the array’s lower west corner and draw a clockwise path around the west, north, and east shadow 
sides. The 
fillStyle
method call selects the shadow’s color, and the 
fill
method call closes 
the path and fills the polygon with that selected color.
FIGUre 12.23F
shows the 
getObscuration
method. Instead of drawing polygons on the 
roof below the collectors, it draws rectangles on the collectors themselves. Instead of using opaque