OpenFlashChartDemo动态数据显示

最新推荐文章于 2024-08-15 00:07:19 发布

wulei4

最新推荐文章于 2024-08-15 00:07:19 发布

阅读量122

点赞数

分类专栏： javascript 文章标签： json Flash JavaScript Servlet PHP ViewUI

本文链接：https://blog.csdn.net/wulei4/article/details/83736222

版权

javascript 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<html>

<script type="text/javascript" src="<%=request.getContextPath() %>/ofc2/swfobject.js"></script>
<script type="text/javascript" src="<%=request.getContextPath() %>/ofc2/json2.js"></script>

<body>
   <div id="div1"></div>
   <p><input type="button" value="重新加载" οnclick="reload1()" >  </p>
   <div id="div2" ></div>
</body>
</html>

<script type="text/javascript" language="javascript">
//定义第一个Flash控件
swfobject.embedSWF("<%=request.getContextPath() %>/ofc2/open-flash-chart.swf", "div1", "50%", "280","9.0.0", "expressInstall.swf", 
 {"data-file" : "<%=request.getContextPath() %>/servlet/GlassChartServlet"}, 
 {wmode : "transparent"}
);
	
//定义第二个Flash控件	
swfobject.embedSWF("<%=request.getContextPath() %>/ofc2/open-flash-chart.swf", "div2", "50%", "280","9.0.0", "expressInstall.swf",
 {"data-file" : "<%=request.getContextPath() %>/servlet/GlassChartServlet"}, 
 {wmode : "transparent"}
);

//根据请求一个URL，重新加载第一个Flash控件的数据
function reload1()
{
  tmp = findSWF("div1");
  x = tmp.reload( "<%=request.getContextPath() %>/servlet/GlassChartServlet" ); 
}
		

//第二个Flash控件,直接加载JSON数据	
function reload2()
{
  tmp = findSWF("div2");
  x = tmp.load( JSON.stringify(getNewData()) );
}

//生成一个JSON数据对象
function getNewData()
{
  var arraylist=[
    parseInt(100*Math.random()),
    parseInt(100*Math.random()),
    parseInt(100*Math.random()),
    parseInt(100*Math.random()),
    parseInt(100*Math.random()),
    parseInt(100*Math.random()),
    parseInt(100*Math.random()),
    parseInt(100*Math.random()),
    parseInt(100*Math.random()),
    parseInt(100*Math.random()),
    parseInt(100*Math.random()),            
    parseInt(100*Math.random())
    ];
     
	var data = {
		"title":{"text":"Sales by Month 2007","style":"font-size: 14px; font-family: Verdana; text-align: center;"}, 
		"x_axis":{"labels":{"labels":["J","F","M","A","M","J","J","A","S","O","N",{"text":"Dec", "colour":"#000000", "size":10, "rotate":45}]}},
		"y_axis":{"steps":16, "max":160},
		"bg_colour":"#ffffff", 
		"elements":[{"type":"bar_glass", "tip":"$#val#", "values":arraylist, "colour":"#00aa00"}]
	}
	
	return data;
}

//定时器,自动重新加载数据
setInterval(reload2,"1000");
	
//查找SWF控件	
function findSWF(movieName) 
{
  if (navigator.appName.indexOf("Microsoft")!= -1) {
    return window[movieName];
  } else {
    return document[movieName];
  }
}
	
</script>

package com.flashchart;

import java.io.IOException;
import java.io.PrintWriter;
import java.util.LinkedHashMap;
import java.util.Map;
import java.util.Map.Entry;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import jofc2.model.Chart;
import jofc2.model.Text;
import jofc2.model.axis.XAxis;
import jofc2.model.axis.YAxis;
import jofc2.model.elements.BarChart;
import jofc2.model.elements.BarChart.Bar;

public class GlassChartServlet extends HttpServlet {

	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 		
		 response.setContentType("application/json");
	     response.setHeader("Cache-Control", "no-cache");
	     response.setCharacterEncoding("UTF-8");
	     PrintWriter out = response.getWriter();

	     Map<String, Long> dataMap = new LinkedHashMap<String, Long>();
	     String[] month={"一月","二月","三月","四月","五月","六月","七月","八月"};
	     for(int i=0;i<8;i++)
	     {
	    	 dataMap.put(month[i],Math.round(Math.random()*710));
	     }	    

	     Chart ofc2Chart = new Chart();
	     Text title = new Text("2010年度XXXXX业务办理量");
	     ofc2Chart.setTitle(title);

	     BarChart barChart = new BarChart(BarChart.Style.GLASS); // 设置条状图样式
	     
	     XAxis x = new XAxis();                                  // X 轴	     
	     for (Entry<String, Long> entry : dataMap.entrySet()) 
	     {
	         x.addLabels(entry.getKey());                        // x 轴的文字
	         Bar bar = new Bar(entry.getValue(),"起 ");
	         bar.setColour("0x336699");                          // 颜色
	         bar.setTooltip(entry.getValue() + "起 ");           // 鼠标移动上去后的提示
	         barChart.addBars(bar);                          

	     }
	     
	     ofc2Chart.addElements(barChart);
	     ofc2Chart.setXAxis(x);

	     double ymax = 720d;     // Y 轴最大值
	     YAxis y = new YAxis();  // y 轴	     
	     y.setMax(ymax + 1.0);   // y 轴最大值
	     y.setSteps(ymax / 10);  // y 轴步进
	     ofc2Chart.setYAxis(y);

	     String jsonChart = ofc2Chart.toString();
	     out.write(jsonChart);
	     
	     out.flush();
	     out.close();
		} 
}

function reload()
{
  tmp = findSWF("chart");
  
  //
  // reload the data:
  //
  x = tmp.reload();
  
  //
  // to load from a specific URL:
  // you may need to 'escape' (URL escape, i.e. percent escape) your URL if it has & in it
  //
  x = tmp.reload("gallery-data-32.php?beer=1");
  
  //
  // do NOT show the 'loading...' message:
  //
  x = tmp.reload("gallery-data-32.php?beer=1", false);
}

function findSWF(movieName) {
  if (navigator.appName.indexOf("Microsoft")!= -1) {
    return window["ie_" + movieName];
  } else {
    return document[movieName];
  }
}

按照官方资料，我在设置第二个参数时，它就报错，这里先记下了，有待解决？
// do NOT show the 'loading...' message:
x = tmp.reload( "<%=request.getContextPath() %>/servlet/GlassChartServlet",false );

上一张效果图，如下：

wulei4

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
OpenFlashChartDemo动态数据显示

&lt;%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%&gt;&lt;html&gt;&lt;script type="text/javascript" src="&lt;%=request.getContextPath() %&gt;/ofc2/swfobject.
复制链接

扫一扫

专栏目录