-<!DOCTYPE html>
-<html lang="en">
-<head>
- <title>NetData - Real-time performance monitoring, done right!</title>
- <meta name="application-name" content="netdata">
-
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <meta charset="utf-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <meta name="apple-mobile-web-app-capable" content="yes">
- <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
-
- <meta property="og:locale" content="en_US" />
- <meta property="og:image" content="https://cloud.githubusercontent.com/assets/2662304/19168687/f6a567be-8c19-11e6-8561-ce8d589e8346.gif"/>
- <meta property="og:url" content="http://my-netdata.io/"/>
- <meta property="og:type" content="website"/>
- <meta property="og:site_name" content="netdata"/>
- <meta property="og:title" content="netdata - real-time performance monitoring, done right!"/>
- <meta property="og:description" content="Stunning real-time dashboards, blazingly fast and extremely interactive. Zero configuration, zero dependencies, zero maintenance." />
-</head>
+<!doctype html>
+<html lang=en-us>
+<meta charset=utf-8>
+<title>NetData - Real-time performance monitoring, done right!</title>
+<meta name=description
+ content="Stunning real-time dashboards, blazingly fast and extremely interactive. Zero configuration, zero dependencies, zero maintenance.">
+<meta name=viewport content="width=device-width,initial-scale=1">
+<link rel=apple-touch-icon href=apple-touch-icon.png>
+
+<style>/*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */
+html {
+ line-height: 1.15;
+ -ms-text-size-adjust: 100%;
+ -webkit-text-size-adjust: 100%;
+ color: #fff;
+ font: 17px/1.4 'Open Sans', sans-serif;
+ text-align: center
+}
+
+body {
+ margin: 0;
+ background-color: #2f3135;
+ 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==)
+}
+
+a {
+ background-color: transparent;
+ -webkit-text-decoration-skip: objects;
+ color: #069;
+ text-decoration: none
+}
+
+a:active, a:hover {
+ outline-width: 0
+}
+
+strong {
+ font-weight: bolder
+}
+
+h1 {
+ font-size: 3em;
+ line-height: 1.2em;
+ margin: 0 .5em .75em
+}
+
+img {
+ border-style: none;
+ vertical-align: middle
+}
+
+[type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner {
+ border-style: none;
+ padding: 0
+}
+
+[type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring, button:-moz-focusring {
+ outline: 1px dotted ButtonText
+}
+
+a:active, a:focus, a:hover {
+ text-decoration: underline
+}
+
+::-moz-selection {
+ background-color: #b3d4fc;
+ text-shadow: none
+}
+
+::selection {
+ background-color: #b3d4fc;
+ text-shadow: none
+}
+
+h2 {
+ font-size: 2em;
+ margin: 1.5em 0
+}
+
+h3 {
+ color: #555;
+ font-size: 1.25em;
+ margin: 0 0 .5em
+}
+
+p {
+ margin: 0 0 2em
+}
+
+.grid {
+ margin: 0 -15px;
+ letter-spacing: -.31em;
+ word-spacing: -.43em;
+ text-rendering: optimizespeed
+}
+
+.grid-cell {
+ display: inline-block;
+ letter-spacing: normal;
+ text-align: left;
+ text-rendering: auto;
+ vertical-align: top;
+ width: 50%;
+ word-spacing: normal
+}
+
+.grid-cell > * {
+ padding: 0 15px
+}
+
+.inline-block-list {
+ list-style-type: none;
+ margin: 0;
+ padding: 0
+}
+
+.inline-block-list li {
+ display: inline-block;
+ margin: 0 0 0 1.5em;
+ padding: 0;
+ vertical-align: top
+}
+
+.inline-block-list li:first-child {
+ margin-left: 0
+}
+
+.flex-embed {
+ background-color: #000;
+ box-shadow: 0 0 10px #000;
+ height: 0;
+ overflow: hidden;
+ padding-bottom: 56.25%;
+ position: relative
+}
+
+.flex-embed a, .flex-embed img {
+ bottom: 0;
+ height: 100%;
+ left: 0;
+ position: absolute;
+ top: 0;
+ width: 100%
+}
+
+.flex-embed .play-btn {
+ background: url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjMDAwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBkPSJNMjU2LDkyLjQ4MWM0NC40MzMsMCw4Ni4xOCwxNy4wNjgsMTE3LjU1Myw0OC4wNjRDNDA0Ljc5NCwxNzEuNDExLDQyMiwyMTIuNDEzLDQyMiwyNTUuOTk5cy0xNy4yMDYsODQuNTg4LTQ4LjQ0OCwxMTUuNDU1Yy0zMS4zNzIsMzAuOTk0LTczLjEyLDQ4LjA2NC0xMTcuNTUyLDQ4LjA2NHMtODYuMTc5LTE3LjA3LTExNy41NTItNDguMDY0QzEwNy4yMDYsMzQwLjU4Nyw5MCwyOTkuNTg1LDkwLDI1NS45OTlzMTcuMjA2LTg0LjU4OCw0OC40NDgtMTE1LjQ1M0MxNjkuODIxLDEwOS41NSwyMTEuNTY4LDkyLjQ4MSwyNTYsOTIuNDgxIE0yNTYsNTIuNDgxIGMtMTEzLjc3MSwwLTIwNiw5MS4xMTctMjA2LDIwMy41MThjMCwxMTIuMzk4LDkyLjIyOSwyMDMuNTIsMjA2LDIwMy41MmMxMTMuNzcyLDAsMjA2LTkxLjEyMSwyMDYtMjAzLjUyQzQ2MiwxNDMuNTk5LDM2OS43NzIsNTIuNDgxLDI1Niw1Mi40ODFMMjU2LDUyLjQ4MXogTTIwNi41NDQsMzU3LjE2MVYxNTkuODMzbDE2MC45MTksOTguNjY2TDIwNi41NDQsMzU3LjE2MXoiPjwvcGF0aD48L3N2Zz4K);
+ height: 150px;
+ left: 50%;
+ margin-left: -75px;
+ margin-top: -75px;
+ position: absolute;
+ top: 50%;
+ -webkit-transition: 1s;
+ transition: 1s;
+ width: 150px
+}
+
+.flex-embed:hover .play-btn {
+ opacity: .5
+}
+
+.clearfix:after, .clearfix:before {
+ content: ' ';
+ display: table
+}
+
+.clearfix:after {
+ clear: both
+}
+
+.clearfix {
+ *zoom: 1
+}
+
+.container {
+ margin: 0 auto;
+ max-width: 760px;
+ padding: 0 10px
+}
+
+.aside {
+ background-color: #eee;
+ border: solid #e3e3e3;
+ border-width: 1px 0;
+ font-size: 1.125em;
+ padding: 1em 0
+}
+
+.btn, .cta-option {
+ display: inline-block;
+ position: relative
+}
+
+.cta-option {
+ margin: 2.5em .5em 0;
+ vertical-align: top
+}
+
+.btn {
+ color: #fff;
+ font-size: 1.5em;
+ padding: .6em 1em;
+ text-decoration: none;
+ text-shadow: 0 -1px 0 rgba(0, 0, 0, .5);
+ vertical-align: middle;
+ border-radius: 4px;
+ border: 1px solid #333
+}
+
+.btn:active, .btn:focus, .btn:hover {
+ text-decoration: none
+}
+
+.btn-download {
+ background-color: #d9750b;
+ background-image: -webkit-linear-gradient(#f90 10%, #e76a00 100%);
+ background-image: linear-gradient(#f90 10%, #e76a00 100%);
+ box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset, 0 1px 3px rgba(0, 0, 0, .2);
+ border: 1px solid #995309
+}
+
+.btn-download:active, .btn-download:focus, .btn-download:hover {
+ background-color: #e0811b;
+ background-image: -webkit-linear-gradient(#f0a100 10%, #f70 100%);
+ background-image: linear-gradient(#f0a100 10%, #f70 100%)
+}
+
+.btn-download:active {
+ background-color: #cf6a00;
+ box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .2) inset
+}
+
+.btn-alt {
+ background-color: #444;
+ border-color: #222;
+ box-shadow: none;
+ font-size: 1.25em;
+ margin-top: .25em
+}
+
+.btn-alt:active, .btn-alt:focus, .btn-alt:hover {
+ background-color: #555
+}
+
+.star {
+ color: #e08524
+}
+
+.Icon {
+ display: inline-block;
+ height: 16px;
+ margin: -3px 1px 0 0;
+ vertical-align: middle;
+ width: 16px
+}
+
+.Icon--github {
+ background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMjEgMTIxIj48ZyBmaWxsPSIjMTkxNzE3Ij48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTYwLjUgMS42Yy0zMy4zIDAtNjAuNCAyNy02MC40IDYwLjQgMCAyNi43IDE3LjMgNDkuMyA0MS4zIDU3LjMgMyAuNiA0LjEtMS4zIDQuMS0yLjkgMC0xLjQtLjEtNi4yLS4xLTExLjItMTYuNyAzLjYtMjAuMy03LjItMjAuMy03LjItMi43LTctNi43LTguOC02LjctOC44LTUuNS0zLjcuNC0zLjcuNC0zLjcgNi4xLjQgOS4zIDYuMiA5LjMgNi4yIDUuNCA5LjIgMTQuMSA2LjYgMTcuNiA1IC41LTMuOSAyLjEtNi42IDMuOC04LjEtMTMuNC0xLjQtMjcuNS02LjYtMjcuNS0yOS44IDAtNi42IDIuNC0xMiA2LjItMTYuMi0uNi0xLjUtMi43LTcuNy42LTE2IDAgMCA1LjEtMS42IDE2LjYgNi4yIDQuOC0xLjMgMTAtMiAxNS4xLTJzMTAuMy43IDE1LjEgMmMxMS41LTcuOCAxNi42LTYuMiAxNi42LTYuMiAzLjMgOC4zIDEuMiAxNC41LjYgMTYgMy45IDQuMiA2LjIgOS42IDYuMiAxNi4yIDAgMjMuMi0xNC4xIDI4LjMtMjcuNSAyOS44IDIuMiAxLjkgNC4xIDUuNSA0LjEgMTEuMiAwIDguMS0uMSAxNC42LS4xIDE2LjYgMCAxLjYgMS4xIDMuNSA0LjEgMi45IDI0LTggNDEuMy0zMC42IDQxLjMtNTcuMyAwLTMzLjQtMjctNjAuNC02MC40LTYwLjR6Ii8+PHBhdGggZD0iTTIzIDg4LjNjLS4xLjMtLjYuNC0xIC4ycy0uNy0uNi0uNS0uOWMuMS0uMy42LS40IDEtLjJzLjYuNi41Ljl6bS0uOC0uNU0yNS40IDkxYy0uMy4zLS45LjEtMS4yLS4zLS40LS40LS41LTEtLjItMS4zLjMtLjMuOC0uMSAxLjIuMy41LjUuNSAxLjEuMiAxLjN6bS0uNS0uNk0yNy44IDk0LjVjLS40LjMtMSAwLTEuMy0uNS0uNC0uNS0uNC0xLjIgMC0xLjQuNC0uMyAxIDAgMS4zLjUuNC41LjQgMS4xIDAgMS40em0wIDBNMzEuMSA5Ny45Yy0uMy40LTEgLjMtMS42LS4yLS41LS41LS43LTEuMi0uMy0xLjUuMy0uNCAxLS4zIDEuNi4yLjUuNC42IDEuMS4zIDEuNXptMCAwTTM1LjYgOTkuOGMtLjEuNS0uOC43LTEuNS41LS43LS4yLTEuMS0uOC0xLTEuMi4xLS41LjgtLjcgMS41LS41LjcuMiAxLjEuNyAxIDEuMnptMCAwTTQwLjUgMTAwLjJjMCAuNS0uNi45LTEuMy45LS43IDAtMS4zLS40LTEuMy0uOXMuNi0uOSAxLjMtLjljLjcgMCAxLjMuNCAxLjMuOXptMCAwTTQ1LjEgOTkuNGMuMS41LS40IDEtMS4xIDEuMS0uNy4xLTEuMy0uMi0xLjQtLjctLjEtLjUuNC0xIDEuMS0xLjEuNy0uMSAxLjMuMiAxLjQuN3ptMCAwIi8+PC9nPjwvc3ZnPgo=)
+}
+
+.Icon--html5 {
+ background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjUwIDEwMSA0MTIgNDEyIj48cGF0aCBmaWxsPSIjRTQ0RDI2IiBkPSJNMTA3LjY0NCA0NzAuODc3bC0zMy4wMTEtMzcwLjI1N2gzNjIuNzM0bC0zMy4wNDYgMzcwLjE5OS0xNDguNTQzIDQxLjE4MXoiLz48cGF0aCBmaWxsPSIjRjE2NTI5IiBkPSJNMjU2IDQ4MC41MjNsMTIwLjAzLTMzLjI3NyAyOC4yNC0zMTYuMzUyaC0xNDguMjd6Ii8+PHBhdGggZmlsbD0iI0VCRUJFQiIgZD0iTTI1NiAyNjguMjE3aC02MC4wOWwtNC4xNS00Ni41MDFoNjQuMjR2LTQ1LjQxMWgtMTEzLjg2OGwxLjA4NyAxMi4xODMgMTEuMTYxIDEyNS4xMzloMTAxLjYyem0wIDExNy45MzZsLS4xOTkuMDUzLTUwLjU3NC0xMy42NTYtMy4yMzMtMzYuMjE3aC00NS41ODVsNi4zNjIgNzEuMzAxIDkzLjAyIDI1LjgyMy4yMDktLjA1OHoiLz48cGF0aCBmaWxsPSIjZmZmIiBkPSJNMjU1Ljg0MyAyNjguMjE3djQ1LjQxaDU1LjkxOGwtNS4yNzEgNTguODk0LTUwLjY0NyAxMy42N3Y0Ny4yNDRsOTMuMDk0LTI1LjgwMS42ODMtNy42NzIgMTAuNjcxLTExOS41NTEgMS4xMDgtMTIuMTk0aC0xMi4yMzd6bTAtOTEuOTEydjQ1LjQxMWgxMDkuNjg4bC45MTEtMTAuMjA3IDIuMDY5LTIzLjAyMSAxLjA4Ni0xMi4xODN6Ii8+PC9zdmc+Cg==)
+}
+
+.Icon--stackoverflow {
+ background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjMgMi44IDU4LjIgNTgiPjxwYXRoIGQ9Ik05LjMwNSAzNi44NDhsNC40MDEuMDQzLS4xNTMgMTkuNTk4aDI5LjI5MXYtMTkuNTI4aDQuNjM4djI0LjI4N2gtMzguMjAxbC4wMjQtMjQuNDAxem03LjE3NyAxMS41ODZoMjIuOTQ1djQuODgyaC0yMi45NDV6IiBmaWxsPSIjOTE5MTkxIi8+PHBhdGggZmlsbD0iI2E3OGI2OCIgZD0iTTE3LjAyIDM5LjY0OGwyMi45NiAyLjIxNi0uNDgxIDQuOTgxLTIyLjk2LTIuMjE2eiIvPjxwYXRoIGZpbGw9IiNjMTk2NTMiIGQ9Ik0xOS4xMjEgMjkuNzEzbDIyLjIgNi4yNjYtMS4zNTkgNC44MTYtMjIuMi02LjI2NnoiLz48cGF0aCBmaWxsPSIjZDQ4YzI4IiBkPSJNMjQuNTAxIDE4LjQ4NGwxOS43NDUgMTEuOTI2LTIuNTg3IDQuMjgzLTE5Ljc0NS0xMS45MjZ6Ii8+PHBhdGggZmlsbD0iI2ZlODkwOCIgZD0iTTM1LjczMyA3Ljg0OWwxMy40MzUgMTguNzUxLTQuMDY4IDIuOTE0LTEzLjQzNS0xOC43NTF6Ii8+PHBhdGggZmlsbD0iI2ZmN2ExNSIgZD0iTTUxLjM0IDIuNzUxbDMuODAyIDIyLjc1Mi00LjkzNi44MjUtMy44MDItMjIuNzUyeiIvPjwvc3ZnPgo=)
+}
+
+.site-header {
+ padding-top: 50px
+}
+
+.site-logo {
+ color: #fff;
+ float: left;
+ font-size: 25px;
+ font-weight: 700;
+ line-height: 32px;
+ text-decoration: none;
+ text-shadow: 2px 2px 0 #000;
+ text-transform: uppercase
+}
+
+.site-nav {
+ float: right;
+ list-style-type: none;
+ margin: 7px 0 0;
+ padding: 0
+}
+
+.site-nav a {
+ color: #ffa000;
+ display: block;
+ text-decoration: none;
+ text-transform: uppercase
+}
+
+.site-nav a:active, .site-nav a:focus, .site-nav a:hover {
+ color: #fff
+}
+
+.site-promo {
+ padding: 4em 0 6em;
+ color: white;
+}
+
+.site-promo .description {
+ color: #ddd;
+ font-size: 1.2em;
+ margin: 1em 2em 0
+}
+
+.last-update {
+ color: #999;
+ display: block;
+ font-size: .75em;
+ margin-top: 10px
+}
+
+.site-section {
+ background-color: #f9f9f9;
+ color: #333;
+ overflow: hidden;
+ padding: 2em 0 6em
+}
+
+.site-section-video {
+ background-color: transparent;
+ color: #fff;
+ text-align: center;
+ padding: 2em 0 3em
+}
+
+.site-section-video .content {
+ max-width: 720px;
+ margin: auto;
+ padding: 10px
+}
+
+.site-section-video h2 {
+ margin: 1em 0
+}
+
+.in-the-wild {
+ font-size: 1.25em;
+ margin: 0 auto;
+ max-width: 720px
+}
+
+.site-footer {
+ font-size: .875em;
+ padding: 2em
+}
+
+.site-footer a {
+ color: #ffa000
+}
+
+@media only screen and (max-width: 800px) {
+ .site-logo, .site-nav {
+ float: none
+ }
+
+ .site-nav li {
+ margin: 0 .5em
+ }
+
+ .site-header {
+ padding-top: 40px
+ }
+
+ .site-promo {
+ padding: 3em 0;
+ color: white;
+ }
+
+ .site-section {
+ padding: 0 1em 4em
+ }
+}
+
+@media only screen and (max-width: 600px) {
+ html {
+ font-size: 14px
+ }
+
+ .last-update, .site-footer {
+ font-size: 1em
+ }
+}
+
+@media only screen and (max-width: 460px) {
+ .grid-cell {
+ width: 100%
+ }
+}
+
+@media only screen and (max-width: 420px) {
+ h1 {
+ font-size: 2.5em
+ }
+
+ html {
+ font-size: 13px
+ }
+}
+
+@media print {
+ * {
+ background-color: transparent !important;
+ box-shadow: none !important;
+ color: #000 !important;
+ text-shadow: none !important
+ }
+
+ a, a:visited {
+ text-decoration: underline
+ }
+
+ img {
+ page-break-inside: avoid;
+ max-width: 100% !important
+ }
+
+ h1 {
+ padding: 1em 0 0
+ }
+
+ .site-promo {
+ margin: 1em;
+ padding: 0;
+ color: white;
+ }
+
+ .site-section {
+ padding: 0;
+ margin: 2em 1em
+ }
+
+ .site-section-video {
+ display: none
+ }
+
+ h2, h3, p {
+ orphans: 3;
+ widows: 3
+ }
+
+ h2, h3 {
+ page-break-after: avoid
+ }
+}
+</style>
<script>
// --- OPTIONS FOR THE DASHBOARD --
// var netdataTheme = 'default'; // this is white
var netdataTheme = 'slate'; // this is dark
+ var netdataNoBootstrap = true;
// Set the default netdata server.
// on charts without a 'data-host', this one will be used.
// the default is the server that dashboard.js is downloaded from.
// var netdataServer = 'http://my.server:19999/';
- </script>
+</script>
- <!--
- --- LOAD dashboard.js ---
+<!--
+ --- LOAD dashboard.js ---
- to host this HTML file on your web server,
- you have to load dashboard.js from the netdata server.
+ to host this HTML file on your web server,
+ you have to load dashboard.js from the netdata server.
- So, pick one the two below
- If you pick the first, set the server name/IP.
+ So, pick one the two below
+ If you pick the first, set the server name/IP.
- The second assumes you host this file on /usr/share/netdata/web
- and that you have chown it to be owned by netdata:netdata
- -->
- <!-- <script type="text/javascript" src="http://my.server:19999/dashboard.js"></script> -->
- <script type="text/javascript" src="dashboard.js?v20161112-1"></script>
+ The second assumes you host this file on /usr/share/netdata/web
+ and that you have chown it to be owned by netdata:netdata
+-->
+<!-- <script type="text/javascript" src="http://my.server:19999/dashboard.js"></script> -->
+<script type="text/javascript" src="dashboard.js?v20161112-1"></script>
- <script>
+<script>
// --- OPTIONS FOR THE CHARTS --
// destroy charts not shown (lowers memory on the browsers)
// set this to 'true' to destroy, 'false' to hide the charts
NETDATA.options.current.destroy_on_hide = false;
-
+
// set this to false, to always show all dimensions
NETDATA.options.current.eliminate_zero_dimensions = true;
-
+
// set this to false, to lower the pressure on the browser
NETDATA.options.current.concurrent_refreshes = true;
// abort ajax calls when we scroll
NETDATA.options.current.abort_ajax_on_scroll = true;
</script>
+
<style>
- body {
- font-size: 1vw;
+ .mygauge-combo {
+ display: inline-block;
+ }
+
+ .mygauge {
+ position: relative;
+ display: block;
+ width: 171px;
+ height: 105px;
+ }
+
+ .mygauge-button {
+ display: block;
+ }
+
+ .mygauge-legend-button {
+ font-size: 13px;
+ }
+
+ .mygause-donation {
+ font-size: 9px;
+ color: #999;
}
.mysparkline {
position: relative;
display: inline-block;
- min-height: 50px;
width: 100%;
- height: 7vmax;
+ height: 50px;
text-align: left;
}
.mysparkline-overchart-label {
position: absolute;
display: block;
- top: 0;
+ top: -15px;
left: 10px;
bottom: 0;
right: 0;
- font-size: 1vmax;
+ font-size: 14px;
z-index: 1;
}
.mysparkline-overchart-value {
position: absolute;
display: block;
- top: 1.1vmax;
+ top: 0px;
left: 10px;
bottom: 0;
right: 0;
- font-size: 5vmax;
+ font-size: 40px;
z-index: 2;
text-shadow: #333 0px 0px 2px;
}
- .myfullchart {
- position: relative;
- display: inline-block;
- width: 100%;
- height: 12vmax;
- min-height: 150px;
- text-align: left;
- }
-
- .mygauge-combo {
- display: inline-block;
- }
-
- .mygauge {
- position: relative;
- display: block;
- width: 18vw;
- height: 11vw;
- }
-
- .mygauge-button {
+ .mysparkline-overchart-value-center {
+ position: absolute;
display: block;
- }
-
- .mytitle {
- padding-top: 6vw;
- padding-bottom: 1vw;
- text-align: center;
- font-size: 2.4vw;
- }
-
- .mysubtitle {
- padding-top: 2vw;
- padding-bottom: 1vw;
+ top: 5px;
+ left: 0px;
+ bottom: 0;
+ right: 0;
+ font-size: 35px;
+ font-weight: bold;
text-align: center;
- font-size: 1.8vw;
+ z-index: 2;
+ text-shadow: #333 0px 0px 2px;
}
- .mycontent {
- text-align: center;
- font-size: 1.5vw;
- }
- @media only screen and (min-width : 992px) {
- .container {
- width: 80%;
- }
- }
- @media only screen and (max-width : 992px) {
- .container {
- width: 100%;
- }
- }
</style>
-<body style="text-align: center; background-color: #272b30;">
-
-<div class="container">
-
- <div style="text-align: center; font-size: 13vw; height: 14vw;">
- <b>netdata</b>
- </div>
- <div style="text-align: center; font-size: 2vw; height: 2.5vw;">
- real-time performance monitoring
- </div>
- <div style="width:80%; text-align: right; font-size: 2.7vw;">
- <strong>scaled out</strong>!
+<div class=container>
+ <div class="site-header clearfix" role=banner>
+ <div class=site-logo>my-netdata.io</div>
+ <ul class="site-nav inline-block-list">
+ <li><a href=https://github.com/firehol/netdata data-ga-category="Outbound links"
+ data-ga-action="Nav click" data-ga-label="Source code">Source code</a>
+ <li><a href=https://github.com/firehol/netdata/wiki
+ data-ga-category="Outbound links" data-ga-action="Nav click" data-ga-label=Docs>Docs</a>
+ </ul>
</div>
- <div class="mytitle">
- pick a <b>netdata</b> demo server
- </div>
- <div class="mycontent">
- these demo servers show what you will get by installing <b>netdata</b>
+ <div class=site-promo><h1>Linux’s most powerful performance monitoring</h1>
+ <p class=description>
+ <strong>Unparalleled</strong> insights, in <strong>real-time</strong>,
+ of <strong>everything</strong> happening on your Linux systems and applications,
+ with <strong>stunning</strong> interactive web dashboards
+ and powerful <strong>performance</strong> and <strong>health</strong> alarms.
+ <div class=cta-option>
+ <a class="btn btn-download" href=https://github.com/firehol/netdata/wiki/Installation
+ data-ga-category="Outbound links" data-ga-action="Nav click" data-ga-label=Install><strong>Install netdata now</strong></a>
+ <a class=last-update href=https://github.com/firehol/netdata/releases
+ data-ga-category="Outbound links" data-ga-action="Nav click" data-ga-label=Releases>See netdata releases</a></div>
+ <div class=cta-option>
+ <a class="btn btn-alt" href="#demosites">netdata live demo</a>
+ </div>
</div>
- <div style="width: 100%; text-align: center; padding-top: 2vw;">
- <div style="width: 100%; text-align: center;">
+</div>
+<div class=site-section>
+ <div class=container><h2>Get control of your Linux servers</h2>
+ <div class=grid>
+ <div class=grid-cell><h3><span class=star>★</span> Monitor everything</h3>
+ <p>Analyze thousands of metrics per server.
+ Everything about the system (CPU, RAM, disks, network, firewall, QoS, NFS, etc) and detailed performance metrics for dozens of Linux applications
+ (such as web servers, databases servers, email servers, DNS servers, etc)
+ and <strong>SNMP</strong> devices.
+ </div>
+ <div class=grid-cell><h3><span class=star>★</span> With alarms</h3>
+ <p>Alarms can be set on any metric monitored by netdata.
+ Alarm notifications are role-based and support dynamic thresholds, hysteresis and can be dispatched
+ via multiple methods (such as email, slack.com, pushover.net, pushbullet.com telegram.org, twilio.com).
+ </div>
+ <div class=grid-cell><h3><span class=star>★</span> In real-time</h3>
+ <p>netdata collects thousands of metrics per server <strong>per second</strong>, with just 1% CPU
+ utilization of a single core, a few MB or RAM and no disk I/O at all.
+ View everything on <strong>stunning</strong> real-time interactive web dashboards, even when netdata is
+ running on low-end hardware.
+ </div>
+ <div class=grid-cell><h3><span class=star>★</span> Out of the box</h3>
+ <p>netdata supports auto-detection for everything. It collects more than 5000 metrics automatically, with
+ <strong>zero configuration</strong>, it has <strong>zero dependencies</strong>, requires <strong>zero
+ maintenance</strong> and comes with more than 100 alarms pre-configured to detect common
+ failures, performance and availability issues.
+ </div>
+ <div class=grid-cell><h3><span class=star>★</span> Embeddable</h3>
+ <p>netdata can run anywhere a Linux kernel runs (even IoT) and its charts can be embedded on any web site too.
+ </div>
+ <div class=grid-cell><h3><span class=star>★</span> Customizable</h3>
+ <p>Custom dashboards can be built using simple HTML (no javascript necessary).
+ </div>
+ <div class=grid-cell><h3><span class=star>★</span> Extensible</h3>
+ <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).
+ </div>
+ <div class=grid-cell><h3><span class=star>★</span> Scalable</h3>
+ <p>netdata scales out, your web browser is the central netdata connecting all your servers together.
+ netdata can archive its metrics to <strong>graphite</strong> or <strong>opentsdb</strong> at a lower
+ rate, to avoid congesting these servers with the amount of data collected.
+ </div>
+ </div>
+ </div>
+</div>
+<div id="demosites" class="site-section site-section-video"><h2>netdata live demo sites</h2>
+ <div class="content">
+ <div class="container" style="text-align: center;">
<div class="mygauge-combo">
<div class="mygauge">
<div data-netdata="netdata.requests"
- data-host="//london.my-netdata.io"
- data-title="EU - London"
- data-chart-library="gauge"
- data-decimal-digits="0"
- data-common-max="top-gauges"
- data-width="100%"
- data-after="-300"
- data-points="300"
- data-colors="#558855"
- ></div>
+ data-host="//london.my-netdata.io"
+ data-title="EU - London"
+ data-chart-library="gauge"
+ data-decimal-digits="0"
+ data-common-max="top-gauges"
+ data-width="100%"
+ data-after="-300"
+ data-points="300"
+ data-colors="#558855"
+ ></div>
</div>
<div class="mygauge-button">
<br/> <br/>
- <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>
- <div style="font-size: 0.8vw;">
+ <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>
+ <div class="mygause-donation">
Donated by DigitalOcean.com
</div>
</div>
<div class="mygauge-combo">
<div class="mygauge">
<div data-netdata="netdata.requests"
- data-host="//atlanta.my-netdata.io"
- data-title="US - Atlanta"
- data-chart-library="gauge"
- data-decimal-digits="0"
- data-common-max="top-gauges"
- data-width="100%"
- data-after="-300"
- data-points="300"
- data-colors="#AA5555"
- ></div>
+ data-host="//atlanta.my-netdata.io"
+ data-title="US - Atlanta"
+ data-chart-library="gauge"
+ data-decimal-digits="0"
+ data-common-max="top-gauges"
+ data-width="100%"
+ data-after="-300"
+ data-points="300"
+ data-colors="#AA5555"
+ ></div>
</div>
<div class="mygauge-button">
<br/> <br/>
- <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>
- <div style="font-size: 0.8vw;">
+ <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>
+ <div class="mygause-donation">
Donated by CDN77.com
</div>
</div>
<div class="mygauge-combo">
<div class="mygauge">
<div data-netdata="netdata.requests"
- data-host="//sanfrancisco.netdata.rocks"
- data-title="US - California"
- data-chart-library="gauge"
- data-decimal-digits="0"
- data-common-max="top-gauges"
- data-width="100%"
- data-after="-300"
- data-points="300"
- data-colors="#5555AA"
- ></div>
+ data-host="//sanfrancisco.netdata.rocks"
+ data-title="US - California"
+ data-chart-library="gauge"
+ data-decimal-digits="0"
+ data-common-max="top-gauges"
+ data-width="100%"
+ data-after="-300"
+ data-points="300"
+ data-colors="#5555AA"
+ ></div>
</div>
<div class="mygauge-button">
<br/> <br/>
- <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>
- <div style="font-size: 0.8vw;">
+ <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>
+ <div class="mygause-donation">
Donated by DigitalOcean.com
</div>
</div>
<div class="mygauge-combo">
<div class="mygauge">
<div data-netdata="netdata.requests"
- data-host="//toronto.netdata.rocks"
- data-title="Canada"
- data-chart-library="gauge"
- data-decimal-digits="0"
- data-common-max="top-gauges"
- data-width="100%"
- data-after="-300"
- data-points="300"
- data-colors="#885588"
- ></div>
+ data-host="//toronto.netdata.rocks"
+ data-title="Canada"
+ data-chart-library="gauge"
+ data-decimal-digits="0"
+ data-common-max="top-gauges"
+ data-width="100%"
+ data-after="-300"
+ data-points="300"
+ data-colors="#885588"
+ ></div>
</div>
<div class="mygauge-button">
<br/> <br/>
- <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>
- <div style="font-size: 0.8vw;">
+ <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>
+ <div class="mygause-donation">
Donated by DigitalOcean.com
</div>
</div>
<div class="mygauge-combo">
<div class="mygauge">
<div data-netdata="netdata.requests"
- data-host="//frankfurt.netdata.rocks"
- data-title="EU - Germany"
- data-chart-library="easypiechart"
- data-decimal-digits="0"
- data-common-max="top-gauges"
- data-width="75%"
- data-after="-300"
- data-points="300"
- data-colors="#AAAA55"
- ></div>
+ data-host="//frankfurt.netdata.rocks"
+ data-title="EU - Germany"
+ data-chart-library="easypiechart"
+ data-decimal-digits="0"
+ data-common-max="top-gauges"
+ data-width="75%"
+ data-after="-300"
+ data-points="300"
+ data-colors="#AAAA55"
+ ></div>
</div>
<div class="mygauge-button">
<br/> <br/>
- <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>
- <div style="font-size: 0.8vw;">
+ <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>
+ <div class="mygause-donation">
Donated by DigitalOcean.com
</div>
</div>
<div class="mygauge-combo">
<div class="mygauge">
<div data-netdata="netdata.requests"
- data-host="//newyork.netdata.rocks"
- data-title="US - New York"
- data-chart-library="easypiechart"
- data-decimal-digits="0"
- data-common-max="top-gauges"
- data-width="75%"
- data-after="-300"
- data-points="300"
- data-colors="#BB5533"
- ></div>
+ data-host="//newyork.netdata.rocks"
+ data-title="US - New York"
+ data-chart-library="easypiechart"
+ data-decimal-digits="0"
+ data-common-max="top-gauges"
+ data-width="75%"
+ data-after="-300"
+ data-points="300"
+ data-colors="#BB5533"
+ ></div>
</div>
<div class="mygauge-button">
<br/> <br/>
- <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>
- <div style="font-size: 0.8vw;">
+ <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>
+ <div class="mygause-donation">
Donated by DigitalOcean.com
</div>
</div>
<div class="mygauge-combo">
<div class="mygauge">
<div data-netdata="netdata.requests"
- data-host="//singapore.netdata.rocks"
- data-title="Singapore"
- data-chart-library="easypiechart"
- data-decimal-digits="0"
- data-common-max="top-gauges"
- data-width="75%"
- data-after="-300"
- data-points="300"
- data-colors="#5588BB"
- ></div>
+ data-host="//singapore.netdata.rocks"
+ data-title="Singapore"
+ data-chart-library="easypiechart"
+ data-decimal-digits="0"
+ data-common-max="top-gauges"
+ data-width="75%"
+ data-after="-300"
+ data-points="300"
+ data-colors="#5588BB"
+ ></div>
</div>
<div class="mygauge-button">
<br/> <br/>
- <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>
- <div style="font-size: 0.8vw;">
+ <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>
+ <div class="mygause-donation">
Donated by DigitalOcean.com
</div>
</div>
<div class="mygauge-combo">
<div class="mygauge">
<div data-netdata="netdata.requests"
- data-host="//bangalore.netdata.rocks"
- data-title="India"
- data-chart-library="easypiechart"
- data-decimal-digits="0"
- data-common-max="top-gauges"
- data-width="75%"
- data-after="-300"
- data-points="300"
- data-colors="#BB55BB"
- ></div>
+ data-host="//bangalore.netdata.rocks"
+ data-title="India"
+ data-chart-library="easypiechart"
+ data-decimal-digits="0"
+ data-common-max="top-gauges"
+ data-width="75%"
+ data-after="-300"
+ data-points="300"
+ data-colors="#BB55BB"
+ ></div>
</div>
<div class="mygauge-button">
<br/> <br/>
- <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>
- <div style="font-size: 0.8vw;">
+ <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>
+ <div class="mygause-donation">
Donated by DigitalOcean.com
</div>
</div>
</div>
</div>
- </div>
-
- <div class="mytitle">
- this page is a custom <b>netdata</b> dashboard
- </div>
- <div class="mycontent">
- charts are coming from 8 servers, in parallel
- <br/>
- the servers are not aware of this multi-server dashboard,
- <br/>
- each server is not aware of the other servers,
- <br/>
- but on this dashboard <b>they are one</b>!
- </div>
- <div style="padding-top: 1vw; width: 100%; text-align: center; font-size: 1.5vw;">
- <i class="fa fa-comment" aria-hidden="true"></i>
- hover on a chart below, or drag it to show the past - <b>the others will follow</b>!
- <br/>
- double click on a chart to reset them all
- </div>
-
- <div class="mytitle">
- our <code>nginx</code> performance
- </div>
- <div class="mycontent">
- (we proxy netdata through nginx, on the demo sites)
- </div>
-
- <!-- Nav tabs -->
- <ul class="nav nav-tabs" role="tablist" style="padding-top: 1vw;">
- <li role="presentation" class="active"><a href="#nginx_requests" aria-controls="nginx_requests" role="tab" data-toggle="tab">Requests</a></li>
- <li role="presentation"><a href="#nginx_connections" aria-controls="nginx_connections" role="tab" data-toggle="tab">Connections</a></li>
- </ul>
-
- <!-- Tab panes -->
- <div class="tab-content">
- <div role="tabpanel" class="tab-pane active" id="nginx_requests">
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>EU - London</b> web requests/s
- </div>
- <div class="mysparkline-overchart-value" id="nginx_local.requests.netdata" >
- </div>
- <div data-netdata="nginx_local.requests"
- data-dimensions="requests"
- data-host="//london.my-netdata.io"
- data-decimal-digits="0"
- data-common-max="web-requests"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#558855"
- data-show-value-of-requests-at="nginx_local.requests.netdata"
- ></div>
- </div>
-
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>US - Atlanta</b> web requests/s
- </div>
- <div class="mysparkline-overchart-value" id="nginx_local.requests.netdata2" >
- </div>
- <div data-netdata="nginx_local.requests"
- data-dimensions="requests"
- data-host="//atlanta.my-netdata.io"
- data-decimal-digits="0"
- data-common-max="web-requests"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#AA5555"
- data-show-value-of-requests-at="nginx_local.requests.netdata2"
- ></div>
- </div>
-
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>US - California</b> web requests/s
- </div>
- <div class="mysparkline-overchart-value" id="nginx_local.requests.netdata3" >
- </div>
- <div data-netdata="nginx_local.requests"
- data-dimensions="requests"
- data-host="//sanfrancisco.netdata.rocks"
- data-decimal-digits="0"
- data-common-max="web-requests"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#5555AA"
- data-show-value-of-requests-at="nginx_local.requests.netdata3"
- ></div>
- </div>
-
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>Canada</b> web requests/s
- </div>
- <div class="mysparkline-overchart-value" id="nginx_local.requests.netdata4" >
- </div>
- <div data-netdata="nginx_local.requests"
- data-dimensions="requests"
- data-host="//toronto.netdata.rocks"
- data-decimal-digits="0"
- data-common-max="web-requests"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#885588"
- data-show-value-of-requests-at="nginx_local.requests.netdata4"
- ></div>
- </div>
+ <div class="container" style="padding-top: 40px; text-align: center;">
+ Charts are coming from 8 servers, in parallel.
+ <br/>
+ The servers are not aware of this multi-server dashboard.
+ <br/>
+ Each server is not aware of the other servers.
+ <br/>
+ But on this dashboard <b>they are one</b>! (hover on the chart below)
</div>
- <div role="tabpanel" class="tab-pane" id="nginx_connections">
+ <div class="container" style="padding-top: 40px; text-align: center;">
<div class="mysparkline">
<div class="mysparkline-overchart-label">
- <b>EU - London</b> active connections
+ <b>EU - London</b> connected clients
</div>
- <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata1" >
+ <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata" >
</div>
<div data-netdata="nginx_local.connections"
- data-dimensions="active"
- data-host="//london.my-netdata.io"
- data-decimal-digits="0"
- data-common-max="web-connections"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#558855"
- data-show-value-of-active-at="nginx_local.connections.netdata1"
- ></div>
- </div>
-
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>US - Atlanta</b> active connections
- </div>
- <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata2" >
- </div>
- <div data-netdata="nginx_local.connections"
- data-dimensions="active"
- data-host="//atlanta.my-netdata.io"
- data-decimal-digits="0"
- data-common-max="web-connections"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#AA5555"
- data-show-value-of-active-at="nginx_local.connections.netdata2"
- ></div>
- </div>
-
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>US - California</b> active connections
- </div>
- <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata3" >
- </div>
- <div data-netdata="nginx_local.connections"
- data-dimensions="active"
- data-host="//sanfrancisco.netdata.rocks"
- data-decimal-digits="0"
- data-common-max="web-connections"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#5555AA"
- data-show-value-of-active-at="nginx_local.connections.netdata3"
- ></div>
- </div>
-
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>Canada</b> active connections
- </div>
- <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata4" >
- </div>
- <div data-netdata="nginx_local.connections"
- data-dimensions="active"
- data-host="//toronto.netdata.rocks"
- data-decimal-digits="0"
- data-common-max="web-connections"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#885588"
- data-show-value-of-active-at="nginx_local.connections.netdata4"
- ></div>
- </div>
- </div>
- </div>
-
- <div style="width: 100%; text-align: right; font-size: 1vw;">
- <i class="fa fa-comment" aria-hidden="true"></i> these charts are draggable and touchable, double click them to reset them
- </div>
-
-
- <div class="mytitle">
- bandwidth consumption on the demo sites
- </div>
- <div class="mycontent">
- Linux QoS is configured by <a href="https://github.com/firehol/netdata/wiki/You-should-install-QoS-on-all-your-servers">FireQOS</a>
- </div>
-
- <!-- Nav tabs -->
- <ul class="nav nav-tabs" role="tablist" style="padding-top: 1vw;">
- <li role="presentation" class="active"><a href="#outbout" aria-controls="outbout" role="tab" data-toggle="tab">Outbound</a></li>
- <li role="presentation"><a href="#inbound" aria-controls="inbound" role="tab" data-toggle="tab">Inbound</a></li>
- </ul>
-
- <!-- Tab panes -->
- <div class="tab-content">
- <div role="tabpanel" class="tab-pane active" id="outbout">
- <div class="myfullchart">
- <div data-netdata="tc.world_out"
- data-host="//london.my-netdata.io"
- data-common-max="tc-world-out"
- data-chart-library="dygraph"
- data-title="EU - London, traffic we send per service"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- ></div>
- </div>
-
- <div class="myfullchart">
- <div data-netdata="tc.world_out"
- data-host="//atlanta.my-netdata.io"
- data-chart-library="dygraph"
- data-common-max="tc-world-out"
- data-title="US - Atlanta, traffic we send per service"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- ></div>
-
- </div>
-
- <div class="myfullchart">
- <div data-netdata="tc.world_out"
- data-host="//sanfrancisco.netdata.rocks"
- data-chart-library="dygraph"
- data-common-max="tc-world-out"
- data-title="US - California, traffic we send per service"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- ></div>
- </div>
-
- <div class="myfullchart">
- <div data-netdata="tc.world_out"
- data-host="//toronto.netdata.rocks"
- data-chart-library="dygraph"
- data-common-max="tc-world-out"
- data-title="Canada, traffic we send per service"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- ></div>
- </div>
- </div>
-
- <div role="tabpanel" class="tab-pane" id="inbound">
- <div class="myfullchart">
- <div data-netdata="tc.world_in"
- data-host="//london.my-netdata.io"
- data-common-max="tc-world-in"
- data-chart-library="dygraph"
- data-title="EU - London, traffic we receive per service"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- ></div>
-
- </div>
-
- <div class="myfullchart">
- <div data-netdata="tc.world_in"
- data-host="//atlanta.my-netdata.io"
- data-common-max="tc-world-in"
- data-chart-library="dygraph"
- data-title="US - Atlanta, traffic we receive per service"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- ></div>
-
- </div>
-
- <div class="myfullchart">
- <div data-netdata="tc.world_in"
- data-host="//sanfrancisco.netdata.rocks"
- data-common-max="tc-world-in"
- data-chart-library="dygraph"
- data-title="US - California, traffic we receive per service"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- ></div>
- </div>
-
- <div class="myfullchart">
- <div data-netdata="tc.world_in"
- data-host="//toronto.netdata.rocks"
- data-common-max="tc-world-in"
- data-chart-library="dygraph"
- data-title="Canada, traffic we receive per service"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- ></div>
+ data-dimensions="active"
+ data-host="//london.my-netdata.io"
+ data-decimal-digits="0"
+ data-common-max="web-connections"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#558855"
+ data-show-value-of-active-at="nginx_local.connections.netdata"
+ ></div>
</div>
</div>
</div>
- <div style="width: 100%; text-align: right; font-size: 1vw;">
- <i class="fa fa-comment" aria-hidden="true"></i> <i>these legends are interactive and the charts are resizable here ^^^</i>
- </div>
-
- <div class="mytitle">
- DDoS protection performance on the demo sites
- </div>
- <div class="mycontent">
- iptables SYNPROXY configured by <a href="https://github.com/firehol/netdata/wiki/Monitoring-SYNPROXY">FireHOL</a>
- </div>
-
- <div style="padding-top: 4vw; width: 100%; text-align: center; font-size: 1.5vw;">
-
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>EU - London</b>, TCP SYN packets/s received
- </div>
- <div class="mysparkline-overchart-value" id="netfilter.synproxy_syn_received.netdata1" >
- </div>
- <div data-netdata="netfilter.synproxy_syn_received"
- data-dimensions="received"
- data-host="//london.my-netdata.io"
- data-decimal-digits="0"
- data-common-max="synproxy-in"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#558855"
- data-show-value-of-received-at="netfilter.synproxy_syn_received.netdata1"
- ></div>
- </div>
-
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>US - Atlanta</b>, TCP SYN packets/s received
- </div>
- <div class="mysparkline-overchart-value" id="netfilter.synproxy_syn_received.netdata2" >
- </div>
- <div data-netdata="netfilter.synproxy_syn_received"
- data-dimensions="received"
- data-host="//atlanta.my-netdata.io"
- data-decimal-digits="0"
- data-common-max="synproxy-in"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#885555"
- data-show-value-of-received-at="netfilter.synproxy_syn_received.netdata2"
- ></div>
- </div>
-
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>US - California</b>, TCP SYN packets/s received
- </div>
- <div class="mysparkline-overchart-value" id="netfilter.synproxy_syn_received.netdata3" >
- </div>
- <div data-netdata="netfilter.synproxy_syn_received"
- data-dimensions="received"
- data-host="//sanfrancisco.netdata.rocks"
- data-decimal-digits="0"
- data-common-max="synproxy-in"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#555588"
- data-show-value-of-received-at="netfilter.synproxy_syn_received.netdata3"
- ></div>
- </div>
+</div>
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>Canada</b>, TCP SYN packets/s received
- </div>
- <div class="mysparkline-overchart-value" id="netfilter.synproxy_syn_received.netdata4" >
- </div>
- <div data-netdata="netfilter.synproxy_syn_received"
- data-dimensions="received"
- data-host="//toronto.netdata.rocks"
- data-decimal-digits="0"
- data-common-max="synproxy-in"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#885588"
- data-show-value-of-received-at="netfilter.synproxy_syn_received.netdata4"
+<div class=site-section><h2>Who uses netdata?</h2>
+ <div class="content">
+ <div class="container" style="text-align: center;">
+ <div class="container" style="padding-top: 40px; text-align: center; width: 30%; min-width: 230px; display: inline-block;">
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ netdata <b>unique users</b>
+ </div>
+ <div class="mysparkline-overchart-value-center" id="netdata.registry_entries.persons.netdata" >
+ </div>
+ <div data-netdata="netdata.registry_entries"
+ data-dimensions="persons"
+ data-host="//london.my-netdata.io"
+ data-decimal-digits="0"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#558855"
+ data-show-value-of-persons-at="netdata.registry_entries.persons.netdata"
></div>
- </div>
- </div>
- <div style="width: 100%; text-align: right; font-size: 1vw;">
- <i class="fa fa-comment" aria-hidden="true"></i> <i>did you notice the decimal numbers?
- <br/>netdata interpolates collected values at second boundaries, with nanosecond detail!</i>
- </div>
-
-
- <div class="mytitle">
- CPU Utilization of the demo sites
- </div>
-
- <div style="padding-top: 1vw;">
- <div class="myfullchart">
- <div data-netdata="system.cpu"
- data-host="//london.my-netdata.io"
- data-chart-library="dygraph"
- data-title="EU - London, CPU Usage"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-dygraph-valuerange="[0, 100]"
- ></div>
- </div>
-
- <div class="myfullchart">
- <div data-netdata="system.cpu"
- data-host="//atlanta.my-netdata.io"
- data-chart-library="dygraph"
- data-title="US - Atlanta, CPU Usage"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-dygraph-valuerange="[0, 100]"
- ></div>
- </div>
-
- <div class="myfullchart">
- <div data-netdata="system.cpu"
- data-host="//sanfrancisco.netdata.rocks"
- data-chart-library="dygraph"
- data-title="US - California, CPU Usage"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-dygraph-valuerange="[0, 100]"
- ></div>
- </div>
-
- <div class="myfullchart">
- <div data-netdata="system.cpu"
- data-host="//toronto.netdata.rocks"
- data-chart-library="dygraph"
- data-title="Canada, CPU Usage"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-dygraph-valuerange="[0, 100]"
- ></div>
- </div>
- </div>
- <div style="width: 100%; text-align: right; font-size: 1vw;">
- <i class="fa fa-comment" aria-hidden="true"></i> <i>what is using so much CPU?
- <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>
- </div>
-
- <div class="mytitle">
- Netdata performance
- </div>
- <div class="mycontent">
- netdata monitors <b>users</b>, <b>user groups</b>, <b>applications (process trees)</b>
- <br/>
- <b>containers</b> (<code>lxc</code>, <code>docker</code>, etc.) and SNMP devices.
- </div>
-
- <!-- Nav tabs -->
- <ul class="nav nav-tabs" role="tablist" style="padding-top: 1vw;">
- <li role="presentation" class="active"><a href="#netdata_cpu" aria-controls="netdata_cpu" role="tab" data-toggle="tab">CPU</a></li>
- <li role="presentation"><a href="#netdata_avgtime" aria-controls="netdata_avgtime" role="tab" data-toggle="tab">Average Response Time</a></li>
- </ul>
-
- <!-- Tab panes -->
- <div class="tab-content">
- <div role="tabpanel" class="tab-pane active" id="netdata_cpu">
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>EU - London</b>, CPU % of a single core
- </div>
- <div class="mysparkline-overchart-value" id="users.cpu.netdata1" >
- </div>
- <div data-netdata="apps.cpu"
- data-dimensions="netdata"
- data-common-max="users-cpu"
- data-decimal-digits="1"
- data-host="//london.my-netdata.io"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#558855"
- data-show-value-of-netdata-at="users.cpu.netdata1"
- ></div>
- </div>
-
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>US - Atlanta</b>, CPU % of a single core
</div>
- <div class="mysparkline-overchart-value" id="users.cpu.netdata2" >
- </div>
- <div data-netdata="apps.cpu"
- data-dimensions="netdata"
- data-common-max="users-cpu"
- data-decimal-digits="1"
- data-host="//atlanta.my-netdata.io"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#885555"
- data-show-value-of-netdata-at="users.cpu.netdata2"
- ></div>
</div>
-
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>US - California</b>, CPU % of a single core
- </div>
- <div class="mysparkline-overchart-value" id="users.cpu.netdata3" >
+ <div class="container" style="padding-top: 40px; text-align: center; width: 30%; min-width: 230px; display: inline-block;">
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ netdata <b>monitored servers</b>
+ </div>
+ <div class="mysparkline-overchart-value-center" id="netdata.registry_entries.machines.netdata" >
+ </div>
+ <div data-netdata="netdata.registry_entries"
+ data-dimensions="machines"
+ data-host="//london.my-netdata.io"
+ data-decimal-digits="0"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#558855"
+ data-show-value-of-machines-at="netdata.registry_entries.machines.netdata"
+ ></div>
</div>
- <div data-netdata="apps.cpu"
- data-dimensions="netdata"
- data-common-max="users-cpu"
- data-decimal-digits="1"
- data-host="//sanfrancisco.netdata.rocks"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#555588"
- data-show-value-of-netdata-at="users.cpu.netdata3"
- ></div>
</div>
-
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>Toronto</b>, CPU % of a single core
- </div>
- <div class="mysparkline-overchart-value" id="users.cpu.netdata4" >
+ <div class="container" style="padding-top: 40px; text-align: center; width: 30%; min-width: 230px; display: inline-block;">
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ netdata <b>sessions served</b>
+ </div>
+ <div class="mysparkline-overchart-value-center" id="netdata.registry_sessions.sessions.netdata" >
+ </div>
+ <div data-netdata="netdata.registry_sessions"
+ data-dimensions="sessions"
+ data-host="//london.my-netdata.io"
+ data-decimal-digits="0"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#558855"
+ data-show-value-of-sessions-at="netdata.registry_sessions.sessions.netdata"
+ ></div>
</div>
- <div data-netdata="apps.cpu"
- data-dimensions="netdata"
- data-common-max="users-cpu"
- data-decimal-digits="1"
- data-host="//toronto.netdata.rocks"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#885588"
- data-show-value-of-netdata-at="users.cpu.netdata4"
- ></div>
- </div>
-
- <div style="width: 100%; text-align: right; font-size: 1vw;">
- <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>!
- <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.
- <br/>and including the chart refreshes for the dashboards of all viewers.</i>
</div>
+ <p>
+ <small>figures comes from the <a href="https://github.com/firehol/netdata/wiki/mynetdata-menu-item">netdata public global registry</a></small>
+
+ <!--
+ <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" />
+ <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" />
+ <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" />
+ <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>
+ <br/>
+ -->
+ </p>
+ <p>
+ netdata can also generate auto-refreshing <strong><a href="https://github.com/firehol/netdata/wiki/Generating-Badges">badges</a></strong>, like these:
+ <br/>
+ <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" />
+ <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" />
+ <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" />
+ <br/>
+ <small>they auto-refresh every minute</small>
+ </p>
</div>
-
- <div role="tabpanel" class="tab-pane" id="netdata_avgtime">
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>EU - London</b>, API average response time in milliseconds
- </div>
- <div class="mysparkline-overchart-value" id="netdata.response_time1" >
- </div>
- <div data-netdata="netdata.response_time"
- data-host="//london.my-netdata.io"
- data-common-max="netdata-response-time"
- data-decimal-digits="1"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#558855 #356835"
- data-show-value-of-average-at="netdata.response_time1"
- ></div>
- </div>
-
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>US - Atlanta</b>, API average response time in milliseconds
- </div>
- <div class="mysparkline-overchart-value" id="netdata.response_time2" >
- </div>
- <div data-netdata="netdata.response_time"
- data-host="//atlanta.my-netdata.io"
- data-common-max="netdata-response-time"
- data-decimal-digits="1"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#885555 #683535"
- data-show-value-of-average-at="netdata.response_time2"
- ></div>
- </div>
-
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>US - California</b>, API average response time in milliseconds
- </div>
- <div class="mysparkline-overchart-value" id="netdata.response_time3" >
- </div>
- <div data-netdata="netdata.response_time"
- data-host="//sanfrancisco.netdata.rocks"
- data-common-max="netdata-response-time"
- data-decimal-digits="1"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#555588 #353568"
- data-show-value-of-average-at="netdata.response_time3"
- ></div>
- </div>
-
- <div class="mysparkline">
- <div class="mysparkline-overchart-label">
- <b>Canada</b>, API average response time in milliseconds
- </div>
- <div class="mysparkline-overchart-value" id="netdata.response_time4" >
- </div>
- <div data-netdata="netdata.response_time"
- data-host="//toronto.netdata.rocks"
- data-decimal-digits="1"
- data-common-max="netdata-response-time"
- data-chart-library="dygraph"
- data-dygraph-theme="sparkline"
- data-dygraph-type="area"
- data-width="100%"
- data-height="100%"
- data-after="-300"
- data-colors="#885588 #683568"
- data-show-value-of-average-at="netdata.response_time4"
- ></div>
- </div>
-
- <div style="width: 100%; text-align: right; font-size: 1vw;">
- <i class="fa fa-comment" aria-hidden="true"></i> <i>netdata is really <b>fast</b> (the values are milliseconds!)
- <br/>
- These values include everything, from the reception of the first byte to the dispatch of the last, including gzip compression.
- <br/>
- Values above 2-3ms are usually chart refreshes of charts with several dimensions, charts with very long durations (zoomed out), or file transfers.
- </i>
- </div>
+ <div class=cta-option>
+ <a class="btn btn-download" href=https://github.com/firehol/netdata/wiki/Installation
+ data-ga-category="Outbound links" data-ga-action="Nav click" data-ga-label=Install><strong>Install netdata now</strong></a>
</div>
</div>
-
- <div style="padding-top: 6vw; width: 100%; text-align: center; font-size: 2vw;">
- want to know more?
- <br/>
- jump to <a href="https://github.com/firehol/netdata/">the netdata page at github</a>
- <br/>
- it needs just 3 mins to be installed on your servers!
- <br/>
-
+</div>
+<!-- Place this tag in your head or just before your close body tag. -->
+<script async defer src="https://buttons.github.io/buttons.js"></script>
+<div class=aside>
+ <div class=container>
+ <ul class=inline-block-list>
+ <li>
+ <!-- Place this tag where you want the button to render. -->
+ <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>
+ </li>
+ <li>
+ <!-- Place this tag where you want the button to render. -->
+ <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>
+ </li>
+ <li>
+ <!-- Place this tag where you want the button to render. -->
+ <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>
+ </li>
+ </ul>
</div>
</div>
-</body>
+
+<div class=site-footer role=contentinfo>
+ <p>
+ <a class=twitter-share-button href=https://twitter.com/share data-count=none data-lang=en data-via=linuxnetdata data-size=large
+ data-text="netdata: Linux's more powerful performance monitoring" data-url=https://my-netdata.io/ >Tweet</a>
+ <a class=twitter-follow-button href=https://twitter.com/linuxnetdata data-show-count=false data-lang=en data-size=large>Follow @linuxnetdata</a>
+ <p>
+ © 2016 Costa Tsaousis, <costa@tsaousis.gr><br/>
+ netdata is released under GPL v3+<br/>
+</div>
+
<script>
// google analytics when this is used for the home page of the demo sites
// you don't need this if you customize this dashboard for your needs
setTimeout(function() {
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
- (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
- m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-64295674-3', 'auto');
ga('send', 'pageview');
}, 2000);
</script>
-</html>
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <title>NetData - Real-time performance monitoring, done right!</title>
+ <meta name="application-name" content="netdata">
+
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta name="apple-mobile-web-app-capable" content="yes">
+ <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
+
+ <meta property="og:locale" content="en_US" />
+ <meta property="og:image" content="https://cloud.githubusercontent.com/assets/2662304/19168687/f6a567be-8c19-11e6-8561-ce8d589e8346.gif"/>
+ <meta property="og:url" content="http://my-netdata.io/"/>
+ <meta property="og:type" content="website"/>
+ <meta property="og:site_name" content="netdata"/>
+ <meta property="og:title" content="netdata - real-time performance monitoring, done right!"/>
+ <meta property="og:description" content="Stunning real-time dashboards, blazingly fast and extremely interactive. Zero configuration, zero dependencies, zero maintenance." />
+</head>
+
+<script>
+ // --- OPTIONS FOR THE DASHBOARD --
+
+ // this section has to appear before loading dashboard.js
+
+ // Select a theme.
+ // uncomment on of the two themes:
+
+ // var netdataTheme = 'default'; // this is white
+ var netdataTheme = 'slate'; // this is dark
+
+
+ // Set the default netdata server.
+ // on charts without a 'data-host', this one will be used.
+ // the default is the server that dashboard.js is downloaded from.
+
+ // var netdataServer = 'http://my.server:19999/';
+ </script>
+
+ <!--
+ --- LOAD dashboard.js ---
+
+ to host this HTML file on your web server,
+ you have to load dashboard.js from the netdata server.
+
+ So, pick one the two below
+ If you pick the first, set the server name/IP.
+
+ The second assumes you host this file on /usr/share/netdata/web
+ and that you have chown it to be owned by netdata:netdata
+ -->
+ <!-- <script type="text/javascript" src="http://my.server:19999/dashboard.js"></script> -->
+ <script type="text/javascript" src="dashboard.js?v20161112-1"></script>
+
+ <script>
+ // --- OPTIONS FOR THE CHARTS --
+
+ // destroy charts not shown (lowers memory on the browsers)
+ // set this to 'true' to destroy, 'false' to hide the charts
+ NETDATA.options.current.destroy_on_hide = false;
+
+ // set this to false, to always show all dimensions
+ NETDATA.options.current.eliminate_zero_dimensions = true;
+
+ // set this to false, to lower the pressure on the browser
+ NETDATA.options.current.concurrent_refreshes = true;
+
+ // if you need to support slow mobile phones, set this to false
+ NETDATA.options.current.parallel_refresher = true;
+
+ // set this to false, to always update the charts, even if focus is lost
+ NETDATA.options.current.stop_updates_when_focus_is_lost = true;
+
+ // since we have many servers and limited sockets,
+ // abort ajax calls when we scroll
+ NETDATA.options.current.abort_ajax_on_scroll = true;
+</script>
+<style>
+ body {
+ font-size: 1vw;
+ }
+
+ .mysparkline {
+ position: relative;
+ display: inline-block;
+ min-height: 50px;
+ width: 100%;
+ height: 7vmax;
+ text-align: left;
+ }
+
+ .mysparkline-overchart-label {
+ position: absolute;
+ display: block;
+ top: 0;
+ left: 10px;
+ bottom: 0;
+ right: 0;
+ font-size: 1vmax;
+ z-index: 1;
+ }
+
+ .mysparkline-overchart-value {
+ position: absolute;
+ display: block;
+ top: 1.1vmax;
+ left: 10px;
+ bottom: 0;
+ right: 0;
+ font-size: 5vmax;
+ z-index: 2;
+ text-shadow: #333 0px 0px 2px;
+ }
+
+ .myfullchart {
+ position: relative;
+ display: inline-block;
+ width: 100%;
+ height: 12vmax;
+ min-height: 150px;
+ text-align: left;
+ }
+
+ .mygauge-combo {
+ display: inline-block;
+ }
+
+ .mygauge {
+ position: relative;
+ display: block;
+ width: 18vw;
+ height: 11vw;
+ }
+
+ .mygauge-button {
+ display: block;
+ }
+
+ .mytitle {
+ padding-top: 6vw;
+ padding-bottom: 1vw;
+ text-align: center;
+ font-size: 2.4vw;
+ }
+
+ .mysubtitle {
+ padding-top: 2vw;
+ padding-bottom: 1vw;
+ text-align: center;
+ font-size: 1.8vw;
+ }
+
+ .mycontent {
+ text-align: center;
+ font-size: 1.5vw;
+ }
+
+ @media only screen and (min-width : 992px) {
+ .container {
+ width: 80%;
+ }
+ }
+ @media only screen and (max-width : 992px) {
+ .container {
+ width: 100%;
+ }
+ }
+</style>
+
+<body style="text-align: center; background-color: #272b30;">
+
+<div class="container">
+
+ <div style="text-align: center; font-size: 13vw; height: 14vw;">
+ <b>netdata</b>
+ </div>
+ <div style="text-align: center; font-size: 2vw; height: 2.5vw;">
+ real-time performance monitoring
+ </div>
+ <div style="width:80%; text-align: right; font-size: 2.7vw;">
+ <strong>scaled out</strong>!
+ </div>
+ <div class="mytitle">
+ pick a <b>netdata</b> demo server
+ </div>
+ <div class="mycontent">
+ these demo servers show what you will get by installing <b>netdata</b>
+ </div>
+
+ <div style="width: 100%; text-align: center; padding-top: 2vw;">
+ <div style="width: 100%; text-align: center;">
+
+ <div class="mygauge-combo">
+ <div class="mygauge">
+ <div data-netdata="netdata.requests"
+ data-host="//london.my-netdata.io"
+ data-title="EU - London"
+ data-chart-library="gauge"
+ data-decimal-digits="0"
+ data-common-max="top-gauges"
+ data-width="100%"
+ data-after="-300"
+ data-points="300"
+ data-colors="#558855"
+ ></div>
+ </div>
+ <div class="mygauge-button">
+ <br/> <br/>
+ <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>
+ <div style="font-size: 0.8vw;">
+ Donated by DigitalOcean.com
+ </div>
+ </div>
+ </div>
+ <div class="mygauge-combo">
+ <div class="mygauge">
+ <div data-netdata="netdata.requests"
+ data-host="//atlanta.my-netdata.io"
+ data-title="US - Atlanta"
+ data-chart-library="gauge"
+ data-decimal-digits="0"
+ data-common-max="top-gauges"
+ data-width="100%"
+ data-after="-300"
+ data-points="300"
+ data-colors="#AA5555"
+ ></div>
+ </div>
+ <div class="mygauge-button">
+ <br/> <br/>
+ <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>
+ <div style="font-size: 0.8vw;">
+ Donated by CDN77.com
+ </div>
+ </div>
+ </div>
+ <div class="mygauge-combo">
+ <div class="mygauge">
+ <div data-netdata="netdata.requests"
+ data-host="//sanfrancisco.netdata.rocks"
+ data-title="US - California"
+ data-chart-library="gauge"
+ data-decimal-digits="0"
+ data-common-max="top-gauges"
+ data-width="100%"
+ data-after="-300"
+ data-points="300"
+ data-colors="#5555AA"
+ ></div>
+ </div>
+ <div class="mygauge-button">
+ <br/> <br/>
+ <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>
+ <div style="font-size: 0.8vw;">
+ Donated by DigitalOcean.com
+ </div>
+ </div>
+ </div>
+ <div class="mygauge-combo">
+ <div class="mygauge">
+ <div data-netdata="netdata.requests"
+ data-host="//toronto.netdata.rocks"
+ data-title="Canada"
+ data-chart-library="gauge"
+ data-decimal-digits="0"
+ data-common-max="top-gauges"
+ data-width="100%"
+ data-after="-300"
+ data-points="300"
+ data-colors="#885588"
+ ></div>
+ </div>
+ <div class="mygauge-button">
+ <br/> <br/>
+ <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>
+ <div style="font-size: 0.8vw;">
+ Donated by DigitalOcean.com
+ </div>
+ </div>
+ </div>
+ <br/> <br/>
+ <div class="mygauge-combo">
+ <div class="mygauge">
+ <div data-netdata="netdata.requests"
+ data-host="//frankfurt.netdata.rocks"
+ data-title="EU - Germany"
+ data-chart-library="easypiechart"
+ data-decimal-digits="0"
+ data-common-max="top-gauges"
+ data-width="75%"
+ data-after="-300"
+ data-points="300"
+ data-colors="#AAAA55"
+ ></div>
+ </div>
+ <div class="mygauge-button">
+ <br/> <br/>
+ <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>
+ <div style="font-size: 0.8vw;">
+ Donated by DigitalOcean.com
+ </div>
+ </div>
+ </div>
+ <div class="mygauge-combo">
+ <div class="mygauge">
+ <div data-netdata="netdata.requests"
+ data-host="//newyork.netdata.rocks"
+ data-title="US - New York"
+ data-chart-library="easypiechart"
+ data-decimal-digits="0"
+ data-common-max="top-gauges"
+ data-width="75%"
+ data-after="-300"
+ data-points="300"
+ data-colors="#BB5533"
+ ></div>
+ </div>
+ <div class="mygauge-button">
+ <br/> <br/>
+ <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>
+ <div style="font-size: 0.8vw;">
+ Donated by DigitalOcean.com
+ </div>
+ </div>
+ </div>
+ <div class="mygauge-combo">
+ <div class="mygauge">
+ <div data-netdata="netdata.requests"
+ data-host="//singapore.netdata.rocks"
+ data-title="Singapore"
+ data-chart-library="easypiechart"
+ data-decimal-digits="0"
+ data-common-max="top-gauges"
+ data-width="75%"
+ data-after="-300"
+ data-points="300"
+ data-colors="#5588BB"
+ ></div>
+ </div>
+ <div class="mygauge-button">
+ <br/> <br/>
+ <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>
+ <div style="font-size: 0.8vw;">
+ Donated by DigitalOcean.com
+ </div>
+ </div>
+ </div>
+ <div class="mygauge-combo">
+ <div class="mygauge">
+ <div data-netdata="netdata.requests"
+ data-host="//bangalore.netdata.rocks"
+ data-title="India"
+ data-chart-library="easypiechart"
+ data-decimal-digits="0"
+ data-common-max="top-gauges"
+ data-width="75%"
+ data-after="-300"
+ data-points="300"
+ data-colors="#BB55BB"
+ ></div>
+ </div>
+ <div class="mygauge-button">
+ <br/> <br/>
+ <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>
+ <div style="font-size: 0.8vw;">
+ Donated by DigitalOcean.com
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="mytitle">
+ this page is a custom <b>netdata</b> dashboard
+ </div>
+ <div class="mycontent">
+ charts are coming from 8 servers, in parallel
+ <br/>
+ the servers are not aware of this multi-server dashboard,
+ <br/>
+ each server is not aware of the other servers,
+ <br/>
+ but on this dashboard <b>they are one</b>!
+ </div>
+ <div style="padding-top: 1vw; width: 100%; text-align: center; font-size: 1.5vw;">
+ <i class="fa fa-comment" aria-hidden="true"></i>
+ hover on a chart below, or drag it to show the past - <b>the others will follow</b>!
+ <br/>
+ double click on a chart to reset them all
+ </div>
+
+ <div class="mytitle">
+ our <code>nginx</code> performance
+ </div>
+ <div class="mycontent">
+ (we proxy netdata through nginx, on the demo sites)
+ </div>
+
+ <!-- Nav tabs -->
+ <ul class="nav nav-tabs" role="tablist" style="padding-top: 1vw;">
+ <li role="presentation" class="active"><a href="#nginx_requests" aria-controls="nginx_requests" role="tab" data-toggle="tab">Requests</a></li>
+ <li role="presentation"><a href="#nginx_connections" aria-controls="nginx_connections" role="tab" data-toggle="tab">Connections</a></li>
+ </ul>
+
+ <!-- Tab panes -->
+ <div class="tab-content">
+ <div role="tabpanel" class="tab-pane active" id="nginx_requests">
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>EU - London</b> web requests/s
+ </div>
+ <div class="mysparkline-overchart-value" id="nginx_local.requests.netdata" >
+ </div>
+ <div data-netdata="nginx_local.requests"
+ data-dimensions="requests"
+ data-host="//london.my-netdata.io"
+ data-decimal-digits="0"
+ data-common-max="web-requests"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#558855"
+ data-show-value-of-requests-at="nginx_local.requests.netdata"
+ ></div>
+ </div>
+
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>US - Atlanta</b> web requests/s
+ </div>
+ <div class="mysparkline-overchart-value" id="nginx_local.requests.netdata2" >
+ </div>
+ <div data-netdata="nginx_local.requests"
+ data-dimensions="requests"
+ data-host="//atlanta.my-netdata.io"
+ data-decimal-digits="0"
+ data-common-max="web-requests"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#AA5555"
+ data-show-value-of-requests-at="nginx_local.requests.netdata2"
+ ></div>
+ </div>
+
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>US - California</b> web requests/s
+ </div>
+ <div class="mysparkline-overchart-value" id="nginx_local.requests.netdata3" >
+ </div>
+ <div data-netdata="nginx_local.requests"
+ data-dimensions="requests"
+ data-host="//sanfrancisco.netdata.rocks"
+ data-decimal-digits="0"
+ data-common-max="web-requests"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#5555AA"
+ data-show-value-of-requests-at="nginx_local.requests.netdata3"
+ ></div>
+ </div>
+
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>Canada</b> web requests/s
+ </div>
+ <div class="mysparkline-overchart-value" id="nginx_local.requests.netdata4" >
+ </div>
+ <div data-netdata="nginx_local.requests"
+ data-dimensions="requests"
+ data-host="//toronto.netdata.rocks"
+ data-decimal-digits="0"
+ data-common-max="web-requests"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#885588"
+ data-show-value-of-requests-at="nginx_local.requests.netdata4"
+ ></div>
+ </div>
+ </div>
+
+ <div role="tabpanel" class="tab-pane" id="nginx_connections">
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>EU - London</b> active connections
+ </div>
+ <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata1" >
+ </div>
+ <div data-netdata="nginx_local.connections"
+ data-dimensions="active"
+ data-host="//london.my-netdata.io"
+ data-decimal-digits="0"
+ data-common-max="web-connections"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#558855"
+ data-show-value-of-active-at="nginx_local.connections.netdata1"
+ ></div>
+ </div>
+
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>US - Atlanta</b> active connections
+ </div>
+ <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata2" >
+ </div>
+ <div data-netdata="nginx_local.connections"
+ data-dimensions="active"
+ data-host="//atlanta.my-netdata.io"
+ data-decimal-digits="0"
+ data-common-max="web-connections"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#AA5555"
+ data-show-value-of-active-at="nginx_local.connections.netdata2"
+ ></div>
+ </div>
+
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>US - California</b> active connections
+ </div>
+ <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata3" >
+ </div>
+ <div data-netdata="nginx_local.connections"
+ data-dimensions="active"
+ data-host="//sanfrancisco.netdata.rocks"
+ data-decimal-digits="0"
+ data-common-max="web-connections"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#5555AA"
+ data-show-value-of-active-at="nginx_local.connections.netdata3"
+ ></div>
+ </div>
+
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>Canada</b> active connections
+ </div>
+ <div class="mysparkline-overchart-value" id="nginx_local.connections.netdata4" >
+ </div>
+ <div data-netdata="nginx_local.connections"
+ data-dimensions="active"
+ data-host="//toronto.netdata.rocks"
+ data-decimal-digits="0"
+ data-common-max="web-connections"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#885588"
+ data-show-value-of-active-at="nginx_local.connections.netdata4"
+ ></div>
+ </div>
+ </div>
+ </div>
+
+ <div style="width: 100%; text-align: right; font-size: 1vw;">
+ <i class="fa fa-comment" aria-hidden="true"></i> these charts are draggable and touchable, double click them to reset them
+ </div>
+
+
+ <div class="mytitle">
+ bandwidth consumption on the demo sites
+ </div>
+ <div class="mycontent">
+ Linux QoS is configured by <a href="https://github.com/firehol/netdata/wiki/You-should-install-QoS-on-all-your-servers">FireQOS</a>
+ </div>
+
+ <!-- Nav tabs -->
+ <ul class="nav nav-tabs" role="tablist" style="padding-top: 1vw;">
+ <li role="presentation" class="active"><a href="#outbout" aria-controls="outbout" role="tab" data-toggle="tab">Outbound</a></li>
+ <li role="presentation"><a href="#inbound" aria-controls="inbound" role="tab" data-toggle="tab">Inbound</a></li>
+ </ul>
+
+ <!-- Tab panes -->
+ <div class="tab-content">
+ <div role="tabpanel" class="tab-pane active" id="outbout">
+ <div class="myfullchart">
+ <div data-netdata="tc.world_out"
+ data-host="//london.my-netdata.io"
+ data-common-max="tc-world-out"
+ data-chart-library="dygraph"
+ data-title="EU - London, traffic we send per service"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ ></div>
+ </div>
+
+ <div class="myfullchart">
+ <div data-netdata="tc.world_out"
+ data-host="//atlanta.my-netdata.io"
+ data-chart-library="dygraph"
+ data-common-max="tc-world-out"
+ data-title="US - Atlanta, traffic we send per service"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ ></div>
+
+ </div>
+
+ <div class="myfullchart">
+ <div data-netdata="tc.world_out"
+ data-host="//sanfrancisco.netdata.rocks"
+ data-chart-library="dygraph"
+ data-common-max="tc-world-out"
+ data-title="US - California, traffic we send per service"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ ></div>
+ </div>
+
+ <div class="myfullchart">
+ <div data-netdata="tc.world_out"
+ data-host="//toronto.netdata.rocks"
+ data-chart-library="dygraph"
+ data-common-max="tc-world-out"
+ data-title="Canada, traffic we send per service"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ ></div>
+ </div>
+ </div>
+
+ <div role="tabpanel" class="tab-pane" id="inbound">
+ <div class="myfullchart">
+ <div data-netdata="tc.world_in"
+ data-host="//london.my-netdata.io"
+ data-common-max="tc-world-in"
+ data-chart-library="dygraph"
+ data-title="EU - London, traffic we receive per service"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ ></div>
+
+ </div>
+
+ <div class="myfullchart">
+ <div data-netdata="tc.world_in"
+ data-host="//atlanta.my-netdata.io"
+ data-common-max="tc-world-in"
+ data-chart-library="dygraph"
+ data-title="US - Atlanta, traffic we receive per service"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ ></div>
+
+ </div>
+
+ <div class="myfullchart">
+ <div data-netdata="tc.world_in"
+ data-host="//sanfrancisco.netdata.rocks"
+ data-common-max="tc-world-in"
+ data-chart-library="dygraph"
+ data-title="US - California, traffic we receive per service"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ ></div>
+ </div>
+
+ <div class="myfullchart">
+ <div data-netdata="tc.world_in"
+ data-host="//toronto.netdata.rocks"
+ data-common-max="tc-world-in"
+ data-chart-library="dygraph"
+ data-title="Canada, traffic we receive per service"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ ></div>
+ </div>
+ </div>
+ </div>
+ <div style="width: 100%; text-align: right; font-size: 1vw;">
+ <i class="fa fa-comment" aria-hidden="true"></i> <i>these legends are interactive and the charts are resizable here ^^^</i>
+ </div>
+
+ <div class="mytitle">
+ DDoS protection performance on the demo sites
+ </div>
+ <div class="mycontent">
+ iptables SYNPROXY configured by <a href="https://github.com/firehol/netdata/wiki/Monitoring-SYNPROXY">FireHOL</a>
+ </div>
+
+ <div style="padding-top: 4vw; width: 100%; text-align: center; font-size: 1.5vw;">
+
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>EU - London</b>, TCP SYN packets/s received
+ </div>
+ <div class="mysparkline-overchart-value" id="netfilter.synproxy_syn_received.netdata1" >
+ </div>
+ <div data-netdata="netfilter.synproxy_syn_received"
+ data-dimensions="received"
+ data-host="//london.my-netdata.io"
+ data-decimal-digits="0"
+ data-common-max="synproxy-in"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#558855"
+ data-show-value-of-received-at="netfilter.synproxy_syn_received.netdata1"
+ ></div>
+ </div>
+
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>US - Atlanta</b>, TCP SYN packets/s received
+ </div>
+ <div class="mysparkline-overchart-value" id="netfilter.synproxy_syn_received.netdata2" >
+ </div>
+ <div data-netdata="netfilter.synproxy_syn_received"
+ data-dimensions="received"
+ data-host="//atlanta.my-netdata.io"
+ data-decimal-digits="0"
+ data-common-max="synproxy-in"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#885555"
+ data-show-value-of-received-at="netfilter.synproxy_syn_received.netdata2"
+ ></div>
+ </div>
+
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>US - California</b>, TCP SYN packets/s received
+ </div>
+ <div class="mysparkline-overchart-value" id="netfilter.synproxy_syn_received.netdata3" >
+ </div>
+ <div data-netdata="netfilter.synproxy_syn_received"
+ data-dimensions="received"
+ data-host="//sanfrancisco.netdata.rocks"
+ data-decimal-digits="0"
+ data-common-max="synproxy-in"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#555588"
+ data-show-value-of-received-at="netfilter.synproxy_syn_received.netdata3"
+ ></div>
+ </div>
+
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>Canada</b>, TCP SYN packets/s received
+ </div>
+ <div class="mysparkline-overchart-value" id="netfilter.synproxy_syn_received.netdata4" >
+ </div>
+ <div data-netdata="netfilter.synproxy_syn_received"
+ data-dimensions="received"
+ data-host="//toronto.netdata.rocks"
+ data-decimal-digits="0"
+ data-common-max="synproxy-in"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#885588"
+ data-show-value-of-received-at="netfilter.synproxy_syn_received.netdata4"
+ ></div>
+ </div>
+ </div>
+ <div style="width: 100%; text-align: right; font-size: 1vw;">
+ <i class="fa fa-comment" aria-hidden="true"></i> <i>did you notice the decimal numbers?
+ <br/>netdata interpolates collected values at second boundaries, with nanosecond detail!</i>
+ </div>
+
+
+ <div class="mytitle">
+ CPU Utilization of the demo sites
+ </div>
+
+ <div style="padding-top: 1vw;">
+ <div class="myfullchart">
+ <div data-netdata="system.cpu"
+ data-host="//london.my-netdata.io"
+ data-chart-library="dygraph"
+ data-title="EU - London, CPU Usage"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-dygraph-valuerange="[0, 100]"
+ ></div>
+ </div>
+
+ <div class="myfullchart">
+ <div data-netdata="system.cpu"
+ data-host="//atlanta.my-netdata.io"
+ data-chart-library="dygraph"
+ data-title="US - Atlanta, CPU Usage"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-dygraph-valuerange="[0, 100]"
+ ></div>
+ </div>
+
+ <div class="myfullchart">
+ <div data-netdata="system.cpu"
+ data-host="//sanfrancisco.netdata.rocks"
+ data-chart-library="dygraph"
+ data-title="US - California, CPU Usage"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-dygraph-valuerange="[0, 100]"
+ ></div>
+ </div>
+
+ <div class="myfullchart">
+ <div data-netdata="system.cpu"
+ data-host="//toronto.netdata.rocks"
+ data-chart-library="dygraph"
+ data-title="Canada, CPU Usage"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-dygraph-valuerange="[0, 100]"
+ ></div>
+ </div>
+ </div>
+ <div style="width: 100%; text-align: right; font-size: 1vw;">
+ <i class="fa fa-comment" aria-hidden="true"></i> <i>what is using so much CPU?
+ <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>
+ </div>
+
+ <div class="mytitle">
+ Netdata performance
+ </div>
+ <div class="mycontent">
+ netdata monitors <b>users</b>, <b>user groups</b>, <b>applications (process trees)</b>
+ <br/>
+ <b>containers</b> (<code>lxc</code>, <code>docker</code>, etc.) and SNMP devices.
+ </div>
+
+ <!-- Nav tabs -->
+ <ul class="nav nav-tabs" role="tablist" style="padding-top: 1vw;">
+ <li role="presentation" class="active"><a href="#netdata_cpu" aria-controls="netdata_cpu" role="tab" data-toggle="tab">CPU</a></li>
+ <li role="presentation"><a href="#netdata_avgtime" aria-controls="netdata_avgtime" role="tab" data-toggle="tab">Average Response Time</a></li>
+ </ul>
+
+ <!-- Tab panes -->
+ <div class="tab-content">
+ <div role="tabpanel" class="tab-pane active" id="netdata_cpu">
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>EU - London</b>, CPU % of a single core
+ </div>
+ <div class="mysparkline-overchart-value" id="users.cpu.netdata1" >
+ </div>
+ <div data-netdata="apps.cpu"
+ data-dimensions="netdata"
+ data-common-max="users-cpu"
+ data-decimal-digits="1"
+ data-host="//london.my-netdata.io"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#558855"
+ data-show-value-of-netdata-at="users.cpu.netdata1"
+ ></div>
+ </div>
+
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>US - Atlanta</b>, CPU % of a single core
+ </div>
+ <div class="mysparkline-overchart-value" id="users.cpu.netdata2" >
+ </div>
+ <div data-netdata="apps.cpu"
+ data-dimensions="netdata"
+ data-common-max="users-cpu"
+ data-decimal-digits="1"
+ data-host="//atlanta.my-netdata.io"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#885555"
+ data-show-value-of-netdata-at="users.cpu.netdata2"
+ ></div>
+ </div>
+
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>US - California</b>, CPU % of a single core
+ </div>
+ <div class="mysparkline-overchart-value" id="users.cpu.netdata3" >
+ </div>
+ <div data-netdata="apps.cpu"
+ data-dimensions="netdata"
+ data-common-max="users-cpu"
+ data-decimal-digits="1"
+ data-host="//sanfrancisco.netdata.rocks"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#555588"
+ data-show-value-of-netdata-at="users.cpu.netdata3"
+ ></div>
+ </div>
+
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>Toronto</b>, CPU % of a single core
+ </div>
+ <div class="mysparkline-overchart-value" id="users.cpu.netdata4" >
+ </div>
+ <div data-netdata="apps.cpu"
+ data-dimensions="netdata"
+ data-common-max="users-cpu"
+ data-decimal-digits="1"
+ data-host="//toronto.netdata.rocks"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#885588"
+ data-show-value-of-netdata-at="users.cpu.netdata4"
+ ></div>
+ </div>
+
+ <div style="width: 100%; text-align: right; font-size: 1vw;">
+ <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>!
+ <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.
+ <br/>and including the chart refreshes for the dashboards of all viewers.</i>
+ </div>
+ </div>
+
+ <div role="tabpanel" class="tab-pane" id="netdata_avgtime">
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>EU - London</b>, API average response time in milliseconds
+ </div>
+ <div class="mysparkline-overchart-value" id="netdata.response_time1" >
+ </div>
+ <div data-netdata="netdata.response_time"
+ data-host="//london.my-netdata.io"
+ data-common-max="netdata-response-time"
+ data-decimal-digits="1"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#558855 #356835"
+ data-show-value-of-average-at="netdata.response_time1"
+ ></div>
+ </div>
+
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>US - Atlanta</b>, API average response time in milliseconds
+ </div>
+ <div class="mysparkline-overchart-value" id="netdata.response_time2" >
+ </div>
+ <div data-netdata="netdata.response_time"
+ data-host="//atlanta.my-netdata.io"
+ data-common-max="netdata-response-time"
+ data-decimal-digits="1"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#885555 #683535"
+ data-show-value-of-average-at="netdata.response_time2"
+ ></div>
+ </div>
+
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>US - California</b>, API average response time in milliseconds
+ </div>
+ <div class="mysparkline-overchart-value" id="netdata.response_time3" >
+ </div>
+ <div data-netdata="netdata.response_time"
+ data-host="//sanfrancisco.netdata.rocks"
+ data-common-max="netdata-response-time"
+ data-decimal-digits="1"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#555588 #353568"
+ data-show-value-of-average-at="netdata.response_time3"
+ ></div>
+ </div>
+
+ <div class="mysparkline">
+ <div class="mysparkline-overchart-label">
+ <b>Canada</b>, API average response time in milliseconds
+ </div>
+ <div class="mysparkline-overchart-value" id="netdata.response_time4" >
+ </div>
+ <div data-netdata="netdata.response_time"
+ data-host="//toronto.netdata.rocks"
+ data-decimal-digits="1"
+ data-common-max="netdata-response-time"
+ data-chart-library="dygraph"
+ data-dygraph-theme="sparkline"
+ data-dygraph-type="area"
+ data-width="100%"
+ data-height="100%"
+ data-after="-300"
+ data-colors="#885588 #683568"
+ data-show-value-of-average-at="netdata.response_time4"
+ ></div>
+ </div>
+
+ <div style="width: 100%; text-align: right; font-size: 1vw;">
+ <i class="fa fa-comment" aria-hidden="true"></i> <i>netdata is really <b>fast</b> (the values are milliseconds!)
+ <br/>
+ These values include everything, from the reception of the first byte to the dispatch of the last, including gzip compression.
+ <br/>
+ Values above 2-3ms are usually chart refreshes of charts with several dimensions, charts with very long durations (zoomed out), or file transfers.
+ </i>
+ </div>
+ </div>
+ </div>
+
+ <div style="padding-top: 6vw; width: 100%; text-align: center; font-size: 2vw;">
+ want to know more?
+ <br/>
+ jump to <a href="https://github.com/firehol/netdata/">the netdata page at github</a>
+ <br/>
+ it needs just 3 mins to be installed on your servers!
+ <br/>
+
+ </div>
+</div>
+</body>
+<script>
+ // google analytics when this is used for the home page of the demo sites
+ // you don't need this if you customize this dashboard for your needs
+ setTimeout(function() {
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+ m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-64295674-3', 'auto');
+ ga('send', 'pageview');
+ }, 2000);
+</script>
+</html>
projects / netdata.git / commitdiff