Highcharts JQuery 实时监控刷新图表


Highcharts JQuery 实时监控刷新图表_第1张图片
 现手上有个项目,要做一个实时监控刷新图表(折线图),网上资料大多是直接从官网上下载的例子,实时从后台取数据到前台展示的资料不多,现把最近几天研究的Demo分享一下:

        1. Jsp: liveTest.jsp
        代码如下:
  <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
 String path = request.getContextPath();
 String basePath = request.getScheme() + "://"
   + request.getServerName() + ":" + request.getServerPort()
   + path + "/";
%>


 
  
  折线图
  
  
 
 
  
  
  
     href=" http://www.highcharts.com/highslide/highslide.css" />
  
   style="min-width: 400px; height: 400px; margin: 0 auto">

 
 
2.后台相关代码:
    /**
  *
  * @Title getDataToJson
  * @Description 把后台数据转换为JSON
  * @param mapping
  * @param form
  * @param request
  * @param response
  * @return
  * @date Aug 8, 2012
  */
 @SuppressWarnings("unchecked")
 public ActionForward getDataToJson(ActionMapping mapping, ActionForm form,
   HttpServletRequest request, HttpServletResponse response) {
  try {
   List list90 = singinService.getSinginList(null);
   List list = new ArrayList(); //模拟数据
   for (int i = -19; i <= 0; i++) {
    TestBean tb = new TestBean();
    Random random = new Random();
    String value0 = String.valueOf(random.nextInt(10));
    String value1 = String.valueOf(random.nextInt(10));
    String value2 = String.valueOf(random.nextInt(10));
    tb.setValue0(value0);
    tb.setValue1(value1);
    tb.setValue2(value2);
    list.add(tb);
   }
   JSONArray jsonArray = JSONArray.fromObject(list); //封装成Json
   response.setHeader("Cache-Control", "no-cache");
   response.setContentType("text/json;charset=UTF-8");
   PrintWriter out = response.getWriter();
   out.print(jsonArray);
  } catch (Exception e) {
   e.printStackTrace();
  }
  return null;
 }
 /**
  *
  * @Title getDataToJsonNew
  * @Description 最新时间点数据
  * @param mapping
  * @param form
  * @param request
  * @param response
  * @return
  * @date Aug 10, 2012
  */
 public ActionForward getDataToJsonNew(ActionMapping mapping,
   ActionForm form, HttpServletRequest request,
   HttpServletResponse response) {
  try {
   List list = new ArrayList();
   TestBean tb = new TestBean();
   Random random = new Random();
   String value0 = String.valueOf(random.nextInt(10));
   String value1 = String.valueOf(random.nextInt(10));
   String value2 = String.valueOf(random.nextInt(10));
   tb.setValue0(value0);
   tb.setValue1(value1);
   tb.setValue2(value2);
   list.add(tb);
   JSONArray jsonArray = JSONArray.fromObject(list); //封装成Json
   response.setHeader("Cache-Control", "no-cache");
   response.setContentType("text/json;charset=UTF-8");
   PrintWriter out = response.getWriter();
   out.print(jsonArray);
  } catch (Exception e) {
   e.printStackTrace();
  }
  return null;
 }
 
3.有图有真相

你可能感兴趣的:(web,java,Highcharts,JQuery)