new site home page
Costa Tsaousis (ktsaou) committed
Dec 1, 2016 at 00:42 UTC
cc8937ae0800911c121525784789a9ae7bd1a477
2 files changed
+1927
-912
web/demosites.html
+816
-912
@@ -1,24 +1,457 @@
1
-<!DOCTYPE html>
2
-<html lang="en">
3
-<head>
4
- <title>NetData - Real-time performance monitoring, done right!</title>
5
- <meta name="application-name" content="netdata">
6
-
7
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
8
- <meta charset="utf-8">
9
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
10
- <meta name="viewport" content="width=device-width, initial-scale=1">
11
- <meta name="apple-mobile-web-app-capable" content="yes">
12
- <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
13
-
14
- <meta property="og:locale" content="en_US" />
15
- <meta property="og:image" content="https://cloud.githubusercontent.com/assets/2662304/19168687/f6a567be-8c19-11e6-8561-ce8d589e8346.gif"/>
16
- <meta property="og:url" content="http://my-netdata.io/"/>
17
- <meta property="og:type" content="website"/>
18
- <meta property="og:site_name" content="netdata"/>
19
- <meta property="og:title" content="netdata - real-time performance monitoring, done right!"/>
20
- <meta property="og:description" content="Stunning real-time dashboards, blazingly fast and extremely interactive. Zero configuration, zero dependencies, zero maintenance." />
21
-</head>
1
+<!doctype html>
2
+<html lang=en-us>
3
+<meta charset=utf-8>
4
+<title>NetData - Real-time performance monitoring, done right!</title>
5
+<meta name=description
6
+ content="Stunning real-time dashboards, blazingly fast and extremely interactive. Zero configuration, zero dependencies, zero maintenance.">
7
+<meta name=viewport content="width=device-width,initial-scale=1">
8
+<link rel=apple-touch-icon href=apple-touch-icon.png>
9
+
10
+<style>/*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */
11
+html {
12
+ line-height: 1.15;
13
+ -ms-text-size-adjust: 100%;
14
+ -webkit-text-size-adjust: 100%;
15
+ color: #fff;
16
+ font: 17px/1.4 'Open Sans', sans-serif;
17
+ text-align: center
18
+}
19
+
20
+body {
21
+ margin: 0;
22
+ background-color: #2f3135;
23
+ background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADoAAAA9BAMAAAAOkGejAAAAGFBMVEUKCgoUFBQAAAAPDw8ZGRkeHh4jIyMFBQUUJmucAAAACHRSTlMzMzMzMzMzM85JBgUAAAV1SURBVDjLBQC3tkMA9OqrbtWtCKwErLoVhDUP5PffAUvqhtJFWytU/UqOWbf0nG8ZSVyyfSPwrjqzxYailPJtJu/uihN7np+51RrBgYosPTzBElTZCg8JieV4W/HJciqhFwhQLBmkX5JnNzzMlOGvQChGCKbanFWBgVeRCr9L6BZCgZxB/0wN7zTO2QuP80SIL3F5Ydbnhz12iE/nSOMrqwK/OMfbAYHkioJlnlj9CKUbeomN61U5LQ6nWRmg+tfrDusm2LHGDnRDdHUp5CLTvoHrwgtZlIr/+FyoPz2tz/HiQzc8x1TWqAZp99yto4qGuAs20qucNqPyUAyqHuAp2Hhv0OR1LC+g2voMngjB2uvyVvf0aFhD1Mi/f5Q6MER7SzJWu2AW3my9l8mB4W3WfCqwf+ikfc7pudFVvOMy0ikuSoF47zw6UYPxdqWRRSRo91RZtWYa/sQeri7tMPKcCao0vs9QTQC+8CuoReAkHuKRZCi2qtv9zJLAHfSoRltH/+sj9rlgdBTsfUbTEb7oTbTJ8acxbjMQnaftBkRVVerOeKhKr3jkRzTzqS6RpJNvF0MhOBQm/BRXor/MU/YjObdYIu1/iaQ+IviYnlsG6r3cbQoB7cj4SPgMSkLzgIM24+LSjb2sYxWDtIhCdzBfS5Kh768XgH5jkSLjrvRX/nQnv+SXQMvagpPVScAZwWhVbvPdPqcr3X/u8z558ddIdjmVMH9CIVvrW+8rPVq6M54Pf+tebGkIXwPevaCgdQ59wWbULrPB4dPT8suLWr13YKUuDNTpGBspJ9fPGSNOEjp2TYXTIgF8QgEtzX0gIbXRP8JGMbxh1uHA/CwE4a/KHUc8KzV868fO4o+8GNcNvdPaKfzprkunXIthFS9MqpEG1p7ozWTJTcnAlvUnjixEaGn5ll1yuZbtIgS/r2ISBSDE2nsksYx7YFwH2ytB0rXzqh52qJowchJSI3RJmxHeJGZFDq37LWVmzvkgA7zjT2iOsHsdb9viBQLPx3gUmys1cQG6HOEsopo6glj0VXdyli/FJsnSbg5FQLpDO1xiy0ozQy0InDVNZTuXbhENG9gu28ZoHg/de53YTAVqCwl966V7VX/g+AW3ysMyMjXNhOuaLFmBJ2Z1x9LfG55m/34snAnOgXbMqZIbaop8Zjk5P3fAw9h8vkwHKZAC7yqW6+85ZdpAFD8iAjbVRj8BI3PMYJ2oiKNrZHKSnfNJ2UZwtcT9IryvNrGxdqtCx4vc74z39odPA/h5f/MJu46HKUOcbURZd/E2QH6Kgv8Aa2PSevG2gMfoYHWdN38kadbiFHonAjv50PjgyFZwannFGebUjVmxFnokoTbwWBNVd7qx9KG1joZ69npEk0jRr7/aBYQ5ipNcGRvqjeT+kFjTgv7n33L0zlBIH6CoeaPm9eQN6uKmSwE/LAtDPgMNAOQ5X1Vr8Zd0BQlLTV88U6LzD+6iwQp9NSHD5uCcqml/N0NgRmDN9vNS6A/QJBm2jvBbFTLvly/mtLX1rg5kwgPvA4rA+LIdN3bkVvhrqk8OUYZpuYxaXW/gPVlDxtru6+3Z0KY5DMac3pQzo8y7hO2qxdd6lnvUSdXfFRduigV0YuZv9peBHwHix+d4M7fL/Y44jX6S5ZdOzBoEC2fEohdSE7PTjRBUT3T+jclLxWbKdEOoiuB81dV0xo2pFPOXZmpEMueTDrAjAr8k6y15pMsoCHOyT5qlyWn85HLLuyyAWMlmmjYSNKnv9nRsTib5DSbWLPkJjoVihW/eRQqy/dja151zycTHTBmuroDeXRvVzJ3VFWB65e+L6xu+D5fa+D0BESL4VjlKSKrvs9W69lhj2345pBjIr3+RSJFuS0A/sQAAAABJRU5ErkJggg==)
24
+}
25
+
26
+a {
27
+ background-color: transparent;
28
+ -webkit-text-decoration-skip: objects;
29
+ color: #069;
30
+ text-decoration: none
31
+}
32
+
33
+a:active, a:hover {
34
+ outline-width: 0
35
+}
36
+
37
+strong {
38
+ font-weight: bolder
39
+}
40
+
41
+h1 {
42
+ font-size: 3em;
43
+ line-height: 1.2em;
44
+ margin: 0 .5em .75em
45
+}
46
+
47
+img {
48
+ border-style: none;
49
+ vertical-align: middle
50
+}
51
+
52
+[type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner {
53
+ border-style: none;
54
+ padding: 0
55
+}
56
+
57
+[type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring, button:-moz-focusring {
58
+ outline: 1px dotted ButtonText
59
+}
60
+
61
+a:active, a:focus, a:hover {
62
+ text-decoration: underline
63
+}
64
+
65
+::-moz-selection {
66
+ background-color: #b3d4fc;
67
+ text-shadow: none
68
+}
69
+
70
+::selection {
71
+ background-color: #b3d4fc;
72
+ text-shadow: none
73
+}
74
+
75
+h2 {
76
+ font-size: 2em;
77
+ margin: 1.5em 0
78
+}
79
+
80
+h3 {
81
+ color: #555;
82
+ font-size: 1.25em;
83
+ margin: 0 0 .5em
84
+}
85
+
86
+p {
87
+ margin: 0 0 2em
88
+}
89
+
90
+.grid {
91
+ margin: 0 -15px;
92
+ letter-spacing: -.31em;
93
+ word-spacing: -.43em;
94
+ text-rendering: optimizespeed
95
+}
96
+
97
+.grid-cell {
98
+ display: inline-block;
99
+ letter-spacing: normal;
100
+ text-align: left;
101
+ text-rendering: auto;
102
+ vertical-align: top;
103
+ width: 50%;
104
+ word-spacing: normal
105
+}
106
+
107
+.grid-cell > * {
108
+ padding: 0 15px
109
+}
110
+
111
+.inline-block-list {
112
+ list-style-type: none;
113
+ margin: 0;
114
+ padding: 0
115
+}
116
+
117
+.inline-block-list li {
118
+ display: inline-block;
119
+ margin: 0 0 0 1.5em;
120
+ padding: 0;
121
+ vertical-align: top
122
+}
123
+
124
+.inline-block-list li:first-child {
125
+ margin-left: 0
126
+}
127
+
128
+.flex-embed {
129
+ background-color: #000;
130
+ box-shadow: 0 0 10px #000;
131
+ height: 0;
132
+ overflow: hidden;
133
+ padding-bottom: 56.25%;
134
+ position: relative
135
+}
136
+
137
+.flex-embed a, .flex-embed img {
138
+ bottom: 0;
139
+ height: 100%;
140
+ left: 0;
141
+ position: absolute;
142
+ top: 0;
143
+ width: 100%
144
+}
145
+
146
+.flex-embed .play-btn {
147
+ background: url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjMDAwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBkPSJNMjU2LDkyLjQ4MWM0NC40MzMsMCw4Ni4xOCwxNy4wNjgsMTE3LjU1Myw0OC4wNjRDNDA0Ljc5NCwxNzEuNDExLDQyMiwyMTIuNDEzLDQyMiwyNTUuOTk5cy0xNy4yMDYsODQuNTg4LTQ4LjQ0OCwxMTUuNDU1Yy0zMS4zNzIsMzAuOTk0LTczLjEyLDQ4LjA2NC0xMTcuNTUyLDQ4LjA2NHMtODYuMTc5LTE3LjA3LTExNy41NTItNDguMDY0QzEwNy4yMDYsMzQwLjU4Nyw5MCwyOTkuNTg1LDkwLDI1NS45OTlzMTcuMjA2LTg0LjU4OCw0OC40NDgtMTE1LjQ1M0MxNjkuODIxLDEwOS41NSwyMTEuNTY4LDkyLjQ4MSwyNTYsOTIuNDgxIE0yNTYsNTIuNDgxIGMtMTEzLjc3MSwwLTIwNiw5MS4xMTctMjA2LDIwMy41MThjMCwxMTIuMzk4LDkyLjIyOSwyMDMuNTIsMjA2LDIwMy41MmMxMTMuNzcyLDAsMjA2LTkxLjEyMSwyMDYtMjAzLjUyQzQ2MiwxNDMuNTk5LDM2OS43NzIsNTIuNDgxLDI1Niw1Mi40ODFMMjU2LDUyLjQ4MXogTTIwNi41NDQsMzU3LjE2MVYxNTkuODMzbDE2MC45MTksOTguNjY2TDIwNi41NDQsMzU3LjE2MXoiPjwvcGF0aD48L3N2Zz4K);
148
+ height: 150px;
149
+ left: 50%;
150
+ margin-left: -75px;
151
+ margin-top: -75px;
152
+ position: absolute;
153
+ top: 50%;
154
+ -webkit-transition: 1s;
155
+ transition: 1s;
156
+ width: 150px
157
+}
158
+
159
+.flex-embed:hover .play-btn {
160
+ opacity: .5
161
+}
162
+
163
+.clearfix:after, .clearfix:before {
164
+ content: ' ';
165
+ display: table
166
+}
167
+
168
+.clearfix:after {
169
+ clear: both
170
+}
171
+
172
+.clearfix {
173
+ *zoom: 1
174
+}
175
+
176
+.container {
177
+ margin: 0 auto;
178
+ max-width: 760px;
179
+ padding: 0 10px
180
+}
181
+
182
+.aside {
183
+ background-color: #eee;
184
+ border: solid #e3e3e3;
185
+ border-width: 1px 0;
186
+ font-size: 1.125em;
187
+ padding: 1em 0
188
+}
189
+
190
+.btn, .cta-option {
191
+ display: inline-block;
192
+ position: relative
193
+}
194
+
195
+.cta-option {
196
+ margin: 2.5em .5em 0;
197
+ vertical-align: top
198
+}
199
+
200
+.btn {
201
+ color: #fff;
202
+ font-size: 1.5em;
203
+ padding: .6em 1em;
204
+ text-decoration: none;
205
+ text-shadow: 0 -1px 0 rgba(0, 0, 0, .5);
206
+ vertical-align: middle;
207
+ border-radius: 4px;
208
+ border: 1px solid #333
209
+}
210
+
211
+.btn:active, .btn:focus, .btn:hover {
212
+ text-decoration: none
213
+}
214
+
215
+.btn-download {
216
+ background-color: #d9750b;
217
+ background-image: -webkit-linear-gradient(#f90 10%, #e76a00 100%);
218
+ background-image: linear-gradient(#f90 10%, #e76a00 100%);
219
+ box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset, 0 1px 3px rgba(0, 0, 0, .2);
220
+ border: 1px solid #995309
221
+}
222
+
223
+.btn-download:active, .btn-download:focus, .btn-download:hover {
224
+ background-color: #e0811b;
225
+ background-image: -webkit-linear-gradient(#f0a100 10%, #f70 100%);
226
+ background-image: linear-gradient(#f0a100 10%, #f70 100%)
227
+}
228
+
229
+.btn-download:active {
230
+ background-color: #cf6a00;
231
+ box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .2) inset
232
+}
233
+
234
+.btn-alt {
235
+ background-color: #444;
236
+ border-color: #222;
237
+ box-shadow: none;
238
+ font-size: 1.25em;
239
+ margin-top: .25em
240
+}
241
+
242
+.btn-alt:active, .btn-alt:focus, .btn-alt:hover {
243
+ background-color: #555
244
+}
245
+
246
+.star {
247
+ color: #e08524
248
+}
249
+
250
+.Icon {
251
+ display: inline-block;
252
+ height: 16px;
253
+ margin: -3px 1px 0 0;
254
+ vertical-align: middle;
255
+ width: 16px
256
+}
257
+
258
+.Icon--github {
259
+ background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMjEgMTIxIj48ZyBmaWxsPSIjMTkxNzE3Ij48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTYwLjUgMS42Yy0zMy4zIDAtNjAuNCAyNy02MC40IDYwLjQgMCAyNi43IDE3LjMgNDkuMyA0MS4zIDU3LjMgMyAuNiA0LjEtMS4zIDQuMS0yLjkgMC0xLjQtLjEtNi4yLS4xLTExLjItMTYuNyAzLjYtMjAuMy03LjItMjAuMy03LjItMi43LTctNi43LTguOC02LjctOC44LTUuNS0zLjcuNC0zLjcuNC0zLjcgNi4xLjQgOS4zIDYuMiA5LjMgNi4yIDUuNCA5LjIgMTQuMSA2LjYgMTcuNiA1IC41LTMuOSAyLjEtNi42IDMuOC04LjEtMTMuNC0xLjQtMjcuNS02LjYtMjcuNS0yOS44IDAtNi42IDIuNC0xMiA2LjItMTYuMi0uNi0xLjUtMi43LTcuNy42LTE2IDAgMCA1LjEtMS42IDE2LjYgNi4yIDQuOC0xLjMgMTAtMiAxNS4xLTJzMTAuMy43IDE1LjEgMmMxMS41LTcuOCAxNi42LTYuMiAxNi42LTYuMiAzLjMgOC4zIDEuMiAxNC41LjYgMTYgMy45IDQuMiA2LjIgOS42IDYuMiAxNi4yIDAgMjMuMi0xNC4xIDI4LjMtMjcuNSAyOS44IDIuMiAxLjkgNC4xIDUuNSA0LjEgMTEuMiAwIDguMS0uMSAxNC42LS4xIDE2LjYgMCAxLjYgMS4xIDMuNSA0LjEgMi45IDI0LTggNDEuMy0zMC42IDQxLjMtNTcuMyAwLTMzLjQtMjctNjAuNC02MC40LTYwLjR6Ii8+PHBhdGggZD0iTTIzIDg4LjNjLS4xLjMtLjYuNC0xIC4ycy0uNy0uNi0uNS0uOWMuMS0uMy42LS40IDEtLjJzLjYuNi41Ljl6bS0uOC0uNU0yNS40IDkxYy0uMy4zLS45LjEtMS4yLS4zLS40LS40LS41LTEtLjItMS4zLjMtLjMuOC0uMSAxLjIuMy41LjUuNSAxLjEuMiAxLjN6bS0uNS0uNk0yNy44IDk0LjVjLS40LjMtMSAwLTEuMy0uNS0uNC0uNS0uNC0xLjIgMC0xLjQuNC0uMyAxIDAgMS4zLjUuNC41LjQgMS4xIDAgMS40em0wIDBNMzEuMSA5Ny45Yy0uMy40LTEgLjMtMS42LS4yLS41LS41LS43LTEuMi0uMy0xLjUuMy0uNCAxLS4zIDEuNi4yLjUuNC42IDEuMS4zIDEuNXptMCAwTTM1LjYgOTkuOGMtLjEuNS0uOC43LTEuNS41LS43LS4yLTEuMS0uOC0xLTEuMi4xLS41LjgtLjcgMS41LS41LjcuMiAxLjEuNyAxIDEuMnptMCAwTTQwLjUgMTAwLjJjMCAuNS0uNi45LTEuMy45LS43IDAtMS4zLS40LTEuMy0uOXMuNi0uOSAxLjMtLjljLjcgMCAxLjMuNCAxLjMuOXptMCAwTTQ1LjEgOTkuNGMuMS41LS40IDEtMS4xIDEuMS0uNy4xLTEuMy0uMi0xLjQtLjctLjEtLjUuNC0xIDEuMS0xLjEuNy0uMSAxLjMuMiAxLjQuN3ptMCAwIi8+PC9nPjwvc3ZnPgo=)
260
+}
261
+
262
+.Icon--html5 {
263
+ background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjUwIDEwMSA0MTIgNDEyIj48cGF0aCBmaWxsPSIjRTQ0RDI2IiBkPSJNMTA3LjY0NCA0NzAuODc3bC0zMy4wMTEtMzcwLjI1N2gzNjIuNzM0bC0zMy4wNDYgMzcwLjE5OS0xNDguNTQzIDQxLjE4MXoiLz48cGF0aCBmaWxsPSIjRjE2NTI5IiBkPSJNMjU2IDQ4MC41MjNsMTIwLjAzLTMzLjI3NyAyOC4yNC0zMTYuMzUyaC0xNDguMjd6Ii8+PHBhdGggZmlsbD0iI0VCRUJFQiIgZD0iTTI1NiAyNjguMjE3aC02MC4wOWwtNC4xNS00Ni41MDFoNjQuMjR2LTQ1LjQxMWgtMTEzLjg2OGwxLjA4NyAxMi4xODMgMTEuMTYxIDEyNS4xMzloMTAxLjYyem0wIDExNy45MzZsLS4xOTkuMDUzLTUwLjU3NC0xMy42NTYtMy4yMzMtMzYuMjE3aC00NS41ODVsNi4zNjIgNzEuMzAxIDkzLjAyIDI1LjgyMy4yMDktLjA1OHoiLz48cGF0aCBmaWxsPSIjZmZmIiBkPSJNMjU1Ljg0MyAyNjguMjE3djQ1LjQxaDU1LjkxOGwtNS4yNzEgNTguODk0LTUwLjY0NyAxMy42N3Y0Ny4yNDRsOTMuMDk0LTI1LjgwMS42ODMtNy42NzIgMTAuNjcxLTExOS41NTEgMS4xMDgtMTIuMTk0aC0xMi4yMzd6bTAtOTEuOTEydjQ1LjQxMWgxMDkuNjg4bC45MTEtMTAuMjA3IDIuMDY5LTIzLjAyMSAxLjA4Ni0xMi4xODN6Ii8+PC9zdmc+Cg==)
264
+}
265
+
266
+.Icon--stackoverflow {
267
+ background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjMgMi44IDU4LjIgNTgiPjxwYXRoIGQ9Ik05LjMwNSAzNi44NDhsNC40MDEuMDQzLS4xNTMgMTkuNTk4aDI5LjI5MXYtMTkuNTI4aDQuNjM4djI0LjI4N2gtMzguMjAxbC4wMjQtMjQuNDAxem03LjE3NyAxMS41ODZoMjIuOTQ1djQuODgyaC0yMi45NDV6IiBmaWxsPSIjOTE5MTkxIi8+PHBhdGggZmlsbD0iI2E3OGI2OCIgZD0iTTE3LjAyIDM5LjY0OGwyMi45NiAyLjIxNi0uNDgxIDQuOTgxLTIyLjk2LTIuMjE2eiIvPjxwYXRoIGZpbGw9IiNjMTk2NTMiIGQ9Ik0xOS4xMjEgMjkuNzEzbDIyLjIgNi4yNjYtMS4zNTkgNC44MTYtMjIuMi02LjI2NnoiLz48cGF0aCBmaWxsPSIjZDQ4YzI4IiBkPSJNMjQuNTAxIDE4LjQ4NGwxOS43NDUgMTEuOTI2LTIuNTg3IDQuMjgzLTE5Ljc0NS0xMS45MjZ6Ii8+PHBhdGggZmlsbD0iI2ZlODkwOCIgZD0iTTM1LjczMyA3Ljg0OWwxMy40MzUgMTguNzUxLTQuMDY4IDIuOTE0LTEzLjQzNS0xOC43NTF6Ii8+PHBhdGggZmlsbD0iI2ZmN2ExNSIgZD0iTTUxLjM0IDIuNzUxbDMuODAyIDIyLjc1Mi00LjkzNi44MjUtMy44MDItMjIuNzUyeiIvPjwvc3ZnPgo=)
268
+}
269
+
270
+.site-header {
271
+ padding-top: 50px
272
+}
273
+
274
+.site-logo {
275
+ color: #fff;
276
+ float: left;
277
+ font-size: 25px;
278
+ font-weight: 700;
279
+ line-height: 32px;
280
+ text-decoration: none;
281
+ text-shadow: 2px 2px 0 #000;
282
+ text-transform: uppercase
283
+}
284
+
285
+.site-nav {
286
+ float: right;
287
+ list-style-type: none;
288
+ margin: 7px 0 0;
289
+ padding: 0
290
+}
291
+
292
+.site-nav a {
293
+ color: #ffa000;
294
+ display: block;
295
+ text-decoration: none;
296
+ text-transform: uppercase
297
+}
298
+
299
+.site-nav a:active, .site-nav a:focus, .site-nav a:hover {
300
+ color: #fff
301
+}
302
+
303
+.site-promo {
304
+ padding: 4em 0 6em;
305
+ color: white;
306
+}
307
+
308
+.site-promo .description {
309
+ color: #ddd;
310
+ font-size: 1.2em;
311
+ margin: 1em 2em 0
312
+}
313
+
314
+.last-update {
315
+ color: #999;
316
+ display: block;
317
+ font-size: .75em;
318
+ margin-top: 10px
319
+}
320
+
321
+.site-section {
322
+ background-color: #f9f9f9;
323
+ color: #333;
324
+ overflow: hidden;
325
+ padding: 2em 0 6em
326
+}
327
+
328
+.site-section-video {
329
+ background-color: transparent;
330
+ color: #fff;
331
+ text-align: center;
332
+ padding: 2em 0 3em
333
+}
334
+
335
+.site-section-video .content {
336
+ max-width: 720px;
337
+ margin: auto;
338
+ padding: 10px
339
+}
340
+
341
+.site-section-video h2 {
342
+ margin: 1em 0
343
+}
344
+
345
+.in-the-wild {
346
+ font-size: 1.25em;
347
+ margin: 0 auto;
348
+ max-width: 720px
349
+}
350
+
351
+.site-footer {
352
+ font-size: .875em;
353
+ padding: 2em
354
+}
355
+
356
+.site-footer a {
357
+ color: #ffa000
358
+}
359
+
360
+@media only screen and (max-width: 800px) {
361
+ .site-logo, .site-nav {
362
+ float: none
363
+ }
364
+
365
+ .site-nav li {
366
+ margin: 0 .5em
367
+ }
368
+
369
+ .site-header {
370
+ padding-top: 40px
371
+ }
372
+
373
+ .site-promo {
374
+ padding: 3em 0;
375
+ color: white;
376
+ }
377
+
378
+ .site-section {
379
+ padding: 0 1em 4em
380
+ }
381
+}
382
+
383
+@media only screen and (max-width: 600px) {
384
+ html {
385
+ font-size: 14px
386
+ }
387
+
388
+ .last-update, .site-footer {
389
+ font-size: 1em
390
+ }
391
+}
392
+
393
+@media only screen and (max-width: 460px) {
394
+ .grid-cell {
395
+ width: 100%
396
+ }
397
+}
398
+
399
+@media only screen and (max-width: 420px) {
400
+ h1 {
401
+ font-size: 2.5em
402
+ }
403
+
404
+ html {
405
+ font-size: 13px
406
+ }
407
+}
408
+
409
+@media print {
410
+ * {
411
+ background-color: transparent !important;
412
+ box-shadow: none !important;
413
+ color: #000 !important;
414
+ text-shadow: none !important
415
+ }
416
+
417
+ a, a:visited {
418
+ text-decoration: underline
419
+ }
420
+
421
+ img {
422
+ page-break-inside: avoid;
423
+ max-width: 100% !important
424
+ }
425
+
426
+ h1 {
427
+ padding: 1em 0 0
428
+ }
429
+
430
+ .site-promo {
431
+ margin: 1em;
432
+ padding: 0;
433
+ color: white;
434
+ }
435
+
436
+ .site-section {
437
+ padding: 0;
438
+ margin: 2em 1em
439
+ }
440
+
441
+ .site-section-video {
442
+ display: none
443
+ }
444
+
445
+ h2, h3, p {
446
+ orphans: 3;
447
+ widows: 3
448
+ }
449
+
450
+ h2, h3 {
451
+ page-break-after: avoid
452
+ }
453
+}
454
+</style>
455
456
<script>
457
// --- OPTIONS FOR THE DASHBOARD --
@@ -31,39 +464,40 @@
464
// var netdataTheme = 'default'; // this is white
465
var netdataTheme = 'slate'; // this is dark
466
467
+ var netdataNoBootstrap = true;
468
469
// Set the default netdata server.
470
// on charts without a 'data-host', this one will be used.
471
// the default is the server that dashboard.js is downloaded from.
472
473
// var netdataServer = 'http://my.server:19999/';
40
- </script>
474
+</script>
475
42
- <!--
43
- --- LOAD dashboard.js ---
476
+<!--
477
+ --- LOAD dashboard.js ---
478
45
- to host this HTML file on your web server,
46
- you have to load dashboard.js from the netdata server.
479
+ to host this HTML file on your web server,
480
+ you have to load dashboard.js from the netdata server.
481
48
- So, pick one the two below
49
- If you pick the first, set the server name/IP.
482
+ So, pick one the two below
483
+ If you pick the first, set the server name/IP.
484
51
- The second assumes you host this file on /usr/share/netdata/web
52
- and that you have chown it to be owned by netdata:netdata
53
- -->
54
- <!-- <script type="text/javascript" src="http://my.server:19999/dashboard.js"></script> -->
55
- <script type="text/javascript" src="dashboard.js?v20161112-1"></script>
485
+ The second assumes you host this file on /usr/share/netdata/web
486
+ and that you have chown it to be owned by netdata:netdata
487
+-->
488
+<!-- <script type="text/javascript" src="http://my.server:19999/dashboard.js"></script> -->
489
+<script type="text/javascript" src="dashboard.js?v20161112-1"></script>
490
57
- <script>
491
+<script>
492
// --- OPTIONS FOR THE CHARTS --
493
494
// destroy charts not shown (lowers memory on the browsers)
495
// set this to 'true' to destroy, 'false' to hide the charts
496
NETDATA.options.current.destroy_on_hide = false;
63
-
497
+
498
// set this to false, to always show all dimensions
499
NETDATA.options.current.eliminate_zero_dimensions = true;
66
-
500
+
501
// set this to false, to lower the pressure on the browser
502
NETDATA.options.current.concurrent_refreshes = true;
503
@@ -77,139 +511,172 @@
511
// abort ajax calls when we scroll
512
NETDATA.options.current.abort_ajax_on_scroll = true;
513
</script>
514
+
515
<style>
81
- body {
82
- font-size: 1vw;
516
+ .mygauge-combo {
517
+ display: inline-block;
518
+ }
519
+
520
+ .mygauge {
521
+ position: relative;
522
+ display: block;
523
+ width: 171px;
524
+ height: 105px;
525
+ }
526
+
527
+ .mygauge-button {
528
+ display: block;
529
+ }
530
+
531
+ .mygauge-legend-button {
532
+ font-size: 13px;
533
+ }
534
+
535
+ .mygause-donation {
536
+ font-size: 9px;
537
+ color: #999;
538
}
539
540
.mysparkline {
541
position: relative;
542
display: inline-block;
88
- min-height: 50px;
543
width: 100%;
90
- height: 7vmax;
544
+ height: 50px;
545
text-align: left;
546
}
547
548
.mysparkline-overchart-label {
549
position: absolute;
550
display: block;
97
- top: 0;
551
+ top: -15px;
552
left: 10px;
553
bottom: 0;
554
right: 0;
101
- font-size: 1vmax;
555
+ font-size: 14px;
556
z-index: 1;
557
}
558
559
.mysparkline-overchart-value {
560
position: absolute;
561
display: block;
108
- top: 1.1vmax;
562
+ top: 0px;
563
left: 10px;
564
bottom: 0;
565
right: 0;
112
- font-size: 5vmax;
566
+ font-size: 40px;
567
z-index: 2;
568
text-shadow: #333 0px 0px 2px;
569
}
570
117
- .myfullchart {
118
- position: relative;
119
- display: inline-block;
120
- width: 100%;
121
- height: 12vmax;
122
- min-height: 150px;
123
- text-align: left;
124
- }
125
-
126
- .mygauge-combo {
127
- display: inline-block;
128
- }
129
-
130
- .mygauge {
131
- position: relative;
132
- display: block;
133
- width: 18vw;
134
- height: 11vw;
135
- }
136
-
137
- .mygauge-button {
571
+ .mysparkline-overchart-value-center {
572
+ position: absolute;
573
display: block;
139
- }
140
-
141
- .mytitle {
142
- padding-top: 6vw;
143
- padding-bottom: 1vw;
144
- text-align: center;
145
- font-size: 2.4vw;
146
- }
147
-
148
- .mysubtitle {
149
- padding-top: 2vw;
150
- padding-bottom: 1vw;
574
+ top: 5px;
575
+ left: 0px;
576
+ bottom: 0;
577
+ right: 0;
578
+ font-size: 35px;
579
+ font-weight: bold;
580
text-align: center;
152
- font-size: 1.8vw;
581
+ z-index: 2;
582
+ text-shadow: #333 0px 0px 2px;
583
}
584
155
- .mycontent {
156
- text-align: center;
157
- font-size: 1.5vw;
158
- }
585
160
- @media only screen and (min-width : 992px) {
161
- .container {
162
- width: 80%;
163
- }
164
- }
165
- @media only screen and (max-width : 992px) {
166
- .container {
167
- width: 100%;
168
- }
169
- }
586
</style>
587
172
-<body style="text-align: center; background-color: #272b30;">
173
-
174
-<div class="container">
175
-
176
- <div style="text-align: center; font-size: 13vw; height: 14vw;">
177
- <b>netdata</b>
178
- </div>
179
- <div style="text-align: center; font-size: 2vw; height: 2.5vw;">
180
- real-time performance monitoring
181
- </div>
182
- <div style="width:80%; text-align: right; font-size: 2.7vw;">
183
- <strong>scaled out</strong>!
588
+<div class=container>
589
+ <div class="site-header clearfix" role=banner>
590
+ <div class=site-logo>my-netdata.io</div>
591
+ <ul class="site-nav inline-block-list">
592
+ <li><a href=https://github.com/firehol/netdata data-ga-category="Outbound links"
593
+ data-ga-action="Nav click" data-ga-label="Source code">Source code</a>
594
+ <li><a href=https://github.com/firehol/netdata/wiki
595
+ data-ga-category="Outbound links" data-ga-action="Nav click" data-ga-label=Docs>Docs</a>
596
+ </ul>
597
</div>
185
- <div class="mytitle">
186
- pick a <b>netdata</b> demo server
187
- </div>
188
- <div class="mycontent">
189
- these demo servers show what you will get by installing <b>netdata</b>
598
+ <div class=site-promo><h1>Linux’s most powerful performance monitoring</h1>
599
+ <p class=description>
600
+ <strong>Unparalleled</strong> insights, in <strong>real-time</strong>,
601
+ of <strong>everything</strong> happening on your Linux systems and applications,
602
+ with <strong>stunning</strong> interactive web dashboards
603
+ and powerful <strong>performance</strong> and <strong>health</strong> alarms.
604
+ <div class=cta-option>
605
+ <a class="btn btn-download" href=https://github.com/firehol/netdata/wiki/Installation
606
+ data-ga-category="Outbound links" data-ga-action="Nav click" data-ga-label=Install><strong>Install netdata now</strong></a>
607
+ <a class=last-update href=https://github.com/firehol/netdata/releases
608
+ data-ga-category="Outbound links" data-ga-action="Nav click" data-ga-label=Releases>See netdata releases</a></div>
609
+ <div class=cta-option>
610
+ <a class="btn btn-alt" href="#demosites">netdata live demo</a>
611
+ </div>
612
</div>
613
192
- <div style="width: 100%; text-align: center; padding-top: 2vw;">
193
- <div style="width: 100%; text-align: center;">
614
+</div>
615
+<div class=site-section>
616
+ <div class=container><h2>Get control of your Linux servers</h2>
617
+ <div class=grid>
618
+ <div class=grid-cell><h3><span class=star>★</span> Monitor everything</h3>
619
+ <p>Analyze thousands of metrics per server.
620
+ Everything about the system (CPU, RAM, disks, network, firewall, QoS, NFS, etc) and detailed performance metrics for dozens of Linux applications
621
+ (such as web servers, databases servers, email servers, DNS servers, etc)
622
+ and <strong>SNMP</strong> devices.
623
+ </div>
624
+ <div class=grid-cell><h3><span class=star>★</span> With alarms</h3>
625
+ <p>Alarms can be set on any metric monitored by netdata.
626
+ Alarm notifications are role-based and support dynamic thresholds, hysteresis and can be dispatched
627
+ via multiple methods (such as email, slack.com, pushover.net, pushbullet.com telegram.org, twilio.com).
628
+ </div>
629
+ <div class=grid-cell><h3><span class=star>★</span> In real-time</h3>
630
+ <p>netdata collects thousands of metrics per server <strong>per second</strong>, with just 1% CPU
631
+ utilization of a single core, a few MB or RAM and no disk I/O at all.
632
+ View everything on <strong>stunning</strong> real-time interactive web dashboards, even when netdata is
633
+ running on low-end hardware.
634
+ </div>
635
+ <div class=grid-cell><h3><span class=star>★</span> Out of the box</h3>
636
+ <p>netdata supports auto-detection for everything. It collects more than 5000 metrics automatically, with
637
+ <strong>zero configuration</strong>, it has <strong>zero dependencies</strong>, requires <strong>zero
638
+ maintenance</strong> and comes with more than 100 alarms pre-configured to detect common
639
+ failures, performance and availability issues.
640
+ </div>
641
+ <div class=grid-cell><h3><span class=star>★</span> Embeddable</h3>
642
+ <p>netdata can run anywhere a Linux kernel runs (even IoT) and its charts can be embedded on any web site too.
643
+ </div>
644
+ <div class=grid-cell><h3><span class=star>★</span> Customizable</h3>
645
+ <p>Custom dashboards can be built using simple HTML (no javascript necessary).
646
+ </div>
647
+ <div class=grid-cell><h3><span class=star>★</span> Extensible</h3>
648
+ <p>Anything you can get a number for, can be given to netdata, using its Plugin API (anything can be a netdata plugin, BASH, python, perl, node.js, java, Go, ruby, etc).
649
+ </div>
650
+ <div class=grid-cell><h3><span class=star>★</span> Scalable</h3>
651
+ <p>netdata scales out, your web browser is the central netdata connecting all your servers together.
652
+ netdata can archive its metrics to <strong>graphite</strong> or <strong>opentsdb</strong> at a lower
653
+ rate, to avoid congesting these servers with the amount of data collected.
654
+ </div>
655
+ </div>
656
+ </div>
657
+</div>
658
+<div id="demosites" class="site-section site-section-video"><h2>netdata live demo sites</h2>
659
+ <div class="content">
660
+ <div class="container" style="text-align: center;">
661
662
<div class="mygauge-combo">
663
<div class="mygauge">
664
<div data-netdata="netdata.requests"
198
- data-host="//london.my-netdata.io"
199
- data-title="EU - London"
200
- data-chart-library="gauge"
201
- data-decimal-digits="0"
202
- data-common-max="top-gauges"
203
- data-width="100%"
204
- data-after="-300"
205
- data-points="300"
206
- data-colors="#558855"
207
- ></div>
665
+ data-host="//london.my-netdata.io"
666
+ data-title="EU - London"
667
+ data-chart-library="gauge"
668
+ data-decimal-digits="0"
669
+ data-common-max="top-gauges"
670
+ data-width="100%"
671
+ data-after="-300"
672
+ data-points="300"
673
+ data-colors="#558855"
674
+ ></div>
675
</div>
676
<div class="mygauge-button">
677
<br/> <br/>
211
- <button type="button" class="btn btn-default" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//london.my-netdata.io/default.html'" style="font-size: 1.0vw;">Enter London!</button>
212
- <div style="font-size: 0.8vw;">
678
+ <button type="button" class="btn btn-alt mygauge-legend-button" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//london.my-netdata.io/default.html'">Enter London!</button>
679
+ <div class="mygause-donation">
680
Donated by DigitalOcean.com
681
</div>
682
</div>
@@ -217,21 +684,21 @@
684
<div class="mygauge-combo">
685
<div class="mygauge">
686
<div data-netdata="netdata.requests"
220
- data-host="//atlanta.my-netdata.io"
221
- data-title="US - Atlanta"
222
- data-chart-library="gauge"
223
- data-decimal-digits="0"
224
- data-common-max="top-gauges"
225
- data-width="100%"
226
- data-after="-300"
227
- data-points="300"
228
- data-colors="#AA5555"
229
- ></div>
687
+ data-host="//atlanta.my-netdata.io"
688
+ data-title="US - Atlanta"
689
+ data-chart-library="gauge"
690
+ data-decimal-digits="0"
691
+ data-common-max="top-gauges"
692
+ data-width="100%"
693
+ data-after="-300"
694
+ data-points="300"
695
+ data-colors="#AA5555"
696
+ ></div>
697
</div>
698
<div class="mygauge-button">
699
<br/> <br/>
233
- <button type="button" class="btn btn-default" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//atlanta.my-netdata.io/default.html'" style="font-size: 1.0vw;">Enter Atlanta!</button>
234
- <div style="font-size: 0.8vw;">
700
+ <button type="button" class="btn btn-alt mygauge-legend-button" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//atlanta.my-netdata.io/default.html'">Enter Atlanta!</button>
701
+ <div class="mygause-donation">
702
Donated by CDN77.com
703
</div>
704
</div>
@@ -239,21 +706,21 @@
706
<div class="mygauge-combo">
707
<div class="mygauge">
708
<div data-netdata="netdata.requests"
242
- data-host="//sanfrancisco.netdata.rocks"
243
- data-title="US - California"
244
- data-chart-library="gauge"
245
- data-decimal-digits="0"
246
- data-common-max="top-gauges"
247
- data-width="100%"
248
- data-after="-300"
249
- data-points="300"
250
- data-colors="#5555AA"
251
- ></div>
709
+ data-host="//sanfrancisco.netdata.rocks"
710
+ data-title="US - California"
711
+ data-chart-library="gauge"
712
+ data-decimal-digits="0"
713
+ data-common-max="top-gauges"
714
+ data-width="100%"
715
+ data-after="-300"
716
+ data-points="300"
717
+ data-colors="#5555AA"
718
+ ></div>
719
</div>
720
<div class="mygauge-button">
721
<br/> <br/>
255
- <button type="button" class="btn btn-default" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//sanfrancisco.netdata.rocks/default.html'" style="font-size: 1.0vw;">Enter California!</button>
256
- <div style="font-size: 0.8vw;">
722
+ <button type="button" class="btn btn-alt mygauge-legend-button" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//sanfrancisco.netdata.rocks/default.html'">Enter California!</button>
723
+ <div class="mygause-donation">
724
Donated by DigitalOcean.com
725
</div>
726
</div>
@@ -261,21 +728,21 @@
728
<div class="mygauge-combo">
729
<div class="mygauge">
730
<div data-netdata="netdata.requests"
264
- data-host="//toronto.netdata.rocks"
265
- data-title="Canada"
266
- data-chart-library="gauge"
267
- data-decimal-digits="0"
268
- data-common-max="top-gauges"
269
- data-width="100%"
270
- data-after="-300"
271
- data-points="300"
272
- data-colors="#885588"
273
- ></div>
731
+ data-host="//toronto.netdata.rocks"
732
+ data-title="Canada"
733
+ data-chart-library="gauge"
734
+ data-decimal-digits="0"
735
+ data-common-max="top-gauges"
736
+ data-width="100%"
737
+ data-after="-300"
738
+ data-points="300"
739
+ data-colors="#885588"
740
+ ></div>
741
</div>
742
<div class="mygauge-button">
743
<br/> <br/>
277
- <button type="button" class="btn btn-default" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//toronto.netdata.rocks/default.html'" style="font-size: 1.0vw;">Enter Canada!</button>
278
- <div style="font-size: 0.8vw;">
744
+ <button type="button" class="btn btn-alt mygauge-legend-button" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//toronto.netdata.rocks/default.html'">Enter Canada!</button>
745
+ <div class="mygause-donation">
746
Donated by DigitalOcean.com
747
</div>
748
</div>
@@ -284,21 +751,21 @@
751
<div class="mygauge-combo">
752
<div class="mygauge">
753
<div data-netdata="netdata.requests"
287
- data-host="//frankfurt.netdata.rocks"
288
- data-title="EU - Germany"
289
- data-chart-library="easypiechart"
290
- data-decimal-digits="0"
291
- data-common-max="top-gauges"
292
- data-width="75%"
293
- data-after="-300"
294
- data-points="300"
295
- data-colors="#AAAA55"
296
- ></div>
754
+ data-host="//frankfurt.netdata.rocks"
755
+ data-title="EU - Germany"
756
+ data-chart-library="easypiechart"
757
+ data-decimal-digits="0"
758
+ data-common-max="top-gauges"
759
+ data-width="75%"
760
+ data-after="-300"
761
+ data-points="300"
762
+ data-colors="#AAAA55"
763
+ ></div>
764
</div>
765
<div class="mygauge-button">
766
<br/> <br/>
300
- <button type="button" class="btn btn-default" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//frankfurt.netdata.rocks/default.html'" style="font-size: 1.0vw;">Enter Germany!</button>
301
- <div style="font-size: 0.8vw;">
767
+ <button type="button" class="btn btn-alt mygauge-legend-button" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//frankfurt.netdata.rocks/default.html'">Enter Germany!</button>
768
+ <div class="mygause-donation">
769
Donated by DigitalOcean.com
770
</div>
771
</div>
@@ -306,21 +773,21 @@
773
<div class="mygauge-combo">
774
<div class="mygauge">
775
<div data-netdata="netdata.requests"
309
- data-host="//newyork.netdata.rocks"
310
- data-title="US - New York"
311
- data-chart-library="easypiechart"
312
- data-decimal-digits="0"
313
- data-common-max="top-gauges"
314
- data-width="75%"
315
- data-after="-300"
316
- data-points="300"
317
- data-colors="#BB5533"
318
- ></div>
776
+ data-host="//newyork.netdata.rocks"
777
+ data-title="US - New York"
778
+ data-chart-library="easypiechart"
779
+ data-decimal-digits="0"
780
+ data-common-max="top-gauges"
781
+ data-width="75%"
782
+ data-after="-300"
783
+ data-points="300"
784
+ data-colors="#BB5533"
785
+ ></div>
786
</div>
787
<div class="mygauge-button">
788
<br/> <br/>
322
- <button type="button" class="btn btn-default" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//newyork.netdata.rocks/default.html'" style="font-size: 1.0vw;">Enter New York!</button>
323
- <div style="font-size: 0.8vw;">
789
+ <button type="button" class="btn btn-alt mygauge-legend-button" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//newyork.netdata.rocks/default.html'">Enter New York!</button>
790
+ <div class="mygause-donation">
791
Donated by DigitalOcean.com
792
</div>
793
</div>
@@ -328,21 +795,21 @@
795
<div class="mygauge-combo">
796
<div class="mygauge">
797
<div data-netdata="netdata.requests"
331
- data-host="//singapore.netdata.rocks"
332
- data-title="Singapore"
333
- data-chart-library="easypiechart"
334
- data-decimal-digits="0"
335
- data-common-max="top-gauges"
336
- data-width="75%"
337
- data-after="-300"
338
- data-points="300"
339
- data-colors="#5588BB"
340
- ></div>
798
+ data-host="//singapore.netdata.rocks"
799
+ data-title="Singapore"
800
+ data-chart-library="easypiechart"
801
+ data-decimal-digits="0"
802
+ data-common-max="top-gauges"
803
+ data-width="75%"
804
+ data-after="-300"
805
+ data-points="300"
806
+ data-colors="#5588BB"
807
+ ></div>
808
</div>
809
<div class="mygauge-button">
810
<br/> <br/>
344
- <button type="button" class="btn btn-default" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//singapore.netdata.rocks/default.html'" style="font-size: 1.0vw;">Enter Singapore!</button>
345
- <div style="font-size: 0.8vw;">
811
+ <button type="button" class="btn btn-alt mygauge-legend-button" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//singapore.netdata.rocks/default.html'">Enter Singapore!</button>
812
+ <div class="mygause-donation">
813
Donated by DigitalOcean.com
814
</div>
815
</div>
@@ -350,762 +817,199 @@
817
<div class="mygauge-combo">
818
<div class="mygauge">
819
<div data-netdata="netdata.requests"
353
- data-host="//bangalore.netdata.rocks"
354
- data-title="India"
355
- data-chart-library="easypiechart"
356
- data-decimal-digits="0"
357
- data-common-max="top-gauges"
358
- data-width="75%"
359
- data-after="-300"
360
- data-points="300"
361
- data-colors="#BB55BB"
362
- ></div>
820
+ data-host="//bangalore.netdata.rocks"
821
+ data-title="India"
822
+ data-chart-library="easypiechart"
823
+ data-decimal-digits="0"
824
+ data-common-max="top-gauges"
825
+ data-width="75%"
826
+ data-after="-300"
827
+ data-points="300"
828
+ data-colors="#BB55BB"
829
+ ></div>
830
</div>
831
<div class="mygauge-button">
832
<br/> <br/>
366
- <button type="button" class="btn btn-default" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//bangalore.netdata.rocks/default.html'" style="font-size: 1.0vw;">Enter India!</button>
367
- <div style="font-size: 0.8vw;">
833
+ <button type="button" class="btn btn-alt mygauge-legend-button" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//bangalore.netdata.rocks/default.html'">Enter India!</button>
834
+ <div class="mygause-donation">
835
Donated by DigitalOcean.com
836
</div>
837
</div>
838
</div>
839
</div>
373
- </div>
374
-
375
- <div class="mytitle">
376
- this page is a custom <b>netdata</b> dashboard
377
- </div>
378
- <div class="mycontent">
379
- charts are coming from 8 servers, in parallel
380
- <br/>
381
- the servers are not aware of this multi-server dashboard,
382
- <br/>
383
- each server is not aware of the other servers,
384
- <br/>
385
- but on this dashboard <b>they are one</b>!
386
- </div>
387
- <div style="padding-top: 1vw; width: 100%; text-align: center; font-size: 1.5vw;">
388
- <i class="fa fa-comment" aria-hidden="true"></i>
389
- hover on a chart below, or drag it to show the past - <b>the others will follow</b>!
390
- <br/>
391
- double click on a chart to reset them all
392
- </div>
393
-
394
- <div class="mytitle">
395
- our <code>nginx</code> performance
396
- </div>
397
- <div class="mycontent">
398
- (we proxy netdata through nginx, on the demo sites)
399
- </div>
400
-
401
- <!-- Nav tabs -->
402
- <ul class="nav nav-tabs" role="tablist" style="padding-top: 1vw;">
403
- <li role="presentation" class="active"><a href="#nginx_requests" aria-controls="nginx_requests" role="tab" data-toggle="tab">Requests</a></li>
404
- <li role="presentation"><a href="#nginx_connections" aria-controls="nginx_connections" role="tab" data-toggle="tab">Connections</a></li>
405
- </ul>
406
-
407
- <!-- Tab panes -->
408
- <div class="tab-content">
409
- <div role="tabpanel" class="tab-pane active" id="nginx_requests">
410
- <div class="mysparkline">
411
- <div class="mysparkline-overchart-label">
412
- <b>EU - London</b> web requests/s
413
- </div>
414
- <div class="mysparkline-overchart-value" id="nginx_local.requests.netdata" >
415
- </div>
416
- <div data-netdata="nginx_local.requests"
417
- data-dimensions="requests"
418
- data-host="//london.my-netdata.io"
419
- data-decimal-digits="0"
420
- data-common-max="web-requests"
421
- data-chart-library="dygraph"
422
- data-dygraph-theme="sparkline"
423
- data-dygraph-type="area"
424
- data-width="100%"
425
- data-height="100%"
426
- data-after="-300"
427
- data-colors="#558855"
428
- data-show-value-of-requests-at="nginx_local.requests.netdata"
429
- ></div>
430
- </div>
431
-
432
- <div class="mysparkline">
433
- <div class="mysparkline-overchart-label">
434
- <b>US - Atlanta</b> web requests/s
435
- </div>
436
- <div class="mysparkline-overchart-value" id="nginx_local.requests.netdata2" >
437
- </div>
438
- <div data-netdata="nginx_local.requests"
439
- data-dimensions="requests"
440
- data-host="//atlanta.my-netdata.io"
441
- data-decimal-digits="0"
442
- data-common-max="web-requests"
443
- data-chart-library="dygraph"
444
- data-dygraph-theme="sparkline"
445
- data-dygraph-type="area"
446
- data-width="100%"
447
- data-height="100%"
448
- data-after="-300"
449
- data-colors="#AA5555"
450
- data-show-value-of-requests-at="nginx_local.requests.netdata2"
451
- ></div>
452
- </div>
453
-
454
- <div class="mysparkline">
455
- <div class="mysparkline-overchart-label">
456
- <b>US - California</b> web requests/s
457
- </div>
458
- <div class="mysparkline-overchart-value" id="nginx_local.requests.netdata3" >
459
- </div>
460
- <div data-netdata="nginx_local.requests"
461
- data-dimensions="requests"
462
- data-host="//sanfrancisco.netdata.rocks"
463
- data-decimal-digits="0"
464
- data-common-max="web-requests"
465
- data-chart-library="dygraph"
466
- data-dygraph-theme="sparkline"
467
- data-dygraph-type="area"
468
- data-width="100%"
469
- data-height="100%"
470
- data-after="-300"
471
- data-colors="#5555AA"
472
- data-show-value-of-requests-at="nginx_local.requests.netdata3"
473
- ></div>
474
- </div>
475
-
476
- <div class="mysparkline">
477
- <div class="mysparkline-overchart-label">
478
- <b>Canada</b> web requests/s
479
- </div>
480
- <div class="mysparkline-overchart-value" id="nginx_local.requests.netdata4" >
481
- </div>
482
- <div data-netdata="nginx_local.requests"
483
- data-dimensions="requests"
484
- data-host="//toronto.netdata.rocks"
485
- data-decimal-digits="0"
486
- data-common-max="web-requests"
487
- data-chart-library="dygraph"
488
- data-dygraph-theme="sparkline"
489
- data-dygraph-type="area"
490
- data-width="100%"
491
- data-height="100%"
492
- data-after="-300"
493
- data-colors="#885588"
494
- data-show-value-of-requests-at="nginx_local.requests.netdata4"
495
- ></div>
496
- </div>
840
+ <div class="container" style="padding-top: 40px; text-align: center;">
841
+ Charts are coming from 8 servers, in parallel.
842
+ <br/>
843
+ The servers are not aware of this multi-server dashboard.
844
+ <br/>
845
+ Each server is not aware of the other servers.
846
+ <br/>
847
+ But on this dashboard <b>they are one</b>! (hover on the chart below)
848
</div>
849
499
- <div role="tabpanel" class="tab-pane" id="nginx_connections">
850
+ <div class="container" style="padding-top: 40px; text-align: center;">
851
<div class="mysparkline">
852
<div class="mysparkline-overchart-label">
502
- <b>EU - London</b> active connections
853
+ <b>EU - London</b> connected clients
854
</div>
504
- <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata1" >
855
+ <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata" >
856
</div>
857
<div data-netdata="nginx_local.connections"
507
- data-dimensions="active"
508
- data-host="//london.my-netdata.io"
509
- data-decimal-digits="0"
510
- data-common-max="web-connections"
511
- data-chart-library="dygraph"
512
- data-dygraph-theme="sparkline"
513
- data-dygraph-type="area"
514
- data-width="100%"
515
- data-height="100%"
516
- data-after="-300"
517
- data-colors="#558855"
518
- data-show-value-of-active-at="nginx_local.connections.netdata1"
519
- ></div>
520
- </div>
521
-
522
- <div class="mysparkline">
523
- <div class="mysparkline-overchart-label">
524
- <b>US - Atlanta</b> active connections
525
- </div>
526
- <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata2" >
527
- </div>
528
- <div data-netdata="nginx_local.connections"
529
- data-dimensions="active"
530
- data-host="//atlanta.my-netdata.io"
531
- data-decimal-digits="0"
532
- data-common-max="web-connections"
533
- data-chart-library="dygraph"
534
- data-dygraph-theme="sparkline"
535
- data-dygraph-type="area"
536
- data-width="100%"
537
- data-height="100%"
538
- data-after="-300"
539
- data-colors="#AA5555"
540
- data-show-value-of-active-at="nginx_local.connections.netdata2"
541
- ></div>
542
- </div>
543
-
544
- <div class="mysparkline">
545
- <div class="mysparkline-overchart-label">
546
- <b>US - California</b> active connections
547
- </div>
548
- <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata3" >
549
- </div>
550
- <div data-netdata="nginx_local.connections"
551
- data-dimensions="active"
552
- data-host="//sanfrancisco.netdata.rocks"
553
- data-decimal-digits="0"
554
- data-common-max="web-connections"
555
- data-chart-library="dygraph"
556
- data-dygraph-theme="sparkline"
557
- data-dygraph-type="area"
558
- data-width="100%"
559
- data-height="100%"
560
- data-after="-300"
561
- data-colors="#5555AA"
562
- data-show-value-of-active-at="nginx_local.connections.netdata3"
563
- ></div>
564
- </div>
565
-
566
- <div class="mysparkline">
567
- <div class="mysparkline-overchart-label">
568
- <b>Canada</b> active connections
569
- </div>
570
- <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata4" >
571
- </div>
572
- <div data-netdata="nginx_local.connections"
573
- data-dimensions="active"
574
- data-host="//toronto.netdata.rocks"
575
- data-decimal-digits="0"
576
- data-common-max="web-connections"
577
- data-chart-library="dygraph"
578
- data-dygraph-theme="sparkline"
579
- data-dygraph-type="area"
580
- data-width="100%"
581
- data-height="100%"
582
- data-after="-300"
583
- data-colors="#885588"
584
- data-show-value-of-active-at="nginx_local.connections.netdata4"
585
- ></div>
586
- </div>
587
- </div>
588
- </div>
589
-
590
- <div style="width: 100%; text-align: right; font-size: 1vw;">
591
- <i class="fa fa-comment" aria-hidden="true"></i> these charts are draggable and touchable, double click them to reset them
592
- </div>
593
-
594
-
595
- <div class="mytitle">
596
- bandwidth consumption on the demo sites
597
- </div>
598
- <div class="mycontent">
599
- Linux QoS is configured by <a href="https://github.com/firehol/netdata/wiki/You-should-install-QoS-on-all-your-servers">FireQOS</a>
600
- </div>
601
-
602
- <!-- Nav tabs -->
603
- <ul class="nav nav-tabs" role="tablist" style="padding-top: 1vw;">
604
- <li role="presentation" class="active"><a href="#outbout" aria-controls="outbout" role="tab" data-toggle="tab">Outbound</a></li>
605
- <li role="presentation"><a href="#inbound" aria-controls="inbound" role="tab" data-toggle="tab">Inbound</a></li>
606
- </ul>
607
-
608
- <!-- Tab panes -->
609
- <div class="tab-content">
610
- <div role="tabpanel" class="tab-pane active" id="outbout">
611
- <div class="myfullchart">
612
- <div data-netdata="tc.world_out"
613
- data-host="//london.my-netdata.io"
614
- data-common-max="tc-world-out"
615
- data-chart-library="dygraph"
616
- data-title="EU - London, traffic we send per service"
617
- data-width="100%"
618
- data-height="100%"
619
- data-after="-300"
620
- ></div>
621
- </div>
622
-
623
- <div class="myfullchart">
624
- <div data-netdata="tc.world_out"
625
- data-host="//atlanta.my-netdata.io"
626
- data-chart-library="dygraph"
627
- data-common-max="tc-world-out"
628
- data-title="US - Atlanta, traffic we send per service"
629
- data-width="100%"
630
- data-height="100%"
631
- data-after="-300"
632
- ></div>
633
-
634
- </div>
635
-
636
- <div class="myfullchart">
637
- <div data-netdata="tc.world_out"
638
- data-host="//sanfrancisco.netdata.rocks"
639
- data-chart-library="dygraph"
640
- data-common-max="tc-world-out"
641
- data-title="US - California, traffic we send per service"
642
- data-width="100%"
643
- data-height="100%"
644
- data-after="-300"
645
- ></div>
646
- </div>
647
-
648
- <div class="myfullchart">
649
- <div data-netdata="tc.world_out"
650
- data-host="//toronto.netdata.rocks"
651
- data-chart-library="dygraph"
652
- data-common-max="tc-world-out"
653
- data-title="Canada, traffic we send per service"
654
- data-width="100%"
655
- data-height="100%"
656
- data-after="-300"
657
- ></div>
658
- </div>
659
- </div>
660
-
661
- <div role="tabpanel" class="tab-pane" id="inbound">
662
- <div class="myfullchart">
663
- <div data-netdata="tc.world_in"
664
- data-host="//london.my-netdata.io"
665
- data-common-max="tc-world-in"
666
- data-chart-library="dygraph"
667
- data-title="EU - London, traffic we receive per service"
668
- data-width="100%"
669
- data-height="100%"
670
- data-after="-300"
671
- ></div>
672
-
673
- </div>
674
-
675
- <div class="myfullchart">
676
- <div data-netdata="tc.world_in"
677
- data-host="//atlanta.my-netdata.io"
678
- data-common-max="tc-world-in"
679
- data-chart-library="dygraph"
680
- data-title="US - Atlanta, traffic we receive per service"
681
- data-width="100%"
682
- data-height="100%"
683
- data-after="-300"
684
- ></div>
685
-
686
- </div>
687
-
688
- <div class="myfullchart">
689
- <div data-netdata="tc.world_in"
690
- data-host="//sanfrancisco.netdata.rocks"
691
- data-common-max="tc-world-in"
692
- data-chart-library="dygraph"
693
- data-title="US - California, traffic we receive per service"
694
- data-width="100%"
695
- data-height="100%"
696
- data-after="-300"
697
- ></div>
698
- </div>
699
-
700
- <div class="myfullchart">
701
- <div data-netdata="tc.world_in"
702
- data-host="//toronto.netdata.rocks"
703
- data-common-max="tc-world-in"
704
- data-chart-library="dygraph"
705
- data-title="Canada, traffic we receive per service"
706
- data-width="100%"
707
- data-height="100%"
708
- data-after="-300"
709
- ></div>
858
+ data-dimensions="active"
859
+ data-host="//london.my-netdata.io"
860
+ data-decimal-digits="0"
861
+ data-common-max="web-connections"
862
+ data-chart-library="dygraph"
863
+ data-dygraph-theme="sparkline"
864
+ data-dygraph-type="area"
865
+ data-width="100%"
866
+ data-height="100%"
867
+ data-after="-300"
868
+ data-colors="#558855"
869
+ data-show-value-of-active-at="nginx_local.connections.netdata"
870
+ ></div>
871
</div>
872
</div>
873
</div>
713
- <div style="width: 100%; text-align: right; font-size: 1vw;">
714
- <i class="fa fa-comment" aria-hidden="true"></i> <i>these legends are interactive and the charts are resizable here ^^^</i>
715
- </div>
716
-
717
- <div class="mytitle">
718
- DDoS protection performance on the demo sites
719
- </div>
720
- <div class="mycontent">
721
- iptables SYNPROXY configured by <a href="https://github.com/firehol/netdata/wiki/Monitoring-SYNPROXY">FireHOL</a>
722
- </div>
723
-
724
- <div style="padding-top: 4vw; width: 100%; text-align: center; font-size: 1.5vw;">
725
-
726
- <div class="mysparkline">
727
- <div class="mysparkline-overchart-label">
728
- <b>EU - London</b>, TCP SYN packets/s received
729
- </div>
730
- <div class="mysparkline-overchart-value" id="netfilter.synproxy_syn_received.netdata1" >
731
- </div>
732
- <div data-netdata="netfilter.synproxy_syn_received"
733
- data-dimensions="received"
734
- data-host="//london.my-netdata.io"
735
- data-decimal-digits="0"
736
- data-common-max="synproxy-in"
737
- data-chart-library="dygraph"
738
- data-dygraph-theme="sparkline"
739
- data-dygraph-type="area"
740
- data-width="100%"
741
- data-height="100%"
742
- data-after="-300"
743
- data-colors="#558855"
744
- data-show-value-of-received-at="netfilter.synproxy_syn_received.netdata1"
745
- ></div>
746
- </div>
747
-
748
- <div class="mysparkline">
749
- <div class="mysparkline-overchart-label">
750
- <b>US - Atlanta</b>, TCP SYN packets/s received
751
- </div>
752
- <div class="mysparkline-overchart-value" id="netfilter.synproxy_syn_received.netdata2" >
753
- </div>
754
- <div data-netdata="netfilter.synproxy_syn_received"
755
- data-dimensions="received"
756
- data-host="//atlanta.my-netdata.io"
757
- data-decimal-digits="0"
758
- data-common-max="synproxy-in"
759
- data-chart-library="dygraph"
760
- data-dygraph-theme="sparkline"
761
- data-dygraph-type="area"
762
- data-width="100%"
763
- data-height="100%"
764
- data-after="-300"
765
- data-colors="#885555"
766
- data-show-value-of-received-at="netfilter.synproxy_syn_received.netdata2"
767
- ></div>
768
- </div>
769
-
770
- <div class="mysparkline">
771
- <div class="mysparkline-overchart-label">
772
- <b>US - California</b>, TCP SYN packets/s received
773
- </div>
774
- <div class="mysparkline-overchart-value" id="netfilter.synproxy_syn_received.netdata3" >
775
- </div>
776
- <div data-netdata="netfilter.synproxy_syn_received"
777
- data-dimensions="received"
778
- data-host="//sanfrancisco.netdata.rocks"
779
- data-decimal-digits="0"
780
- data-common-max="synproxy-in"
781
- data-chart-library="dygraph"
782
- data-dygraph-theme="sparkline"
783
- data-dygraph-type="area"
784
- data-width="100%"
785
- data-height="100%"
786
- data-after="-300"
787
- data-colors="#555588"
788
- data-show-value-of-received-at="netfilter.synproxy_syn_received.netdata3"
789
- ></div>
790
- </div>
874
+</div>
875
792
- <div class="mysparkline">
793
- <div class="mysparkline-overchart-label">
794
- <b>Canada</b>, TCP SYN packets/s received
795
- </div>
796
- <div class="mysparkline-overchart-value" id="netfilter.synproxy_syn_received.netdata4" >
797
- </div>
798
- <div data-netdata="netfilter.synproxy_syn_received"
799
- data-dimensions="received"
800
- data-host="//toronto.netdata.rocks"
801
- data-decimal-digits="0"
802
- data-common-max="synproxy-in"
803
- data-chart-library="dygraph"
804
- data-dygraph-theme="sparkline"
805
- data-dygraph-type="area"
806
- data-width="100%"
807
- data-height="100%"
808
- data-after="-300"
809
- data-colors="#885588"
810
- data-show-value-of-received-at="netfilter.synproxy_syn_received.netdata4"
876
+<div class=site-section><h2>Who uses netdata?</h2>
877
+ <div class="content">
878
+ <div class="container" style="text-align: center;">
879
+ <div class="container" style="padding-top: 40px; text-align: center; width: 30%; min-width: 230px; display: inline-block;">
880
+ <div class="mysparkline">
881
+ <div class="mysparkline-overchart-label">
882
+ netdata <b>unique users</b>
883
+ </div>
884
+ <div class="mysparkline-overchart-value-center" id="netdata.registry_entries.persons.netdata" >
885
+ </div>
886
+ <div data-netdata="netdata.registry_entries"
887
+ data-dimensions="persons"
888
+ data-host="//london.my-netdata.io"
889
+ data-decimal-digits="0"
890
+ data-chart-library="dygraph"
891
+ data-dygraph-theme="sparkline"
892
+ data-dygraph-type="area"
893
+ data-width="100%"
894
+ data-height="100%"
895
+ data-after="-300"
896
+ data-colors="#558855"
897
+ data-show-value-of-persons-at="netdata.registry_entries.persons.netdata"
898
></div>
812
- </div>
813
- </div>
814
- <div style="width: 100%; text-align: right; font-size: 1vw;">
815
- <i class="fa fa-comment" aria-hidden="true"></i> <i>did you notice the decimal numbers?
816
- <br/>netdata interpolates collected values at second boundaries, with nanosecond detail!</i>
817
- </div>
818
-
819
-
820
- <div class="mytitle">
821
- CPU Utilization of the demo sites
822
- </div>
823
-
824
- <div style="padding-top: 1vw;">
825
- <div class="myfullchart">
826
- <div data-netdata="system.cpu"
827
- data-host="//london.my-netdata.io"
828
- data-chart-library="dygraph"
829
- data-title="EU - London, CPU Usage"
830
- data-width="100%"
831
- data-height="100%"
832
- data-after="-300"
833
- data-dygraph-valuerange="[0, 100]"
834
- ></div>
835
- </div>
836
-
837
- <div class="myfullchart">
838
- <div data-netdata="system.cpu"
839
- data-host="//atlanta.my-netdata.io"
840
- data-chart-library="dygraph"
841
- data-title="US - Atlanta, CPU Usage"
842
- data-width="100%"
843
- data-height="100%"
844
- data-after="-300"
845
- data-dygraph-valuerange="[0, 100]"
846
- ></div>
847
- </div>
848
-
849
- <div class="myfullchart">
850
- <div data-netdata="system.cpu"
851
- data-host="//sanfrancisco.netdata.rocks"
852
- data-chart-library="dygraph"
853
- data-title="US - California, CPU Usage"
854
- data-width="100%"
855
- data-height="100%"
856
- data-after="-300"
857
- data-dygraph-valuerange="[0, 100]"
858
- ></div>
859
- </div>
860
-
861
- <div class="myfullchart">
862
- <div data-netdata="system.cpu"
863
- data-host="//toronto.netdata.rocks"
864
- data-chart-library="dygraph"
865
- data-title="Canada, CPU Usage"
866
- data-width="100%"
867
- data-height="100%"
868
- data-after="-300"
869
- data-dygraph-valuerange="[0, 100]"
870
- ></div>
871
- </div>
872
- </div>
873
- <div style="width: 100%; text-align: right; font-size: 1vw;">
874
- <i class="fa fa-comment" aria-hidden="true"></i> <i>what is using so much CPU?
875
- <br/>The site <a href="//iplists.firehol.org/">iplists.firehol.org</a> is maintained by FireHOL - the CPU is used for comparing security IP Lists.</i>
876
- </div>
877
-
878
- <div class="mytitle">
879
- Netdata performance
880
- </div>
881
- <div class="mycontent">
882
- netdata monitors <b>users</b>, <b>user groups</b>, <b>applications (process trees)</b>
883
- <br/>
884
- <b>containers</b> (<code>lxc</code>, <code>docker</code>, etc.) and SNMP devices.
885
- </div>
886
-
887
- <!-- Nav tabs -->
888
- <ul class="nav nav-tabs" role="tablist" style="padding-top: 1vw;">
889
- <li role="presentation" class="active"><a href="#netdata_cpu" aria-controls="netdata_cpu" role="tab" data-toggle="tab">CPU</a></li>
890
- <li role="presentation"><a href="#netdata_avgtime" aria-controls="netdata_avgtime" role="tab" data-toggle="tab">Average Response Time</a></li>
891
- </ul>
892
-
893
- <!-- Tab panes -->
894
- <div class="tab-content">
895
- <div role="tabpanel" class="tab-pane active" id="netdata_cpu">
896
- <div class="mysparkline">
897
- <div class="mysparkline-overchart-label">
898
- <b>EU - London</b>, CPU % of a single core
899
- </div>
900
- <div class="mysparkline-overchart-value" id="users.cpu.netdata1" >
901
- </div>
902
- <div data-netdata="apps.cpu"
903
- data-dimensions="netdata"
904
- data-common-max="users-cpu"
905
- data-decimal-digits="1"
906
- data-host="//london.my-netdata.io"
907
- data-chart-library="dygraph"
908
- data-dygraph-theme="sparkline"
909
- data-dygraph-type="area"
910
- data-width="100%"
911
- data-height="100%"
912
- data-after="-300"
913
- data-colors="#558855"
914
- data-show-value-of-netdata-at="users.cpu.netdata1"
915
- ></div>
916
- </div>
917
-
918
- <div class="mysparkline">
919
- <div class="mysparkline-overchart-label">
920
- <b>US - Atlanta</b>, CPU % of a single core
899
</div>
922
- <div class="mysparkline-overchart-value" id="users.cpu.netdata2" >
923
- </div>
924
- <div data-netdata="apps.cpu"
925
- data-dimensions="netdata"
926
- data-common-max="users-cpu"
927
- data-decimal-digits="1"
928
- data-host="//atlanta.my-netdata.io"
929
- data-chart-library="dygraph"
930
- data-dygraph-theme="sparkline"
931
- data-dygraph-type="area"
932
- data-width="100%"
933
- data-height="100%"
934
- data-after="-300"
935
- data-colors="#885555"
936
- data-show-value-of-netdata-at="users.cpu.netdata2"
937
- ></div>
900
</div>
939
-
940
- <div class="mysparkline">
941
- <div class="mysparkline-overchart-label">
942
- <b>US - California</b>, CPU % of a single core
943
- </div>
944
- <div class="mysparkline-overchart-value" id="users.cpu.netdata3" >
901
+ <div class="container" style="padding-top: 40px; text-align: center; width: 30%; min-width: 230px; display: inline-block;">
902
+ <div class="mysparkline">
903
+ <div class="mysparkline-overchart-label">
904
+ netdata <b>monitored servers</b>
905
+ </div>
906
+ <div class="mysparkline-overchart-value-center" id="netdata.registry_entries.machines.netdata" >
907
+ </div>
908
+ <div data-netdata="netdata.registry_entries"
909
+ data-dimensions="machines"
910
+ data-host="//london.my-netdata.io"
911
+ data-decimal-digits="0"
912
+ data-chart-library="dygraph"
913
+ data-dygraph-theme="sparkline"
914
+ data-dygraph-type="area"
915
+ data-width="100%"
916
+ data-height="100%"
917
+ data-after="-300"
918
+ data-colors="#558855"
919
+ data-show-value-of-machines-at="netdata.registry_entries.machines.netdata"
920
+ ></div>
921
</div>
946
- <div data-netdata="apps.cpu"
947
- data-dimensions="netdata"
948
- data-common-max="users-cpu"
949
- data-decimal-digits="1"
950
- data-host="//sanfrancisco.netdata.rocks"
951
- data-chart-library="dygraph"
952
- data-dygraph-theme="sparkline"
953
- data-dygraph-type="area"
954
- data-width="100%"
955
- data-height="100%"
956
- data-after="-300"
957
- data-colors="#555588"
958
- data-show-value-of-netdata-at="users.cpu.netdata3"
959
- ></div>
922
</div>
961
-
962
- <div class="mysparkline">
963
- <div class="mysparkline-overchart-label">
964
- <b>Toronto</b>, CPU % of a single core
965
- </div>
966
- <div class="mysparkline-overchart-value" id="users.cpu.netdata4" >
923
+ <div class="container" style="padding-top: 40px; text-align: center; width: 30%; min-width: 230px; display: inline-block;">
924
+ <div class="mysparkline">
925
+ <div class="mysparkline-overchart-label">
926
+ netdata <b>sessions served</b>
927
+ </div>
928
+ <div class="mysparkline-overchart-value-center" id="netdata.registry_sessions.sessions.netdata" >
929
+ </div>
930
+ <div data-netdata="netdata.registry_sessions"
931
+ data-dimensions="sessions"
932
+ data-host="//london.my-netdata.io"
933
+ data-decimal-digits="0"
934
+ data-chart-library="dygraph"
935
+ data-dygraph-theme="sparkline"
936
+ data-dygraph-type="area"
937
+ data-width="100%"
938
+ data-height="100%"
939
+ data-after="-300"
940
+ data-colors="#558855"
941
+ data-show-value-of-sessions-at="netdata.registry_sessions.sessions.netdata"
942
+ ></div>
943
</div>
968
- <div data-netdata="apps.cpu"
969
- data-dimensions="netdata"
970
- data-common-max="users-cpu"
971
- data-decimal-digits="1"
972
- data-host="//toronto.netdata.rocks"
973
- data-chart-library="dygraph"
974
- data-dygraph-theme="sparkline"
975
- data-dygraph-type="area"
976
- data-width="100%"
977
- data-height="100%"
978
- data-after="-300"
979
- data-colors="#885588"
980
- data-show-value-of-netdata-at="users.cpu.netdata4"
981
- ></div>
982
- </div>
983
-
984
- <div style="width: 100%; text-align: right; font-size: 1vw;">
985
- <i class="fa fa-comment" aria-hidden="true"></i> <i>this utilization is about the whole netdata process tree and the percentage is of <b>a single core</b>!
986
- <br/>including <b>BASH</b> plugins (it monitors <code>mysql</code> on the demo sites), <b>node.js</b> plugins (it monitors <code>bind9</code> on the demo sites), etc.
987
- <br/>and including the chart refreshes for the dashboards of all viewers.</i>
944
</div>
945
+ <p>
946
+ <small>figures comes from the <a href="https://github.com/firehol/netdata/wiki/mynetdata-menu-item">netdata public global registry</a></small>
947
+
948
+ <!--
949
+ <embed src="https://registry.my-netdata.io/api/v1/badge.svg?chart=netdata.registry_entries&dimensions=persons&label=user%20base&units=null&value_color=blue&precision=0&refresh=30&v42" type="image/svg+xml" height="20" />
950
+ <embed src="https://registry.my-netdata.io/api/v1/badge.svg?chart=netdata.registry_entries&dimensions=machines&label=servers%20monitored&units=null&value_color=orange&precision=0&refresh=30&v42" type="image/svg+xml" height="20" />
951
+ <embed src="https://registry.my-netdata.io/api/v1/badge.svg?chart=netdata.registry_sessions&label=sessions%20served&units=null&value_color=yellowgreen&precision=0&refresh=30&v42" type="image/svg+xml" height="20" />
952
+ <br/><i>(figures come from <a href="https://github.com/firehol/netdata/wiki/mynetdata-menu-item">the public netdata registry</a> data, showing only installations that use this registry, counting since May 16th 2016)</i>
953
+ <br/>
954
+ -->
955
+ </p>
956
+ <p>
957
+ netdata can also generate auto-refreshing <strong><a href="https://github.com/firehol/netdata/wiki/Generating-Badges">badges</a></strong>, like these:
958
+ <br/>
959
+ <embed style="padding-top: 10px; padding-botton: 25px;" src="http://registry.my-netdata.io/api/v1/badge.svg?chart=netdata.registry_entries&dimensions=persons&after=-86400&options=unaligned&group=incremental-sum&label=new%20users%20today&units=null&value_color=blue&precision=0&refresh=60&v42" type="image/svg+xml" height="20" />
960
+ <embed style="padding-top: 10px; padding-botton: 25px;" src="https://registry.my-netdata.io/api/v1/badge.svg?chart=netdata.registry_entries&dimensions=machines&group=incremental-sum&after=-86400&options=unaligned&label=servers%20added%20today&units=null&value_color=orange&precision=0&refresh=60&v42" type="image/svg+xml" height="20" />
961
+ <embed style="padding-top: 10px; padding-botton: 25px;" src="https://registry.my-netdata.io/api/v1/badge.svg?chart=netdata.registry_sessions&after=-86400&group=incremental-sum&options=unaligned&label=sessions%20served%20today&units=null&value_color=yellowgreen&precision=0&refresh=60&v42" type="image/svg+xml" height="20" />
962
+ <br/>
963
+ <small>they auto-refresh every minute</small>
964
+ </p>
965
</div>
990
-
991
- <div role="tabpanel" class="tab-pane" id="netdata_avgtime">
992
- <div class="mysparkline">
993
- <div class="mysparkline-overchart-label">
994
- <b>EU - London</b>, API average response time in milliseconds
995
- </div>
996
- <div class="mysparkline-overchart-value" id="netdata.response_time1" >
997
- </div>
998
- <div data-netdata="netdata.response_time"
999
- data-host="//london.my-netdata.io"
1000
- data-common-max="netdata-response-time"
1001
- data-decimal-digits="1"
1002
- data-chart-library="dygraph"
1003
- data-dygraph-theme="sparkline"
1004
- data-dygraph-type="area"
1005
- data-width="100%"
1006
- data-height="100%"
1007
- data-after="-300"
1008
- data-colors="#558855 #356835"
1009
- data-show-value-of-average-at="netdata.response_time1"
1010
- ></div>
1011
- </div>
1012
-
1013
- <div class="mysparkline">
1014
- <div class="mysparkline-overchart-label">
1015
- <b>US - Atlanta</b>, API average response time in milliseconds
1016
- </div>
1017
- <div class="mysparkline-overchart-value" id="netdata.response_time2" >
1018
- </div>
1019
- <div data-netdata="netdata.response_time"
1020
- data-host="//atlanta.my-netdata.io"
1021
- data-common-max="netdata-response-time"
1022
- data-decimal-digits="1"
1023
- data-chart-library="dygraph"
1024
- data-dygraph-theme="sparkline"
1025
- data-dygraph-type="area"
1026
- data-width="100%"
1027
- data-height="100%"
1028
- data-after="-300"
1029
- data-colors="#885555 #683535"
1030
- data-show-value-of-average-at="netdata.response_time2"
1031
- ></div>
1032
- </div>
1033
-
1034
- <div class="mysparkline">
1035
- <div class="mysparkline-overchart-label">
1036
- <b>US - California</b>, API average response time in milliseconds
1037
- </div>
1038
- <div class="mysparkline-overchart-value" id="netdata.response_time3" >
1039
- </div>
1040
- <div data-netdata="netdata.response_time"
1041
- data-host="//sanfrancisco.netdata.rocks"
1042
- data-common-max="netdata-response-time"
1043
- data-decimal-digits="1"
1044
- data-chart-library="dygraph"
1045
- data-dygraph-theme="sparkline"
1046
- data-dygraph-type="area"
1047
- data-width="100%"
1048
- data-height="100%"
1049
- data-after="-300"
1050
- data-colors="#555588 #353568"
1051
- data-show-value-of-average-at="netdata.response_time3"
1052
- ></div>
1053
- </div>
1054
-
1055
- <div class="mysparkline">
1056
- <div class="mysparkline-overchart-label">
1057
- <b>Canada</b>, API average response time in milliseconds
1058
- </div>
1059
- <div class="mysparkline-overchart-value" id="netdata.response_time4" >
1060
- </div>
1061
- <div data-netdata="netdata.response_time"
1062
- data-host="//toronto.netdata.rocks"
1063
- data-decimal-digits="1"
1064
- data-common-max="netdata-response-time"
1065
- data-chart-library="dygraph"
1066
- data-dygraph-theme="sparkline"
1067
- data-dygraph-type="area"
1068
- data-width="100%"
1069
- data-height="100%"
1070
- data-after="-300"
1071
- data-colors="#885588 #683568"
1072
- data-show-value-of-average-at="netdata.response_time4"
1073
- ></div>
1074
- </div>
1075
-
1076
- <div style="width: 100%; text-align: right; font-size: 1vw;">
1077
- <i class="fa fa-comment" aria-hidden="true"></i> <i>netdata is really <b>fast</b> (the values are milliseconds!)
1078
- <br/>
1079
- These values include everything, from the reception of the first byte to the dispatch of the last, including gzip compression.
1080
- <br/>
1081
- Values above 2-3ms are usually chart refreshes of charts with several dimensions, charts with very long durations (zoomed out), or file transfers.
1082
- </i>
1083
- </div>
966
+ <div class=cta-option>
967
+ <a class="btn btn-download" href=https://github.com/firehol/netdata/wiki/Installation
968
+ data-ga-category="Outbound links" data-ga-action="Nav click" data-ga-label=Install><strong>Install netdata now</strong></a>
969
</div>
970
</div>
1086
-
1087
- <div style="padding-top: 6vw; width: 100%; text-align: center; font-size: 2vw;">
1088
- want to know more?
1089
- <br/>
1090
- jump to <a href="https://github.com/firehol/netdata/">the netdata page at github</a>
1091
- <br/>
1092
- it needs just 3 mins to be installed on your servers!
1093
- <br/>
1094
-
971
+</div>
972
+<!-- Place this tag in your head or just before your close body tag. -->
973
+<script async defer src="https://buttons.github.io/buttons.js"></script>
974
+<div class=aside>
975
+ <div class=container>
976
+ <ul class=inline-block-list>
977
+ <li>
978
+ <!-- Place this tag where you want the button to render. -->
979
+ <a class="github-button" href="https://github.com/firehol/netdata" data-icon="octicon-eye" data-style="mega" data-count-href="/firehol/netdata/watchers" data-count-api="/repos/firehol/netdata#subscribers_count" data-count-aria-label="# watchers on GitHub" aria-label="Watch firehol/netdata on GitHub">Watch</a>
980
+ </li>
981
+ <li>
982
+ <!-- Place this tag where you want the button to render. -->
983
+ <a class="github-button" href="https://github.com/firehol/netdata" data-icon="octicon-star" data-style="mega" data-count-href="/firehol/netdata/stargazers" data-count-api="/repos/firehol/netdata#stargazers_count" data-count-aria-label="# stargazers on GitHub" aria-label="Star firehol/netdata on GitHub">Star</a>
984
+ </li>
985
+ <li>
986
+ <!-- Place this tag where you want the button to render. -->
987
+ <a class="github-button" href="https://github.com/firehol/netdata/fork" data-icon="octicon-repo-forked" data-style="mega" data-count-href="/firehol/netdata/network" data-count-api="/repos/firehol/netdata#forks_count" data-count-aria-label="# forks on GitHub" aria-label="Fork firehol/netdata on GitHub">Fork</a>
988
+ </li>
989
+ </ul>
990
</div>
991
</div>
1097
-</body>
992
+
993
+<div class=site-footer role=contentinfo>
994
+ <p>
995
+ <a class=twitter-share-button href=https://twitter.com/share data-count=none data-lang=en data-via=linuxnetdata data-size=large
996
+ data-text="netdata: Linux's more powerful performance monitoring" data-url=https://my-netdata.io/ >Tweet</a>
997
+ <a class=twitter-follow-button href=https://twitter.com/linuxnetdata data-show-count=false data-lang=en data-size=large>Follow @linuxnetdata</a>
998
+ <p>
999
+ © 2016 Costa Tsaousis, <costa@tsaousis.gr><br/>
1000
+ netdata is released under GPL v3+<br/>
1001
+</div>
1002
+
1003
<script>
1004
// google analytics when this is used for the home page of the demo sites
1005
// you don't need this if you customize this dashboard for your needs
1006
setTimeout(function() {
1007
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
1103
- (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
1104
- m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
1008
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
1009
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
1010
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
1011
1012
ga('create', 'UA-64295674-3', 'auto');
1013
ga('send', 'pageview');
1014
}, 2000);
1015
</script>
1111
-</html>
web/demosites2.html
new
+1111
@@ -0,0 +1,1111 @@
1
+<!DOCTYPE html>
2
+<html lang="en">
3
+<head>
4
+ <title>NetData - Real-time performance monitoring, done right!</title>
5
+ <meta name="application-name" content="netdata">
6
+
7
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
8
+ <meta charset="utf-8">
9
+ <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
10
+ <meta name="viewport" content="width=device-width, initial-scale=1">
11
+ <meta name="apple-mobile-web-app-capable" content="yes">
12
+ <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
13
+
14
+ <meta property="og:locale" content="en_US" />
15
+ <meta property="og:image" content="https://cloud.githubusercontent.com/assets/2662304/19168687/f6a567be-8c19-11e6-8561-ce8d589e8346.gif"/>
16
+ <meta property="og:url" content="http://my-netdata.io/"/>
17
+ <meta property="og:type" content="website"/>
18
+ <meta property="og:site_name" content="netdata"/>
19
+ <meta property="og:title" content="netdata - real-time performance monitoring, done right!"/>
20
+ <meta property="og:description" content="Stunning real-time dashboards, blazingly fast and extremely interactive. Zero configuration, zero dependencies, zero maintenance." />
21
+</head>
22
+
23
+<script>
24
+ // --- OPTIONS FOR THE DASHBOARD --
25
+
26
+ // this section has to appear before loading dashboard.js
27
+
28
+ // Select a theme.
29
+ // uncomment on of the two themes:
30
+
31
+ // var netdataTheme = 'default'; // this is white
32
+ var netdataTheme = 'slate'; // this is dark
33
+
34
+
35
+ // Set the default netdata server.
36
+ // on charts without a 'data-host', this one will be used.
37
+ // the default is the server that dashboard.js is downloaded from.
38
+
39
+ // var netdataServer = 'http://my.server:19999/';
40
+ </script>
41
+
42
+ <!--
43
+ --- LOAD dashboard.js ---
44
+
45
+ to host this HTML file on your web server,
46
+ you have to load dashboard.js from the netdata server.
47
+
48
+ So, pick one the two below
49
+ If you pick the first, set the server name/IP.
50
+
51
+ The second assumes you host this file on /usr/share/netdata/web
52
+ and that you have chown it to be owned by netdata:netdata
53
+ -->
54
+ <!-- <script type="text/javascript" src="http://my.server:19999/dashboard.js"></script> -->
55
+ <script type="text/javascript" src="dashboard.js?v20161112-1"></script>
56
+
57
+ <script>
58
+ // --- OPTIONS FOR THE CHARTS --
59
+
60
+ // destroy charts not shown (lowers memory on the browsers)
61
+ // set this to 'true' to destroy, 'false' to hide the charts
62
+ NETDATA.options.current.destroy_on_hide = false;
63
+
64
+ // set this to false, to always show all dimensions
65
+ NETDATA.options.current.eliminate_zero_dimensions = true;
66
+
67
+ // set this to false, to lower the pressure on the browser
68
+ NETDATA.options.current.concurrent_refreshes = true;
69
+
70
+ // if you need to support slow mobile phones, set this to false
71
+ NETDATA.options.current.parallel_refresher = true;
72
+
73
+ // set this to false, to always update the charts, even if focus is lost
74
+ NETDATA.options.current.stop_updates_when_focus_is_lost = true;
75
+
76
+ // since we have many servers and limited sockets,
77
+ // abort ajax calls when we scroll
78
+ NETDATA.options.current.abort_ajax_on_scroll = true;
79
+</script>
80
+<style>
81
+ body {
82
+ font-size: 1vw;
83
+ }
84
+
85
+ .mysparkline {
86
+ position: relative;
87
+ display: inline-block;
88
+ min-height: 50px;
89
+ width: 100%;
90
+ height: 7vmax;
91
+ text-align: left;
92
+ }
93
+
94
+ .mysparkline-overchart-label {
95
+ position: absolute;
96
+ display: block;
97
+ top: 0;
98
+ left: 10px;
99
+ bottom: 0;
100
+ right: 0;
101
+ font-size: 1vmax;
102
+ z-index: 1;
103
+ }
104
+
105
+ .mysparkline-overchart-value {
106
+ position: absolute;
107
+ display: block;
108
+ top: 1.1vmax;
109
+ left: 10px;
110
+ bottom: 0;
111
+ right: 0;
112
+ font-size: 5vmax;
113
+ z-index: 2;
114
+ text-shadow: #333 0px 0px 2px;
115
+ }
116
+
117
+ .myfullchart {
118
+ position: relative;
119
+ display: inline-block;
120
+ width: 100%;
121
+ height: 12vmax;
122
+ min-height: 150px;
123
+ text-align: left;
124
+ }
125
+
126
+ .mygauge-combo {
127
+ display: inline-block;
128
+ }
129
+
130
+ .mygauge {
131
+ position: relative;
132
+ display: block;
133
+ width: 18vw;
134
+ height: 11vw;
135
+ }
136
+
137
+ .mygauge-button {
138
+ display: block;
139
+ }
140
+
141
+ .mytitle {
142
+ padding-top: 6vw;
143
+ padding-bottom: 1vw;
144
+ text-align: center;
145
+ font-size: 2.4vw;
146
+ }
147
+
148
+ .mysubtitle {
149
+ padding-top: 2vw;
150
+ padding-bottom: 1vw;
151
+ text-align: center;
152
+ font-size: 1.8vw;
153
+ }
154
+
155
+ .mycontent {
156
+ text-align: center;
157
+ font-size: 1.5vw;
158
+ }
159
+
160
+ @media only screen and (min-width : 992px) {
161
+ .container {
162
+ width: 80%;
163
+ }
164
+ }
165
+ @media only screen and (max-width : 992px) {
166
+ .container {
167
+ width: 100%;
168
+ }
169
+ }
170
+</style>
171
+
172
+<body style="text-align: center; background-color: #272b30;">
173
+
174
+<div class="container">
175
+
176
+ <div style="text-align: center; font-size: 13vw; height: 14vw;">
177
+ <b>netdata</b>
178
+ </div>
179
+ <div style="text-align: center; font-size: 2vw; height: 2.5vw;">
180
+ real-time performance monitoring
181
+ </div>
182
+ <div style="width:80%; text-align: right; font-size: 2.7vw;">
183
+ <strong>scaled out</strong>!
184
+ </div>
185
+ <div class="mytitle">
186
+ pick a <b>netdata</b> demo server
187
+ </div>
188
+ <div class="mycontent">
189
+ these demo servers show what you will get by installing <b>netdata</b>
190
+ </div>
191
+
192
+ <div style="width: 100%; text-align: center; padding-top: 2vw;">
193
+ <div style="width: 100%; text-align: center;">
194
+
195
+ <div class="mygauge-combo">
196
+ <div class="mygauge">
197
+ <div data-netdata="netdata.requests"
198
+ data-host="//london.my-netdata.io"
199
+ data-title="EU - London"
200
+ data-chart-library="gauge"
201
+ data-decimal-digits="0"
202
+ data-common-max="top-gauges"
203
+ data-width="100%"
204
+ data-after="-300"
205
+ data-points="300"
206
+ data-colors="#558855"
207
+ ></div>
208
+ </div>
209
+ <div class="mygauge-button">
210
+ <br/> <br/>
211
+ <button type="button" class="btn btn-default" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//london.my-netdata.io/default.html'" style="font-size: 1.0vw;">Enter London!</button>
212
+ <div style="font-size: 0.8vw;">
213
+ Donated by DigitalOcean.com
214
+ </div>
215
+ </div>
216
+ </div>
217
+ <div class="mygauge-combo">
218
+ <div class="mygauge">
219
+ <div data-netdata="netdata.requests"
220
+ data-host="//atlanta.my-netdata.io"
221
+ data-title="US - Atlanta"
222
+ data-chart-library="gauge"
223
+ data-decimal-digits="0"
224
+ data-common-max="top-gauges"
225
+ data-width="100%"
226
+ data-after="-300"
227
+ data-points="300"
228
+ data-colors="#AA5555"
229
+ ></div>
230
+ </div>
231
+ <div class="mygauge-button">
232
+ <br/> <br/>
233
+ <button type="button" class="btn btn-default" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//atlanta.my-netdata.io/default.html'" style="font-size: 1.0vw;">Enter Atlanta!</button>
234
+ <div style="font-size: 0.8vw;">
235
+ Donated by CDN77.com
236
+ </div>
237
+ </div>
238
+ </div>
239
+ <div class="mygauge-combo">
240
+ <div class="mygauge">
241
+ <div data-netdata="netdata.requests"
242
+ data-host="//sanfrancisco.netdata.rocks"
243
+ data-title="US - California"
244
+ data-chart-library="gauge"
245
+ data-decimal-digits="0"
246
+ data-common-max="top-gauges"
247
+ data-width="100%"
248
+ data-after="-300"
249
+ data-points="300"
250
+ data-colors="#5555AA"
251
+ ></div>
252
+ </div>
253
+ <div class="mygauge-button">
254
+ <br/> <br/>
255
+ <button type="button" class="btn btn-default" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//sanfrancisco.netdata.rocks/default.html'" style="font-size: 1.0vw;">Enter California!</button>
256
+ <div style="font-size: 0.8vw;">
257
+ Donated by DigitalOcean.com
258
+ </div>
259
+ </div>
260
+ </div>
261
+ <div class="mygauge-combo">
262
+ <div class="mygauge">
263
+ <div data-netdata="netdata.requests"
264
+ data-host="//toronto.netdata.rocks"
265
+ data-title="Canada"
266
+ data-chart-library="gauge"
267
+ data-decimal-digits="0"
268
+ data-common-max="top-gauges"
269
+ data-width="100%"
270
+ data-after="-300"
271
+ data-points="300"
272
+ data-colors="#885588"
273
+ ></div>
274
+ </div>
275
+ <div class="mygauge-button">
276
+ <br/> <br/>
277
+ <button type="button" class="btn btn-default" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//toronto.netdata.rocks/default.html'" style="font-size: 1.0vw;">Enter Canada!</button>
278
+ <div style="font-size: 0.8vw;">
279
+ Donated by DigitalOcean.com
280
+ </div>
281
+ </div>
282
+ </div>
283
+ <br/> <br/>
284
+ <div class="mygauge-combo">
285
+ <div class="mygauge">
286
+ <div data-netdata="netdata.requests"
287
+ data-host="//frankfurt.netdata.rocks"
288
+ data-title="EU - Germany"
289
+ data-chart-library="easypiechart"
290
+ data-decimal-digits="0"
291
+ data-common-max="top-gauges"
292
+ data-width="75%"
293
+ data-after="-300"
294
+ data-points="300"
295
+ data-colors="#AAAA55"
296
+ ></div>
297
+ </div>
298
+ <div class="mygauge-button">
299
+ <br/> <br/>
300
+ <button type="button" class="btn btn-default" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//frankfurt.netdata.rocks/default.html'" style="font-size: 1.0vw;">Enter Germany!</button>
301
+ <div style="font-size: 0.8vw;">
302
+ Donated by DigitalOcean.com
303
+ </div>
304
+ </div>
305
+ </div>
306
+ <div class="mygauge-combo">
307
+ <div class="mygauge">
308
+ <div data-netdata="netdata.requests"
309
+ data-host="//newyork.netdata.rocks"
310
+ data-title="US - New York"
311
+ data-chart-library="easypiechart"
312
+ data-decimal-digits="0"
313
+ data-common-max="top-gauges"
314
+ data-width="75%"
315
+ data-after="-300"
316
+ data-points="300"
317
+ data-colors="#BB5533"
318
+ ></div>
319
+ </div>
320
+ <div class="mygauge-button">
321
+ <br/> <br/>
322
+ <button type="button" class="btn btn-default" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//newyork.netdata.rocks/default.html'" style="font-size: 1.0vw;">Enter New York!</button>
323
+ <div style="font-size: 0.8vw;">
324
+ Donated by DigitalOcean.com
325
+ </div>
326
+ </div>
327
+ </div>
328
+ <div class="mygauge-combo">
329
+ <div class="mygauge">
330
+ <div data-netdata="netdata.requests"
331
+ data-host="//singapore.netdata.rocks"
332
+ data-title="Singapore"
333
+ data-chart-library="easypiechart"
334
+ data-decimal-digits="0"
335
+ data-common-max="top-gauges"
336
+ data-width="75%"
337
+ data-after="-300"
338
+ data-points="300"
339
+ data-colors="#5588BB"
340
+ ></div>
341
+ </div>
342
+ <div class="mygauge-button">
343
+ <br/> <br/>
344
+ <button type="button" class="btn btn-default" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//singapore.netdata.rocks/default.html'" style="font-size: 1.0vw;">Enter Singapore!</button>
345
+ <div style="font-size: 0.8vw;">
346
+ Donated by DigitalOcean.com
347
+ </div>
348
+ </div>
349
+ </div>
350
+ <div class="mygauge-combo">
351
+ <div class="mygauge">
352
+ <div data-netdata="netdata.requests"
353
+ data-host="//bangalore.netdata.rocks"
354
+ data-title="India"
355
+ data-chart-library="easypiechart"
356
+ data-decimal-digits="0"
357
+ data-common-max="top-gauges"
358
+ data-width="75%"
359
+ data-after="-300"
360
+ data-points="300"
361
+ data-colors="#BB55BB"
362
+ ></div>
363
+ </div>
364
+ <div class="mygauge-button">
365
+ <br/> <br/>
366
+ <button type="button" class="btn btn-default" data-toggle="button" aria-pressed="false" autocomplete="off" onclick="window.location='//bangalore.netdata.rocks/default.html'" style="font-size: 1.0vw;">Enter India!</button>
367
+ <div style="font-size: 0.8vw;">
368
+ Donated by DigitalOcean.com
369
+ </div>
370
+ </div>
371
+ </div>
372
+ </div>
373
+ </div>
374
+
375
+ <div class="mytitle">
376
+ this page is a custom <b>netdata</b> dashboard
377
+ </div>
378
+ <div class="mycontent">
379
+ charts are coming from 8 servers, in parallel
380
+ <br/>
381
+ the servers are not aware of this multi-server dashboard,
382
+ <br/>
383
+ each server is not aware of the other servers,
384
+ <br/>
385
+ but on this dashboard <b>they are one</b>!
386
+ </div>
387
+ <div style="padding-top: 1vw; width: 100%; text-align: center; font-size: 1.5vw;">
388
+ <i class="fa fa-comment" aria-hidden="true"></i>
389
+ hover on a chart below, or drag it to show the past - <b>the others will follow</b>!
390
+ <br/>
391
+ double click on a chart to reset them all
392
+ </div>
393
+
394
+ <div class="mytitle">
395
+ our <code>nginx</code> performance
396
+ </div>
397
+ <div class="mycontent">
398
+ (we proxy netdata through nginx, on the demo sites)
399
+ </div>
400
+
401
+ <!-- Nav tabs -->
402
+ <ul class="nav nav-tabs" role="tablist" style="padding-top: 1vw;">
403
+ <li role="presentation" class="active"><a href="#nginx_requests" aria-controls="nginx_requests" role="tab" data-toggle="tab">Requests</a></li>
404
+ <li role="presentation"><a href="#nginx_connections" aria-controls="nginx_connections" role="tab" data-toggle="tab">Connections</a></li>
405
+ </ul>
406
+
407
+ <!-- Tab panes -->
408
+ <div class="tab-content">
409
+ <div role="tabpanel" class="tab-pane active" id="nginx_requests">
410
+ <div class="mysparkline">
411
+ <div class="mysparkline-overchart-label">
412
+ <b>EU - London</b> web requests/s
413
+ </div>
414
+ <div class="mysparkline-overchart-value" id="nginx_local.requests.netdata" >
415
+ </div>
416
+ <div data-netdata="nginx_local.requests"
417
+ data-dimensions="requests"
418
+ data-host="//london.my-netdata.io"
419
+ data-decimal-digits="0"
420
+ data-common-max="web-requests"
421
+ data-chart-library="dygraph"
422
+ data-dygraph-theme="sparkline"
423
+ data-dygraph-type="area"
424
+ data-width="100%"
425
+ data-height="100%"
426
+ data-after="-300"
427
+ data-colors="#558855"
428
+ data-show-value-of-requests-at="nginx_local.requests.netdata"
429
+ ></div>
430
+ </div>
431
+
432
+ <div class="mysparkline">
433
+ <div class="mysparkline-overchart-label">
434
+ <b>US - Atlanta</b> web requests/s
435
+ </div>
436
+ <div class="mysparkline-overchart-value" id="nginx_local.requests.netdata2" >
437
+ </div>
438
+ <div data-netdata="nginx_local.requests"
439
+ data-dimensions="requests"
440
+ data-host="//atlanta.my-netdata.io"
441
+ data-decimal-digits="0"
442
+ data-common-max="web-requests"
443
+ data-chart-library="dygraph"
444
+ data-dygraph-theme="sparkline"
445
+ data-dygraph-type="area"
446
+ data-width="100%"
447
+ data-height="100%"
448
+ data-after="-300"
449
+ data-colors="#AA5555"
450
+ data-show-value-of-requests-at="nginx_local.requests.netdata2"
451
+ ></div>
452
+ </div>
453
+
454
+ <div class="mysparkline">
455
+ <div class="mysparkline-overchart-label">
456
+ <b>US - California</b> web requests/s
457
+ </div>
458
+ <div class="mysparkline-overchart-value" id="nginx_local.requests.netdata3" >
459
+ </div>
460
+ <div data-netdata="nginx_local.requests"
461
+ data-dimensions="requests"
462
+ data-host="//sanfrancisco.netdata.rocks"
463
+ data-decimal-digits="0"
464
+ data-common-max="web-requests"
465
+ data-chart-library="dygraph"
466
+ data-dygraph-theme="sparkline"
467
+ data-dygraph-type="area"
468
+ data-width="100%"
469
+ data-height="100%"
470
+ data-after="-300"
471
+ data-colors="#5555AA"
472
+ data-show-value-of-requests-at="nginx_local.requests.netdata3"
473
+ ></div>
474
+ </div>
475
+
476
+ <div class="mysparkline">
477
+ <div class="mysparkline-overchart-label">
478
+ <b>Canada</b> web requests/s
479
+ </div>
480
+ <div class="mysparkline-overchart-value" id="nginx_local.requests.netdata4" >
481
+ </div>
482
+ <div data-netdata="nginx_local.requests"
483
+ data-dimensions="requests"
484
+ data-host="//toronto.netdata.rocks"
485
+ data-decimal-digits="0"
486
+ data-common-max="web-requests"
487
+ data-chart-library="dygraph"
488
+ data-dygraph-theme="sparkline"
489
+ data-dygraph-type="area"
490
+ data-width="100%"
491
+ data-height="100%"
492
+ data-after="-300"
493
+ data-colors="#885588"
494
+ data-show-value-of-requests-at="nginx_local.requests.netdata4"
495
+ ></div>
496
+ </div>
497
+ </div>
498
+
499
+ <div role="tabpanel" class="tab-pane" id="nginx_connections">
500
+ <div class="mysparkline">
501
+ <div class="mysparkline-overchart-label">
502
+ <b>EU - London</b> active connections
503
+ </div>
504
+ <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata1" >
505
+ </div>
506
+ <div data-netdata="nginx_local.connections"
507
+ data-dimensions="active"
508
+ data-host="//london.my-netdata.io"
509
+ data-decimal-digits="0"
510
+ data-common-max="web-connections"
511
+ data-chart-library="dygraph"
512
+ data-dygraph-theme="sparkline"
513
+ data-dygraph-type="area"
514
+ data-width="100%"
515
+ data-height="100%"
516
+ data-after="-300"
517
+ data-colors="#558855"
518
+ data-show-value-of-active-at="nginx_local.connections.netdata1"
519
+ ></div>
520
+ </div>
521
+
522
+ <div class="mysparkline">
523
+ <div class="mysparkline-overchart-label">
524
+ <b>US - Atlanta</b> active connections
525
+ </div>
526
+ <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata2" >
527
+ </div>
528
+ <div data-netdata="nginx_local.connections"
529
+ data-dimensions="active"
530
+ data-host="//atlanta.my-netdata.io"
531
+ data-decimal-digits="0"
532
+ data-common-max="web-connections"
533
+ data-chart-library="dygraph"
534
+ data-dygraph-theme="sparkline"
535
+ data-dygraph-type="area"
536
+ data-width="100%"
537
+ data-height="100%"
538
+ data-after="-300"
539
+ data-colors="#AA5555"
540
+ data-show-value-of-active-at="nginx_local.connections.netdata2"
541
+ ></div>
542
+ </div>
543
+
544
+ <div class="mysparkline">
545
+ <div class="mysparkline-overchart-label">
546
+ <b>US - California</b> active connections
547
+ </div>
548
+ <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata3" >
549
+ </div>
550
+ <div data-netdata="nginx_local.connections"
551
+ data-dimensions="active"
552
+ data-host="//sanfrancisco.netdata.rocks"
553
+ data-decimal-digits="0"
554
+ data-common-max="web-connections"
555
+ data-chart-library="dygraph"
556
+ data-dygraph-theme="sparkline"
557
+ data-dygraph-type="area"
558
+ data-width="100%"
559
+ data-height="100%"
560
+ data-after="-300"
561
+ data-colors="#5555AA"
562
+ data-show-value-of-active-at="nginx_local.connections.netdata3"
563
+ ></div>
564
+ </div>
565
+
566
+ <div class="mysparkline">
567
+ <div class="mysparkline-overchart-label">
568
+ <b>Canada</b> active connections
569
+ </div>
570
+ <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata4" >
571
+ </div>
572
+ <div data-netdata="nginx_local.connections"
573
+ data-dimensions="active"
574
+ data-host="//toronto.netdata.rocks"
575
+ data-decimal-digits="0"
576
+ data-common-max="web-connections"
577
+ data-chart-library="dygraph"
578
+ data-dygraph-theme="sparkline"
579
+ data-dygraph-type="area"
580
+ data-width="100%"
581
+ data-height="100%"
582
+ data-after="-300"
583
+ data-colors="#885588"
584
+ data-show-value-of-active-at="nginx_local.connections.netdata4"
585
+ ></div>
586
+ </div>
587
+ </div>
588
+ </div>
589
+
590
+ <div style="width: 100%; text-align: right; font-size: 1vw;">
591
+ <i class="fa fa-comment" aria-hidden="true"></i> these charts are draggable and touchable, double click them to reset them
592
+ </div>
593
+
594
+
595
+ <div class="mytitle">
596
+ bandwidth consumption on the demo sites
597
+ </div>
598
+ <div class="mycontent">
599
+ Linux QoS is configured by <a href="https://github.com/firehol/netdata/wiki/You-should-install-QoS-on-all-your-servers">FireQOS</a>
600
+ </div>
601
+
602
+ <!-- Nav tabs -->
603
+ <ul class="nav nav-tabs" role="tablist" style="padding-top: 1vw;">
604
+ <li role="presentation" class="active"><a href="#outbout" aria-controls="outbout" role="tab" data-toggle="tab">Outbound</a></li>
605
+ <li role="presentation"><a href="#inbound" aria-controls="inbound" role="tab" data-toggle="tab">Inbound</a></li>
606
+ </ul>
607
+
608
+ <!-- Tab panes -->
609
+ <div class="tab-content">
610
+ <div role="tabpanel" class="tab-pane active" id="outbout">
611
+ <div class="myfullchart">
612
+ <div data-netdata="tc.world_out"
613
+ data-host="//london.my-netdata.io"
614
+ data-common-max="tc-world-out"
615
+ data-chart-library="dygraph"
616
+ data-title="EU - London, traffic we send per service"
617
+ data-width="100%"
618
+ data-height="100%"
619
+ data-after="-300"
620
+ ></div>
621
+ </div>
622
+
623
+ <div class="myfullchart">
624
+ <div data-netdata="tc.world_out"
625
+ data-host="//atlanta.my-netdata.io"
626
+ data-chart-library="dygraph"
627
+ data-common-max="tc-world-out"
628
+ data-title="US - Atlanta, traffic we send per service"
629
+ data-width="100%"
630
+ data-height="100%"
631
+ data-after="-300"
632
+ ></div>
633
+
634
+ </div>
635
+
636
+ <div class="myfullchart">
637
+ <div data-netdata="tc.world_out"
638
+ data-host="//sanfrancisco.netdata.rocks"
639
+ data-chart-library="dygraph"
640
+ data-common-max="tc-world-out"
641
+ data-title="US - California, traffic we send per service"
642
+ data-width="100%"
643
+ data-height="100%"
644
+ data-after="-300"
645
+ ></div>
646
+ </div>
647
+
648
+ <div class="myfullchart">
649
+ <div data-netdata="tc.world_out"
650
+ data-host="//toronto.netdata.rocks"
651
+ data-chart-library="dygraph"
652
+ data-common-max="tc-world-out"
653
+ data-title="Canada, traffic we send per service"
654
+ data-width="100%"
655
+ data-height="100%"
656
+ data-after="-300"
657
+ ></div>
658
+ </div>
659
+ </div>
660
+
661
+ <div role="tabpanel" class="tab-pane" id="inbound">
662
+ <div class="myfullchart">
663
+ <div data-netdata="tc.world_in"
664
+ data-host="//london.my-netdata.io"
665
+ data-common-max="tc-world-in"
666
+ data-chart-library="dygraph"
667
+ data-title="EU - London, traffic we receive per service"
668
+ data-width="100%"
669
+ data-height="100%"
670
+ data-after="-300"
671
+ ></div>
672
+
673
+ </div>
674
+
675
+ <div class="myfullchart">
676
+ <div data-netdata="tc.world_in"
677
+ data-host="//atlanta.my-netdata.io"
678
+ data-common-max="tc-world-in"
679
+ data-chart-library="dygraph"
680
+ data-title="US - Atlanta, traffic we receive per service"
681
+ data-width="100%"
682
+ data-height="100%"
683
+ data-after="-300"
684
+ ></div>
685
+
686
+ </div>
687
+
688
+ <div class="myfullchart">
689
+ <div data-netdata="tc.world_in"
690
+ data-host="//sanfrancisco.netdata.rocks"
691
+ data-common-max="tc-world-in"
692
+ data-chart-library="dygraph"
693
+ data-title="US - California, traffic we receive per service"
694
+ data-width="100%"
695
+ data-height="100%"
696
+ data-after="-300"
697
+ ></div>
698
+ </div>
699
+
700
+ <div class="myfullchart">
701
+ <div data-netdata="tc.world_in"
702
+ data-host="//toronto.netdata.rocks"
703
+ data-common-max="tc-world-in"
704
+ data-chart-library="dygraph"
705
+ data-title="Canada, traffic we receive per service"
706
+ data-width="100%"
707
+ data-height="100%"
708
+ data-after="-300"
709
+ ></div>
710
+ </div>
711
+ </div>
712
+ </div>
713
+ <div style="width: 100%; text-align: right; font-size: 1vw;">
714
+ <i class="fa fa-comment" aria-hidden="true"></i> <i>these legends are interactive and the charts are resizable here ^^^</i>
715
+ </div>
716
+
717
+ <div class="mytitle">
718
+ DDoS protection performance on the demo sites
719
+ </div>
720
+ <div class="mycontent">
721
+ iptables SYNPROXY configured by <a href="https://github.com/firehol/netdata/wiki/Monitoring-SYNPROXY">FireHOL</a>
722
+ </div>
723
+
724
+ <div style="padding-top: 4vw; width: 100%; text-align: center; font-size: 1.5vw;">
725
+
726
+ <div class="mysparkline">
727
+ <div class="mysparkline-overchart-label">
728
+ <b>EU - London</b>, TCP SYN packets/s received
729
+ </div>
730
+ <div class="mysparkline-overchart-value" id="netfilter.synproxy_syn_received.netdata1" >
731
+ </div>
732
+ <div data-netdata="netfilter.synproxy_syn_received"
733
+ data-dimensions="received"
734
+ data-host="//london.my-netdata.io"
735
+ data-decimal-digits="0"
736
+ data-common-max="synproxy-in"
737
+ data-chart-library="dygraph"
738
+ data-dygraph-theme="sparkline"
739
+ data-dygraph-type="area"
740
+ data-width="100%"
741
+ data-height="100%"
742
+ data-after="-300"
743
+ data-colors="#558855"
744
+ data-show-value-of-received-at="netfilter.synproxy_syn_received.netdata1"
745
+ ></div>
746
+ </div>
747
+
748
+ <div class="mysparkline">
749
+ <div class="mysparkline-overchart-label">
750
+ <b>US - Atlanta</b>, TCP SYN packets/s received
751
+ </div>
752
+ <div class="mysparkline-overchart-value" id="netfilter.synproxy_syn_received.netdata2" >
753
+ </div>
754
+ <div data-netdata="netfilter.synproxy_syn_received"
755
+ data-dimensions="received"
756
+ data-host="//atlanta.my-netdata.io"
757
+ data-decimal-digits="0"
758
+ data-common-max="synproxy-in"
759
+ data-chart-library="dygraph"
760
+ data-dygraph-theme="sparkline"
761
+ data-dygraph-type="area"
762
+ data-width="100%"
763
+ data-height="100%"
764
+ data-after="-300"
765
+ data-colors="#885555"
766
+ data-show-value-of-received-at="netfilter.synproxy_syn_received.netdata2"
767
+ ></div>
768
+ </div>
769
+
770
+ <div class="mysparkline">
771
+ <div class="mysparkline-overchart-label">
772
+ <b>US - California</b>, TCP SYN packets/s received
773
+ </div>
774
+ <div class="mysparkline-overchart-value" id="netfilter.synproxy_syn_received.netdata3" >
775
+ </div>
776
+ <div data-netdata="netfilter.synproxy_syn_received"
777
+ data-dimensions="received"
778
+ data-host="//sanfrancisco.netdata.rocks"
779
+ data-decimal-digits="0"
780
+ data-common-max="synproxy-in"
781
+ data-chart-library="dygraph"
782
+ data-dygraph-theme="sparkline"
783
+ data-dygraph-type="area"
784
+ data-width="100%"
785
+ data-height="100%"
786
+ data-after="-300"
787
+ data-colors="#555588"
788
+ data-show-value-of-received-at="netfilter.synproxy_syn_received.netdata3"
789
+ ></div>
790
+ </div>
791
+
792
+ <div class="mysparkline">
793
+ <div class="mysparkline-overchart-label">
794
+ <b>Canada</b>, TCP SYN packets/s received
795
+ </div>
796
+ <div class="mysparkline-overchart-value" id="netfilter.synproxy_syn_received.netdata4" >
797
+ </div>
798
+ <div data-netdata="netfilter.synproxy_syn_received"
799
+ data-dimensions="received"
800
+ data-host="//toronto.netdata.rocks"
801
+ data-decimal-digits="0"
802
+ data-common-max="synproxy-in"
803
+ data-chart-library="dygraph"
804
+ data-dygraph-theme="sparkline"
805
+ data-dygraph-type="area"
806
+ data-width="100%"
807
+ data-height="100%"
808
+ data-after="-300"
809
+ data-colors="#885588"
810
+ data-show-value-of-received-at="netfilter.synproxy_syn_received.netdata4"
811
+ ></div>
812
+ </div>
813
+ </div>
814
+ <div style="width: 100%; text-align: right; font-size: 1vw;">
815
+ <i class="fa fa-comment" aria-hidden="true"></i> <i>did you notice the decimal numbers?
816
+ <br/>netdata interpolates collected values at second boundaries, with nanosecond detail!</i>
817
+ </div>
818
+
819
+
820
+ <div class="mytitle">
821
+ CPU Utilization of the demo sites
822
+ </div>
823
+
824
+ <div style="padding-top: 1vw;">
825
+ <div class="myfullchart">
826
+ <div data-netdata="system.cpu"
827
+ data-host="//london.my-netdata.io"
828
+ data-chart-library="dygraph"
829
+ data-title="EU - London, CPU Usage"
830
+ data-width="100%"
831
+ data-height="100%"
832
+ data-after="-300"
833
+ data-dygraph-valuerange="[0, 100]"
834
+ ></div>
835
+ </div>
836
+
837
+ <div class="myfullchart">
838
+ <div data-netdata="system.cpu"
839
+ data-host="//atlanta.my-netdata.io"
840
+ data-chart-library="dygraph"
841
+ data-title="US - Atlanta, CPU Usage"
842
+ data-width="100%"
843
+ data-height="100%"
844
+ data-after="-300"
845
+ data-dygraph-valuerange="[0, 100]"
846
+ ></div>
847
+ </div>
848
+
849
+ <div class="myfullchart">
850
+ <div data-netdata="system.cpu"
851
+ data-host="//sanfrancisco.netdata.rocks"
852
+ data-chart-library="dygraph"
853
+ data-title="US - California, CPU Usage"
854
+ data-width="100%"
855
+ data-height="100%"
856
+ data-after="-300"
857
+ data-dygraph-valuerange="[0, 100]"
858
+ ></div>
859
+ </div>
860
+
861
+ <div class="myfullchart">
862
+ <div data-netdata="system.cpu"
863
+ data-host="//toronto.netdata.rocks"
864
+ data-chart-library="dygraph"
865
+ data-title="Canada, CPU Usage"
866
+ data-width="100%"
867
+ data-height="100%"
868
+ data-after="-300"
869
+ data-dygraph-valuerange="[0, 100]"
870
+ ></div>
871
+ </div>
872
+ </div>
873
+ <div style="width: 100%; text-align: right; font-size: 1vw;">
874
+ <i class="fa fa-comment" aria-hidden="true"></i> <i>what is using so much CPU?
875
+ <br/>The site <a href="//iplists.firehol.org/">iplists.firehol.org</a> is maintained by FireHOL - the CPU is used for comparing security IP Lists.</i>
876
+ </div>
877
+
878
+ <div class="mytitle">
879
+ Netdata performance
880
+ </div>
881
+ <div class="mycontent">
882
+ netdata monitors <b>users</b>, <b>user groups</b>, <b>applications (process trees)</b>
883
+ <br/>
884
+ <b>containers</b> (<code>lxc</code>, <code>docker</code>, etc.) and SNMP devices.
885
+ </div>
886
+
887
+ <!-- Nav tabs -->
888
+ <ul class="nav nav-tabs" role="tablist" style="padding-top: 1vw;">
889
+ <li role="presentation" class="active"><a href="#netdata_cpu" aria-controls="netdata_cpu" role="tab" data-toggle="tab">CPU</a></li>
890
+ <li role="presentation"><a href="#netdata_avgtime" aria-controls="netdata_avgtime" role="tab" data-toggle="tab">Average Response Time</a></li>
891
+ </ul>
892
+
893
+ <!-- Tab panes -->
894
+ <div class="tab-content">
895
+ <div role="tabpanel" class="tab-pane active" id="netdata_cpu">
896
+ <div class="mysparkline">
897
+ <div class="mysparkline-overchart-label">
898
+ <b>EU - London</b>, CPU % of a single core
899
+ </div>
900
+ <div class="mysparkline-overchart-value" id="users.cpu.netdata1" >
901
+ </div>
902
+ <div data-netdata="apps.cpu"
903
+ data-dimensions="netdata"
904
+ data-common-max="users-cpu"
905
+ data-decimal-digits="1"
906
+ data-host="//london.my-netdata.io"
907
+ data-chart-library="dygraph"
908
+ data-dygraph-theme="sparkline"
909
+ data-dygraph-type="area"
910
+ data-width="100%"
911
+ data-height="100%"
912
+ data-after="-300"
913
+ data-colors="#558855"
914
+ data-show-value-of-netdata-at="users.cpu.netdata1"
915
+ ></div>
916
+ </div>
917
+
918
+ <div class="mysparkline">
919
+ <div class="mysparkline-overchart-label">
920
+ <b>US - Atlanta</b>, CPU % of a single core
921
+ </div>
922
+ <div class="mysparkline-overchart-value" id="users.cpu.netdata2" >
923
+ </div>
924
+ <div data-netdata="apps.cpu"
925
+ data-dimensions="netdata"
926
+ data-common-max="users-cpu"
927
+ data-decimal-digits="1"
928
+ data-host="//atlanta.my-netdata.io"
929
+ data-chart-library="dygraph"
930
+ data-dygraph-theme="sparkline"
931
+ data-dygraph-type="area"
932
+ data-width="100%"
933
+ data-height="100%"
934
+ data-after="-300"
935
+ data-colors="#885555"
936
+ data-show-value-of-netdata-at="users.cpu.netdata2"
937
+ ></div>
938
+ </div>
939
+
940
+ <div class="mysparkline">
941
+ <div class="mysparkline-overchart-label">
942
+ <b>US - California</b>, CPU % of a single core
943
+ </div>
944
+ <div class="mysparkline-overchart-value" id="users.cpu.netdata3" >
945
+ </div>
946
+ <div data-netdata="apps.cpu"
947
+ data-dimensions="netdata"
948
+ data-common-max="users-cpu"
949
+ data-decimal-digits="1"
950
+ data-host="//sanfrancisco.netdata.rocks"
951
+ data-chart-library="dygraph"
952
+ data-dygraph-theme="sparkline"
953
+ data-dygraph-type="area"
954
+ data-width="100%"
955
+ data-height="100%"
956
+ data-after="-300"
957
+ data-colors="#555588"
958
+ data-show-value-of-netdata-at="users.cpu.netdata3"
959
+ ></div>
960
+ </div>
961
+
962
+ <div class="mysparkline">
963
+ <div class="mysparkline-overchart-label">
964
+ <b>Toronto</b>, CPU % of a single core
965
+ </div>
966
+ <div class="mysparkline-overchart-value" id="users.cpu.netdata4" >
967
+ </div>
968
+ <div data-netdata="apps.cpu"
969
+ data-dimensions="netdata"
970
+ data-common-max="users-cpu"
971
+ data-decimal-digits="1"
972
+ data-host="//toronto.netdata.rocks"
973
+ data-chart-library="dygraph"
974
+ data-dygraph-theme="sparkline"
975
+ data-dygraph-type="area"
976
+ data-width="100%"
977
+ data-height="100%"
978
+ data-after="-300"
979
+ data-colors="#885588"
980
+ data-show-value-of-netdata-at="users.cpu.netdata4"
981
+ ></div>
982
+ </div>
983
+
984
+ <div style="width: 100%; text-align: right; font-size: 1vw;">
985
+ <i class="fa fa-comment" aria-hidden="true"></i> <i>this utilization is about the whole netdata process tree and the percentage is of <b>a single core</b>!
986
+ <br/>including <b>BASH</b> plugins (it monitors <code>mysql</code> on the demo sites), <b>node.js</b> plugins (it monitors <code>bind9</code> on the demo sites), etc.
987
+ <br/>and including the chart refreshes for the dashboards of all viewers.</i>
988
+ </div>
989
+ </div>
990
+
991
+ <div role="tabpanel" class="tab-pane" id="netdata_avgtime">
992
+ <div class="mysparkline">
993
+ <div class="mysparkline-overchart-label">
994
+ <b>EU - London</b>, API average response time in milliseconds
995
+ </div>
996
+ <div class="mysparkline-overchart-value" id="netdata.response_time1" >
997
+ </div>
998
+ <div data-netdata="netdata.response_time"
999
+ data-host="//london.my-netdata.io"
1000
+ data-common-max="netdata-response-time"
1001
+ data-decimal-digits="1"
1002
+ data-chart-library="dygraph"
1003
+ data-dygraph-theme="sparkline"
1004
+ data-dygraph-type="area"
1005
+ data-width="100%"
1006
+ data-height="100%"
1007
+ data-after="-300"
1008
+ data-colors="#558855 #356835"
1009
+ data-show-value-of-average-at="netdata.response_time1"
1010
+ ></div>
1011
+ </div>
1012
+
1013
+ <div class="mysparkline">
1014
+ <div class="mysparkline-overchart-label">
1015
+ <b>US - Atlanta</b>, API average response time in milliseconds
1016
+ </div>
1017
+ <div class="mysparkline-overchart-value" id="netdata.response_time2" >
1018
+ </div>
1019
+ <div data-netdata="netdata.response_time"
1020
+ data-host="//atlanta.my-netdata.io"
1021
+ data-common-max="netdata-response-time"
1022
+ data-decimal-digits="1"
1023
+ data-chart-library="dygraph"
1024
+ data-dygraph-theme="sparkline"
1025
+ data-dygraph-type="area"
1026
+ data-width="100%"
1027
+ data-height="100%"
1028
+ data-after="-300"
1029
+ data-colors="#885555 #683535"
1030
+ data-show-value-of-average-at="netdata.response_time2"
1031
+ ></div>
1032
+ </div>
1033
+
1034
+ <div class="mysparkline">
1035
+ <div class="mysparkline-overchart-label">
1036
+ <b>US - California</b>, API average response time in milliseconds
1037
+ </div>
1038
+ <div class="mysparkline-overchart-value" id="netdata.response_time3" >
1039
+ </div>
1040
+ <div data-netdata="netdata.response_time"
1041
+ data-host="//sanfrancisco.netdata.rocks"
1042
+ data-common-max="netdata-response-time"
1043
+ data-decimal-digits="1"
1044
+ data-chart-library="dygraph"
1045
+ data-dygraph-theme="sparkline"
1046
+ data-dygraph-type="area"
1047
+ data-width="100%"
1048
+ data-height="100%"
1049
+ data-after="-300"
1050
+ data-colors="#555588 #353568"
1051
+ data-show-value-of-average-at="netdata.response_time3"
1052
+ ></div>
1053
+ </div>
1054
+
1055
+ <div class="mysparkline">
1056
+ <div class="mysparkline-overchart-label">
1057
+ <b>Canada</b>, API average response time in milliseconds
1058
+ </div>
1059
+ <div class="mysparkline-overchart-value" id="netdata.response_time4" >
1060
+ </div>
1061
+ <div data-netdata="netdata.response_time"
1062
+ data-host="//toronto.netdata.rocks"
1063
+ data-decimal-digits="1"
1064
+ data-common-max="netdata-response-time"
1065
+ data-chart-library="dygraph"
1066
+ data-dygraph-theme="sparkline"
1067
+ data-dygraph-type="area"
1068
+ data-width="100%"
1069
+ data-height="100%"
1070
+ data-after="-300"
1071
+ data-colors="#885588 #683568"
1072
+ data-show-value-of-average-at="netdata.response_time4"
1073
+ ></div>
1074
+ </div>
1075
+
1076
+ <div style="width: 100%; text-align: right; font-size: 1vw;">
1077
+ <i class="fa fa-comment" aria-hidden="true"></i> <i>netdata is really <b>fast</b> (the values are milliseconds!)
1078
+ <br/>
1079
+ These values include everything, from the reception of the first byte to the dispatch of the last, including gzip compression.
1080
+ <br/>
1081
+ Values above 2-3ms are usually chart refreshes of charts with several dimensions, charts with very long durations (zoomed out), or file transfers.
1082
+ </i>
1083
+ </div>
1084
+ </div>
1085
+ </div>
1086
+
1087
+ <div style="padding-top: 6vw; width: 100%; text-align: center; font-size: 2vw;">
1088
+ want to know more?
1089
+ <br/>
1090
+ jump to <a href="https://github.com/firehol/netdata/">the netdata page at github</a>
1091
+ <br/>
1092
+ it needs just 3 mins to be installed on your servers!
1093
+ <br/>
1094
+
1095
+ </div>
1096
+</div>
1097
+</body>
1098
+<script>
1099
+ // google analytics when this is used for the home page of the demo sites
1100
+ // you don't need this if you customize this dashboard for your needs
1101
+ setTimeout(function() {
1102
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
1103
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
1104
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
1105
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
1106
+
1107
+ ga('create', 'UA-64295674-3', 'auto');
1108
+ ga('send', 'pageview');
1109
+ }, 2000);
1110
+</script>
1111
+</html>