Highcharts动态曲线图(使用jna监视cpu使用率)

3 篇文章 0 订阅
2 篇文章 0 订阅

1、CPU使用率获取,因为我要用JNA调用,所以用c++调用windowAPI,编译成Dll文件;dll的代码如下:

// DllTest.cpp : Defines the exported functions for the DLL application.
//

#include "stdafx.h"
#include "iostream"
#include "stdafx.h"
#define _WIN32_WINNT   0x0501
#include <Windows.h>
#define MYLIBAPI  extern   "C"     __declspec( dllexport ) 

/*
要返回的函数声明
*/
MYLIBAPI void getCpuInfo(int wait,double* d);

/*
函数的定义
*/
//转换FILETIME类型
__int64 CompareFileTime ( FILETIME time1, FILETIME time2 )
{
	__int64 a = time1.dwHighDateTime << 32 | time1.dwLowDateTime ;
	__int64 b = time2.dwHighDateTime << 32 | time2.dwLowDateTime ;

	return   (b - a);
}

//函数的实体
/*wait是统计多长时间内的cpu使用率
d是返回的数组
*/
void getCpuInfo(int wait,double* d){
	HANDLE hEvent;
	BOOL res ;

	FILETIME preidleTime;
	FILETIME prekernelTime;
	FILETIME preuserTime;

	FILETIME idleTime;
	FILETIME kernelTime;
	FILETIME userTime;

	res = GetSystemTimes( &idleTime, &kernelTime, &userTime );


	preidleTime = idleTime;
	prekernelTime = kernelTime;
	preuserTime = userTime ;

	hEvent = CreateEvent (NULL,FALSE,FALSE,NULL); // 初始值为 nonsignaled ,并且每次触发后自动设置为nonsignaled

	WaitForSingleObject( hEvent,wait); //等待500毫秒
	res = GetSystemTimes( &idleTime, &kernelTime, &userTime );
	int idle = CompareFileTime( preidleTime,idleTime);
	int kernel = CompareFileTime( prekernelTime, kernelTime);
	int user = CompareFileTime(preuserTime, userTime);
	//cpu使用率的计算
        double cpu = (kernel +user - idle) *100.0/(kernel+user);
	//cpu空闲率的计算
        double cpuidle = ( idle) *100.0/(kernel+user);

	d[0] =cpu;
	d[1] = cpuidle;
}




 2、JNA代码的定义

package com.ligson.jna;

import com.sun.jna.Library;
import com.sun.jna.Native;

//声明
interface MyDllLib extends Library {
    /*
     DllTest.dll是我编译后的dll文件,放在项目的根目录
     */
    MyDllLib INSTANCE = (MyDllLib) Native.loadLibrary("DllTest.dll", MyDllLib.class);
    /*
    这个与c++中函数的定义一样,唯一不同的double[] d没用用指针,但是数组的本身就是指针,
     */
    public void getCpuInfo(int wait, double[] d);
}

public class GetCpuInfo {
    static MyDllLib myDllLib = MyDllLib.INSTANCE;

    public static double getCpu(int wait) {
        //声明返回值
        double[] d = new double[2];
        myDllLib.getCpuInfo(wait,d);
        return d[0];
    }
}

3、Web环境用grails框架,grails框架语法简单,各种东西定义都很方便,Controller的定义

package hf

import grails.converters.JSON

class CpuMonitorController {

  static List list = [];
  static Map result = [:];
  def index = {
    render(view: 'cpu');
  }

  def getCpuInfo = {
    double d = com.ligson.jna.GetCpuInfo.getCpu(500);
    def l = [:];
    l.x = new Date().getTime();
    l.y = d;
    list.add(l);

    result.x = l.x;
    result.y = l.y;
    //返回json格式,x轴以时间为准,y轴以cpu占有率为准
    return render(result as JSON);
  }
}

 4、cpu.gsp的代码:

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 12-1-10
  Time: 下午7:49
  To change this template use File | Settings | File Templates.
--%>

<%@ page contentType="text/html;charset=UTF-8" %>
<html>
<head>
  <title>Simple GSP page</title>
  <script type="text/javascript" src="${resource(dir: 'js', file: 'jquery-1.6.js')}"></script>
  <!--这个是必须的,highChart的核心-->
  <script type="text/javascript" src="${resource(dir: 'js', file: 'highcharts/highcharts.js')}"></script>
  <!--导出图片用的-->
  <script type="text/javascript" src="${resource(dir: 'js', file: 'highcharts/modules/exporting.js')}"></script>
  <!--主题-->
  <script type="text/javascript" src="${resource(dir: 'js', file: 'highcharts/themes/gray.js')}"></script>
  <script type="text/javascript">


    $(function() {
      Highcharts.setOptions({
        global: {
          useUTC: false
        }
      });

      //声明报表对象

      chart = new Highcharts.Chart({
        chart: {
          renderTo: 'container',
          defaultSeriesType: 'spline',
          marginRight: 10
        },
        title: {
          text: 'CPU使用率动态曲线图'
        },
        xAxis: {
          title: {
            text: '时间'
          },
          //linear" or "datetime"
          type: 'datetime',
          //坐标间隔
          tickPixelInterval: 150
        },
        yAxis: {
          title: {
            text: '使用率'
          },
          //指定y=3直线的样式
          plotLines: [
            {
              value: 0,
              width: 10,
              color: '#808080'
            }
          ]
        },
        //鼠标放在某个点上时的提示信息
        //dateFormat,numberFormat是highCharts的工具类
        tooltip: {
          formatter: function() {
            return '<b>' + this.series.name + '</b><br/>' +
                    Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) + '<br/>' +
                    Highcharts.numberFormat(this.y, 2);
          }
        },
        //曲线的示例说明,像地图上得图标说明一样
        legend: {
          enabled: true
        },
        //把曲线图导出成图片等格式
        exporting: {
          enabled: true
        },
        //放入数据
        series: [
          {
            name: 'CPU使用率',
            data: (function() {
              // 初始化数据
              var data = [],
                      time = (new Date()).getTime(),
                      i;
              for (i = -19; i <= 0; i++) {
                data.push({
                  x: time + i * 1000,
                  y: Math.random() * 100
                });
              }
              return data;
            })()
          }
        ]
      });
      getCpuInfo();
    });

    function getCpuInfo() {
      $.post("${createLink(controller:'cpuMonitor',action:'getCpuInfo')}", {"random":Math.random()}, function(data) {
        var result = {"x":data.x,"y":data.y};

        var series = chart.series[0];
        var x = result.x; // current time
        var y = result.y;
        series.addPoint([x, y], true, true);
      }, "json");
    }
    setInterval(getCpuInfo, 1000);

  </script>
</head>
<body>
<div style="width:800px;height:400px;overflow:auto;">
  <div id="container" style="width:800px;height:400px;margin:0 auto;"></div>
</div>
</body>
</html>

 5、漂亮的效果图:


6、我的dll库文件在下面,欢迎大家下载使用

 

 

  • 大小: 38 KB
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值