-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
86 lines (76 loc) · 4.04 KB
/
index.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="author" content="Tatiana Lenz">
<title>Service Delivery</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css"
integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Open+Sans:400,600">
<link rel="stylesheet" type="text/css" href="./css/output.css"/>
</head>
<body>
<!-- Navigation bar -->
<nav class="nav panel-info-like">
<a class="nav-link active" href="" onClick="return false;">Service Delivery</a>
<a class="nav-link" href="./html/license.html">License</a>
<a class="nav-link" href="https://github.com/TattyFromMelbourne/visualization-exercise" target="_blank">on Github</a>
</nav>
<!-- Headers -->
<div class="container">
<div class="row about">
<div class="col-sm-12">
<h1 class="with-subheader">Service Delivery</h1>
<h2>Allocated Spending on Service Delivery by the Victorian Government in Financial Year 2017 to 2018</h2>
</div>
</div> <!-- /.row -->
<!-- Visualization -->
<div class="row">
<div id="sequenceWrapper" class="col-md-12">
<div class="instructions">Please mouse over the chart to see the breakdown of spending</div><!-- initial instructions -->
<div id="sequence"></div>
</div>
</div> <!-- /.row -->
<!-- Amount and Percentage text -->
<div class="row">
<div class="col-lg-8">
<div id="chart">
<div id="explanation" style="visibility:hidden;"> <span id="amount"></span><br/>
which represents<br/>
<span id="percentage"></span><br/>
of the total spending </div>
</div>
</div> <!-- /.row -->
<!-- Legend -->
<div id="legendWrapper" class="col-lg-4">
<div id="legendHeading">Legend</div>
<div id="legend"></div>
</div>
</div> <!-- /.row -->
<!-- Bottom Note -->
<div class="row about">
<div class="col-sm-12">
<p>N.B. The figures, prepared by the Department of Treasury and Finance in the State of Victoria, are rounded to the nearest 100,000 and there are, therefore,
rounding errors when they are added up for the whole department or area of expenditure. </p>
<p>Please see <i><a href="https://www.dtf.vic.gov.au/sites/default/files/2018-02/state-budget-service-delivery-bp3-2017-18.pdf" target="_blank">"Budget Paper No. 3
- Service Delivery 2017-18"</a> presented by Tim Pallas MP, Treasurer of the State of Victoria for the information of Honourable Members, Note (a) to Table 1.1 on p.1, Note (a) to Table 1.4 on p.6, Note (b) to Table 1.6 on p.19,
Note (h) to Table 1.12 on p.29, Note (n) to Table 1.13 on p.42, Note (a) to Table 1.14 on p.53, Note (a) to Table 1.16 on p.66, Note (b) to Table 1.18 on p.79, Note (a) to Table 1.20 on p.94, p.381
and passim</i> </p>
</div>
</div> <!-- /.row -->
</div> <!-- /.container -->
<!-- Note about not supporting mobile devices - -->
<div id="deviceNotSupported" class="about">
<h1>:( Sorry, your device is not supported.</h1>
This visualization exercise is only meant for desktops.
</div>
<!-- D3.js and custom visualization script -->
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="./js/output.js"></script>
<!-- jQuery first, then Tether, then Bootstrap JS. -->
<script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script>
</body>
</html>