-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
146 lines (137 loc) · 8.03 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
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
133
134
135
136
137
138
139
140
141
142
143
144
145
146
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>When Did Your State Join the Union - Dashboard</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="src/i/anychart.ico">
<!-- AnyChart UI -->
<link rel="stylesheet" href="https://cdn.anychart.com/releases/v8/css/anychart-ui.min.css">
<link rel="stylesheet" href="https://cdn.anychart.com/releases/v8/fonts/css/anychart-font.min.css">
<link rel="stylesheet" type="text/css" href="src/vendors/bootstrap-3/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="src/vendors/font-awesome-4.4.0/css/font-awesome.min.css"/>
<link rel="stylesheet" type="text/css" href="src/css/styles.css"/>
</head>
<body>
<div class="global-shadow"></div>
<div class="row title-panel">
<div class="col-lg-12">
<h1 class="title">
<a class="navbar-brand" href="//anychart.com/">
<img src="src/i/AnyChart-light-empty.png" width="300" height="72" alt="AnyChart">
<div class="chart-row">
<span class="chart-col green"></span>
<span class="chart-col orange"></span>
<span class="chart-col red"></span>
</div>
</a>
States of United States Dashboard
<div class="btn-group pull-right submenu">
<a type="button" class="btn btn-link dropdown-toggle" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false">
<i class="fa fa-ellipsis-v"></i>
</a>
<ul class="dropdown-menu">
<li><a data-toggle="modal" data-target="#aboutDashboardModal"><i class="fa fa-info-circle"></i>
About</a></li>
<li><a href="https://www.anychart.com/support/" target="_blank"><i class="fa fa-life-ring"></i>
Support</a></li>
<li><a href="https://github.com/AnyChart/states-of-united-states-dashboard/archive/master.zip"><i
class="fa fa-download"></i> Download .zip</a></li>
<li><a href="https://github.com/AnyChart/states-of-united-states-dashboard"><i
class="fa fa-git"></i> GitHub Project</a></li>
</ul>
</div>
</h1>
</div>
</div>
<div class="container-fluid">
<div id="container-dashboard"></div>
<div class="clearfix"></div>
<div class="row footer-panel">
<div class="footer">
<span class="pull-left"><i class="fa fa-git"></i> <a class="footer-credits-link"
href="https://github.com/AnyChart/states-of-united-states-dashboard">
View on GitHub </a></span>
<span class="pull-right">© 2017 <a class="footer-credits-link" href="https://www.anychart.com/">AnyChart.com
- JavaScript charts</a>. All rights reserved</span>
</div>
</div>
</div>
<div class="modal" id="aboutDashboardModal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">States of United States Dashboard</h4>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-12">
<h4>General</h4>
<p> This sample is based on article <a
href="https://en.wikipedia.org/wiki/List_of_states_and_territories_of_the_United_States">"List
of States and territories of the United States" </a> from Wikipedia.
<h4>Replacing Data</h4>
<p>To use replace or change the data replace data in /src/js/data.js.
<h4>Technology stack</h4>
<p> Charting in this sample is done exclisively by <a target="_blank"
href="https://cdn.anychart.com/">the
latest version</a> of <a target="_blank" href="https://www.anychart.com/">AnyChart
JavaScript Web Charting Framework</a>.
<br/><a target="_blank" href="https://docs.anychart.com/">AnyChart Users' Guide</a>
<br/><a target="_blank" href="https://api.anychart.com/">AnyChart JavaScript API
Reference</a>
<p>For design and layout the following tools are used:
<ul class="list-default">
<li><a target="_blank" href="http://jquery.com/">Jquery 2.1.3</a></li>
<li><a target="_blank" href="http://getbootstrap.com/getting-started/">Bootstrap 3</a></li>
<li><a target="_blank" href="http://fortawesome.github.io/Font-Awesome/get-started/">Font
Awesome 4.4.0</a></li>
</ul>
<hr/>
<h4>License</h4>
<p>
AnyChart States of United States Dashboard solution includes two parts:
</p>
<ul>
<li>
Code of the solution that allows to use Javascript library (in this case, AnyChart) to
create a dashboard. You can use, edit, modify it, use it with other Javascript libraries
without any restrictions. It is released under <a
href="https://github.com/AnyChart/states-of-united-states-dashboard/blob/master/LICENSE"
target="_blank">Apache 2.0
License</a>.
</li>
<li>
AnyChart JavaScript library. It is released under Commercial license. You can test this
plugin with the trial
version of AnyChart. Our trial version is not limited by time and doesn't contain any
feature limitations. Check
details <a href="https://www.anychart.com/buy/" target="_blank">here</a>.
</li>
</ul>
<p>If you have any questions regarding licensing - please contact us. <a
href="mailto:sales@anychart.com">sales@anychart.com</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="src/vendors/jquery/jquery-2.1.3.min.js"></script>
<script src="src/vendors/bootstrap-3/bootstrap.min.js"></script>
<script src="https://cdn.anychart.com/releases/v8/js/anychart-base.min.js"></script>
<script src="https://cdn.anychart.com/releases/v8/js/anychart-map.min.js"></script>
<script src="https://cdn.anychart.com/releases/v8/js/anychart-circular-gauge.min.js"></script>
<script src="https://cdn.anychart.com/releases/v8/js/anychart-table.min.js"></script>
<script src="https://cdn.anychart.com/releases/v8/js/anychart-exports.min.js"></script>
<script src="https://cdn.anychart.com/releases/v8/js/anychart-vml.min.js"></script>
<script src="https://cdn.anychart.com/releases/v8/js/anychart-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.15/proj4.js"></script>
<script src="https://cdn.anychart.com/releases/v8/geodata/countries/united_states_of_america/united_states_of_america.js"></script>
<script src="src/js/data.js"></script>
<script src="src/js/dashboard.js"></script>
</body>
</html>