@cryptotaxi247 / netdata-1 / commits / cc8937ae0

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&#8217;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>&#x2605;</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>&#x2605;</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>&#x2605;</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>&#x2605;</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>&#x2605;</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>&#x2605;</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>&#x2605;</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>&#x2605;</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/>&nbsp;<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/>&nbsp;<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/>&nbsp;<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/>&nbsp;<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/>&nbsp;<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/>&nbsp;<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/>&nbsp;<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/>&nbsp;<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 - &nbsp;
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> &nbsp;
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 + &copy; 2016 Costa Tsaousis, &lt;costa@tsaousis.gr&gt;<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/>&nbsp;<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/>&nbsp;<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/>&nbsp;<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/>&nbsp;<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/>&nbsp;<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/>&nbsp;<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/>&nbsp;<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/>&nbsp;<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/>&nbsp;<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 + &nbsp;
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>