使用highcharts实现实时监控曲线图
最近一段时间由于服务器响应有些异常,所以花了半天做了一个简单实时监控页面。如下图

基本原理如下:
1、使用Filter拦截请求,采集服务器响应数据。
若是要收集响应状态码注意构造新的HttpServletResponse
需要注意的是:
1、在series的load事件中使用ajax定时加载数据,需要控制当前chart中的Point数据量,
series.addPoint(point, true, isShift);
当series中Point数量超过指定值,设定isShift为true,就可以移除第一个Point,防止浏览器内存占用太大无响应
2、ajax请求时只请求最新采集数据,所以每次加载采集数据后把最后时间保留下来,ajax请求时把当前chart中最后时间带上,获取最新数据
如果每秒采集一下数据并保存到数据库,可以扩充一下功能实现BI的数据挖掘和各维度的钻取该也不能。但由于是浏览器使用svg技术绘制曲线,采集的点太多时初次显示还是比较慢。