github:https://github.com/firehol/netdata
安装:https://github.com/firehol/netdata/wiki/Installation
内存使用说明:https://github.com/firehol/netdata/wiki/Memory-Requirements
配置:https://github.com/firehol/netdata/wiki/Configuration
页面定制:https://github.com/firehol/netdata/wiki/Custom-Dashboards
wiki中提到页面需要一个header:
<!DOCTYPE html> <html lang="en"> <head> <title>Your dashboard</title> <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"> <!-- here we will add dashboard.js --> </head> <body> <!-- here we will add charts --> </body> </html>
页面定制:
1、页面数据加载和样式的展示都是依赖netdata server服务dashboard.js实现的,如果自定义页面中有多台服务器数据,dashboard从一台中加载一遍即可
2、数据获取依赖两个元素属性,data-netdata=""和data-host="http://netdata:19999/",data-netdata是监控项名例如“system.cpu”,data-host是数据源服务器
3、如果元素没有自定义样式,netdata会默认选择监控项的样式
4、数据样式data-chart-library默认是dygraph(区域图),还有表盘样式easypiechart和gauge等
5、自定义样式有data-after=""/data-before=""时间区域,长宽高、最大值等,参考wiki即可
下面是两台虚拟机的自定义页面代码
<!DOCTYPE html> <html lang="en"> <head> <title>Your dashboard</title> <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"> <!-- here we will add dashboard.js --> <script type="text/javascript" src="http://192.168.1.113:19999/dashboard.js"></script> <script type="text/javascript" src="http://192.168.1.114:19999/dashboard.js"></script> </head> <body> <!-- here we will add charts --> <div data-netdata="system.cpu" data-chart-library="gauge" data-host="http://192.168.1.113:19999/" data-title="113CPU" data-units="%" data-gauge-max-value="100" data-width="18%" data-after="-420" data-points="420" data-colors="#22AA99" role="application" class="netdata-container" style="width: 18%; height: 164.5px;"></div> <div data-netdata="system.cpu" data-chart-library="gauge" data-host="http://192.168.1.114:19999/" data-title="114CPU" data-units="%" data-gauge-max-value="100" data-width="18%" data-after="-420" data-points="420" data-colors="#22AA99" role="application" class="netdata-container" style="width: 18%; height: 164.5px;"></div> <div class="netdata-group-container" id="submenu_system_load" style="display: inline-block; width: 100%"> <div data-netdata="system.load" data-chart-library="dygraph" data-host="http://192.168.1.113:19999/" data-title="113 CPU LOAD" data-after="-1800" data-before="1800" data-height="120px"></div> </div> <div class="netdata-group-container" id="submenu_system_load" style="display: inline-block; width: 100%"> <div data-netdata="system.load" data-chart-library="dygraph" data-host="http://192.168.1.114:19999/" data-title="114 CPU LOAD" data-after="-1800" data-before="1800" data-height="120px"></div> </div> </body> </html>
如果出现页面样式或js不兼容,可以调整dashboard.js中的引用。
页面如下