用FusionChartsFree做饼状图、柱状图、折线图的实例
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Fusion Chart Test</title>
<link rel="stylesheet" href="../Contents/Style.css" type="text/css" />
<script src="../js/jquery.js" type="text/javascript"></script>
<script language="JavaScript" src="../js/FusionCharts.js"></script>
$(document).ready(function() {
// do something here
$.ajax({
type:"POST",
url:"../test", //请求路径 请求Action(继承DispatcherAction)中的login方法
success: function(responseText){
// alert(responseText);
//根据你所需要的图形类型选择不同的swf，如3d柱状图为FCF_Column3D.swf，2d饼状图为FCF_Pie2D.swf
var chart = new FusionCharts("../Charts/FCF_Line.swf", "ChartId", "600", "350");
chart.setDataXML(responseText);
chart.render("chartdiv");
}
});
});
</script>
</head>
<body bgcolor="#ffffff">
<div align="center">Fusion Charts Free</div>
<div id="chartdiv" align="center"></div>
</body>
</html>
以上需要引入需要的js和css，如jquery.js,FusionCharts.js,style.css,Charts文件夹，这其中的大部分都可
以在下载的FusionChartsFree中找到。如果只是做简单的从XML中读取数据，那么很简单，参看其中的相关例子即可。
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
* @Title: Servlet.java
* @Package servlet
* @Description:
* @author lzh
* @date Dec 2, 2011 2:44:51 PM
* @version V1.0
*/
public class Servlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
this.doPost(request, response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("GBK");
StringBuffer sb=new StringBuffer();
sb.append("<graph
caption='Monthly Unit Sales' xAxisName='Month' yAxisName='Units'
showNames='1' decimalPrecision='2' formatNumberScale='0'>");
sb.append("<set name='一月' value='444' color='CCFFFF' hoverText='一月,444' link='http://www.baidu.com'/>");
sb.append("<set name='二月' value='555' color='F6BD0F'/>");
sb.append("<set name='三月' value='671' color='8BBA00' />");
sb.append("<set name='四月' value='494' color='FF8E46'/>");
sb.append("<set name='五月' value='761' color='008E8E'/>");
sb.append("<set name='六月' value='960' color='D64646'/>");
sb.append("<set name='七月' value='629' color='8E468E'/>");
sb.append("<set name='八月' value='622' color='588526'/>");
sb.append("<set name='九月' value='376' color='B3AA00'/>");
sb.append("<set name='十月' value='494' color='008ED6'/>");
sb.append("<set name='十一月' value='761' color='9D080D'/>");
sb.append("<set name='十二月' value='960' color='A186BE'/>");
sb.append("</graph>");
response.setCharacterEncoding("UTF-8");
System.out.println(sb.toString());
response.getWriter().print(sb.toString());
}
}
caption='' subcaption='' hovercapbg='FFECAA' hovercapborder='F47E00'
formatNumberScale='0' decimalPrecision='0' showvalues='0'
numdivlines='3' numVdivlines='0' yaxisminvalue='1000'
yaxismaxvalue='1800' rotateNames='0'>
<categories >
<category name='2011-08-17 17：20' />
<category name='2011-08-17 17：25' />
<category name='2011-08-17 17：30' />
<category name='2011-08-17 17：35' />
<category name='2011-08-17 17：40' />
<category name='2011-08-17 17：45' />
<category name='2011-08-17 17：50' />
<dataset seriesName='温度' color='1D8BD1' anchorBorderColor='1D8BD1' anchorBgColor='1D8BD1'>
<set value='1327' />
<set value='1826' />
<set value='1699' />
<set value='1511' />
<set value='1904' />
<set value='1957' />
<set value='1296' />
</dataset>
<set value='2042' />
<set value='3210' />
<set value='2994' />
<set value='3115' />
<set value='2844' />
<set value='3576' />
<set value='1862' />
</dataset>
<set value='850' />
<set value='1010' />
<set value='1116' />
<set value='1234' />
<set value='1210' />
<set value='1054' />
<set value='802' />
</dataset>
<set value='541' />
<set value='781' />
<set value='920' />
<set value='754' />
<set value='840' />
<set value='893' />
<set value='451' />
</dataset>
</graph>
用FusionChartsFree做饼状图、柱状图、折线图的实例的更多相关文章
- seaborn分类数据可视化：散点图|箱型图|小提琴图|lv图|柱状图|折线图
一.散点图stripplot( ) 与swarmplot() 1.分类散点图stripplot( ) 用法stripplot(x=None, y=None, hue=None, data=None, ...
- 前端数据统计用做Bootstrap的一些柱状图、饼状图和折线图案例
Bootstrap,来自 Twitter,是目前最受欢迎的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷. Bootstrap ...
- WPF、Silverlight项目中使用柱状图、饼状图、折线图
在开发的过程中,可能会遇到柱状图.饼状图.折线图来更好的显示数据,最近整理了一下,遂放出来望需要的朋友可以参考.本文仅仅是简单显示,如需复杂显示效果请参考官网代码示例.----本文代码使用WPF,Si ...
- ComponentOne的C1Chart做饼状图怎么显示其百分比
问题:ComponentOne的C1Chart做饼状图怎么显示每部分的百分比 描述: 我用C1Chart做饼状图的时候,不知道怎么显示其百分比在对应的区域上,求解. 目前做的效果(附加代码所生成的饼状 ...
- php 生成饼状图，折线图，条形图 通用类 2
生成饼状图,折线图,条形图通用的php类,这里使用的是国外的 HighCharts,前台页面别忘了调用HighCahrt js HighCharts中文网站 http://www.hcharts. ...
- php 生成饼状图，折线图，条形图 通用类
生成饼状图,折线图,条形图通用的php类,这里使用的是百度 Echart. Echart 官方网站 http://echarts.baidu.com/ <?php class Echarts ...
- Excel柱状图折线图组合怎么做 Excel百分比趋势图制作教程
Excel柱状图折线图组合怎么做 Excel百分比趋势图制作教程 用excel作图时候经常会碰到做柱状图和折线图组合,这样的图一般难在折线图的数据很小,是百分比趋势图,所以经常相对前面主数据太小了,在 ...
- 简单excel饼状图怎么做，bi工具怎么做饼状图
饼状图是为了在一个整体体现个体所占的比例,比如一块蛋糕每人各分多大份.了解了饼状图的含义,就来学习饼状图怎么做吧. 首先,我们准备excel表格饼状图的初始数据 然后选择excel表格上方的插入,选择 ...
- C# 绘制统计图(柱状图, 折线图, 扇形图)【转载】
统计图形种类繁多, 有柱状图, 折线图, 扇形图等等, 而统计图形的绘制方法也有很多, 有Flash制作的统计图形, 有水晶报表生成统计图形, 有专门制图软件制作, 也有编程语言自己制作的:这里我们用 ...
随机推荐
- AndroidManifest.xml file missing 解决方案
如果在导入一个项目到ECLIPSE里时,不要把项目文件放到workspace里面,放到别处再导,否则可能会提示这个错误:AndroidManifest.xml file missing,顺便导入的方式 ...
- MYSQL超时连接问题(com.mysql.jdbc.MysqlIO.readFully)
应用服务器连接mysql,有时候会出现以下异常: at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.jav ...
- HUD1862:EXCEL排序
Problem Description Excel可以对一组纪录按任意指定列排序.现请你编写程序实现类似功能. Input 测试输入包含若干测试用例.每个测试用例的第1行包含两个整数 N (< ...
- IT人为什么难以拿到高薪？【转帖】
最近在论坛里看到很多人发牢骚,说薪水少,可在我看来,你们这样的人拿得到高薪才怪! 我先问一句:这里有多少人是本科的?有多少人是正规本科的(不算自考,成考和专升本)?有多少人是有学位的?有多少有学位的是 ...
- 安装sysbench遇到找不到库文件的问题
export LD_LIBRARY_PATH=/usr/mysql/lib./configure --prefix=/usr/local/sysbench --with-mysql-includes= ...
- 转 由一次磁盘告警引发的血案：du 和 ls 的区别
如果你完全不明白或者完全明白图片含义, 那么你不用继续往下看了. 否则, 这篇文章也许正是你需要的. 背景 确切地说,不是收到的自动告警短信或者邮件告诉我某机器上的磁盘满了,而是某同学人肉发现该机器写 ...
- 安卓常用 widget
验证码 public class SpinnerImg extends ImageView { /** * 完成选择后启动另外一个spinner */ private ItemListener ite ...
- 用PHP与XML进行网站编程
一.小序 HTML简单易学又通用,一般的PHP程序就是嵌入在HTML语言之中实现的.但是随着WEB越来越广泛的应用,HTML的弱点也越来越明显了.XML的出现,弥补了这些不足,它提供了一个能够处理互联 ...
- 最短路径问题/Spfa
题目链接 题目描述 给你n个点,m条无向边,每条边都有长度d和花费p,给你起点s终点t,要求输出起点到终点的最短距离及其花费,如果最短距离有多条路线, 则输出花费最少的. 最后一行是两个数 s,t;起 ...
- php 版本比较
判断当前运行的 PHP 版本是否高于或等于你提供的版本号. function is_php($version) { static $_is_php; $version = (string) $vers ...