-
Notifications
You must be signed in to change notification settings - Fork 1
/
test_subwayMap.html
71 lines (55 loc) · 2.48 KB
/
test_subwayMap.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
<html>
<head>
<title>Test of the Subway Map SVG</title>
</head>
<body bgcolor=white>
<script src="http://d3js.org/queue.v1.min.js"></script>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="js/subwaymap.js"></script>
<link href="css/map.css" rel="stylesheet">
<div class="container">
<h1>Test of SubwayMap.js</h1>
<div class="row">
<div class="col-md-8" id="subwayMap">
</div>
</div>
</div>
<script>
$(function(){ // this function is called after the HTML document is fully loaded
asyncDataLoad();
function asyncDataLoad(){
queue().defer(d3.json, 'processing/station_map.json')
.defer(d3.json, 'processing/station_map_numbers.json')
.defer(d3.json, 'processing/line_blue.json')
.defer(d3.json, 'processing/line_orange.json')
.defer(d3.json, 'processing/line_green.json')
.defer(d3.json, 'processing/line_greenB.json')
.defer(d3.json, 'processing/line_greenC.json')
.defer(d3.json, 'processing/line_greenD.json')
.defer(d3.json, 'processing/line_greenE_underground.json')
.defer(d3.json, 'processing/line_greenE.json')
.defer(d3.json, 'processing/line_red.json')
.defer(d3.json, 'processing/line_redB.json')
.defer(d3.json, 'processing/line_redM.json')
.await(dataLoaded);
}
// error should be "null" if no error
function dataLoaded(error, station_map, station_map_numbers, line_blue, line_orange, line_green, line_greenB, line_greenC, line_greenD, line_greenE_underground, line_greenE, line_red, line_redB, line_redM) {
if (!error) {
//Create an eventHandler placeholder (to be filled in later)
var MyEventHandler = new Object();
// Instantiate
var subwayMap = new SubwayMap(d3.select("#subwayMap"), station_map, station_map_numbers, line_blue, line_orange, line_green, line_greenB, line_greenC, line_greenD, line_greenE_underground, line_greenE, line_red, line_redB, line_redM, MyEventHandler);
// test the shading
subwayMap.filterChange(0, 2, 0); // filterChange(snowTickIdx, rainTickIdx, dayFlag)
// bind the eventHandler to the things related to map
$(MyEventHandler).bind("selectionChange", function(event){
//anotherVis.onSelectionChange(startDate, endDate);
});
}
}
});
</script>
</body>
</html>