-
Notifications
You must be signed in to change notification settings - Fork 4
/
chapter_n.html
132 lines (114 loc) · 6.56 KB
/
chapter_n.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
<!DOCTYPE html>
<html>
<head>
<title class="setTitle"></title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<meta content="Book Author, Book Title" name="description">
<!-- Bootstrap -->
<link href="css/bootstrap_plus.css" rel="stylesheet" media="screen">
<link href="css/graphics_and_svg.css" rel="stylesheet">
<link href="css/learning-objective.css" rel="stylesheet">
<link href="css/module-opener.css" rel="stylesheet">
<link href="css/toc.css" rel="stylesheet">
<link href="css/grey-thing.css" rel="stylesheet">
<link href="css/eCourse-master.css" rel="stylesheet" media="screen">
</head>
<body>
<!-- Body Content -->
<div class="container">
<div class="row-fluid">
<div class="span6 leftCol">
<h2 class="setTitle">Earth's Energy Balance</h2>
<p>Here is some sample text that might show you what a chapter opener could look like. It can include any interactive elements a regular page might have. In fact, it should include them.</p>
<p>No sooner had 2012 begun when the January skies over the southern United States darkened by storms forming tornadoes that left a deadly toll. March roared in as another <a href="#" class="liteable">outbreak of tornadoes</a> ripped across a large section of the Southern United States into the Ohio Valley. By June records were falling as temperatures soared across the United States, Switzerland, Germany, and Italy. The night sky was alight over much of the western US as <a href="#" class="liteable">wildfires scorched tinder dry mountain slopes</a> and raged in southwest France, Spain, Italy and Croatia. Crops planted during the record warm spring now <a href="#" class="liteable">withered under the dry summer sky</a> of the midwest United States. By late summer drought gripped much of the United States. Wheat prices soared to new heights after the Russian crop failed. <a href="#" class="liteable">"Super storm" Sandy</a> struck the eastern seaboard of the United States in late October leaving billions of dollars in damage. Newscasters asked "What's up with the climate? Is this the new normal?" NOAA scientists warned that Earth's heat balance was tipping out of balance.</p>
<p>The Earth System seeks a state of equilibrium where inputs of mass and energy are balanced by outputs. Extreme, or at least out of the ordinary events are likely to occur. Uncommon weather patterns, migratory birds returning early and flowers blooming sooner each year herald a change in climate.The physical geography of Earth reflects the patterns of energy that drive environmental processes. An understanding of the global variations in energy and heat explains much about the current and future physical geography of Earth.</p>
</div>
<div class="span6">
<div class="mainContent"></div>
<div id="widgetTarget0"></div>
<div id="widgetTarget1"></div>
</div>
</div>
</div>
<script src="js/jquery-latest.js"></script>
<script src="js/bootstrap.min.js"></script>
<!-- <script src="js/jquery.touchSwipe.min.js"></script> -->
<script src="js/jquery-ui-1.10.2.custom.js"></script>
<script src="js/toc-structure.js"></script>
<script src="js/eCourse-master.js"></script>
<script src="js/d3.v3.min.js"></script>
<script src="js/widgets.js"></script>
<script src="js/widget-callouts.js"></script>
<script src="js/eventmanager.js"></script>
<script>
// <div id="widgetTarget1"><p>1. Multiple images with autoCarousel</p></div>
var svg1 = new MakeSVGContainer(
{node: d3.select("#widgetTarget0"),
maxWid: 400,
maxHt: 300
}
);
svg1.Axes({
xPosPerc: 0, yPosPerc:0, //top, left corner
xPerc: 1, yPerc: 1,//full height and width
xaxisType: "linear",
xOrient: "bottom",
xLabel: "counts",
yaxisType: "linear",
yOrient: "left",
});
svg1.ScalableImage(
{images: [
{URI:'img/ch4_0_1.png', caption: "Earth's atmosphere. ©NASA http://www.nasa.gov/multimedia/imagegallery/image_feature_1529.html"},
{URI:'img/ch4_1.jpg', caption: "The Whitewater-Baldy Complex wildfire."},
{URI:'img/ch4_2.jpg', caption: "Aerial image near downtown West Liberty, Kentucky."},
{URI:'img/ch4_4.jpg', caption: "Seaside Heights, NJ after Hurricane Sandy."}
]
}
);
var images0 = new MakeScalableImage(axes0,
{images: [
{URI:'img/ch4_0.jpg', caption: "The Heat is On ©Courtesy of NOAA"},
{URI:'img/ch4_1.jpg', caption: "The Whitewater-Baldy Complex wildfire."},
{URI:'img/ch4_2.jpg', caption: "Aerial image near downtown West Liberty, Kentucky."},
{URI:'img/ch4_3.jpg', caption: "Iowa corn crop withers under heat and drought of 2012."},
{URI:'img/ch4_4.jpg', caption: "Seaside Heights, NJ after Hurricane Sandy."}
]
}
);
var labels1 = new Callouts (axes1,
{labels:
[
{content: "Deke Arndt of the National Climatic Data Center explains how weather and climate factors came together to fuel the devastating wildfire season of 2012 in 'The Heat is On'.",
xyPos: [0,1], width: axes1.innerWid
},
{content: "Climate models project increasing dryness and extreme fire hazards into the midcentury on account of global warming. Forest management in the past has led to a build up of fuel. By 2050 scientists expect high fire years every two to four times per decade rather than once per decade under our current climate.",
xyPos:[0,1], width: axes1.innerWid
},
{content: "2012 began with an unusual number of tornadoes in January of that year. It continued to be a storm year when early March, an outbreak of 160 tornadoes ripped across Indiana and Kentucky.",
xyPos:[0,1], width: axes1.innerWid
},
{content:"A dome of high pressure over the midwest during much of the summer was a contributing factor to the drought of 2012 that spanned much of the United States. Increasing frequency of high pressure with its drying effect is projected for the midwest United States by the Intergovernmental Panel on Climate Change.",
xyPos:[0,1], width: axes1.innerWid
},
{content: "The 'super storm' Sandy covered oceanside streets in sand and ripped homes from their foundations. Hurricane intensity is projected to increase as ocean and air temperatures rise.",
xyPos:[0,1], width: axes1.innerWid
}
],
}
);
var links = new MakeLinks({
liteKey: [2,1,3,4]
});
var IDList = [images0,labels1,links];
var startState = 0;
images0.setState(startState);
labels1.setState(startState);
d3.selectAll('.liteable')
.on("click", function(d,i){
console.log("TODO: Log click and time on ", this.id);
return stateCycle(this,IDList);});
</script>
</body>
</html>