FusionChart 2D面积图
来源:互联网 发布:杨氏双缝干涉实验数据 编辑:程序博客网 时间:2024/05/16 16:59
1、创建一个web工程,命名为chart;
2、在WebContent目录下新建一个fusionchart文件夹,将FusionCharts.js拷到该目录下;
3、同样,将jquery-1.10.1.js和Area2D.swf也拷到WebContent目录下;
4、然后在WebContent目录下,新建一个JSP文件,取名为Area2D.jsp;
Area2D.jsp的源码如下:
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>FushionChart 2D 面积图</title><script type="text/javascript" src="fusionchart/FusionCharts.js"></script><script type="text/javascript" src="fusionchart/jquery-1.10.1.js"></script><style type="text/css"> body{ width:100%; height:100%; font-size: 12px; background: silver; } fieldset{ width:100%; height:100%; font-size: 12px; }</style><script type="text/javascript"> $(function(){ var areaChart = new FusionCharts( "fusionchart/Area2D.swf", "areaChart", "100%", "100%", "0", "1"); areaChart.setXMLUrl("Area2D.xml"); areaChart.render("Area2D"); });</script></head><body> <fieldset> <legend>2D面积图</legend> <div id="Area2D"></div> </fieldset></body></html>5、同理,在该目录下新建一个Area2D.xml文件,源码如下:
<?xml version="1.0" encoding="UTF-8"?><chart caption='张华2012年月收入' xAxisName='月份' yAxisName='收入' anchorSides='3' showValues= '1' bgColor='7FFF00' drawAnchors='1' baseFontSize='12' numDivLines='8' divLineColor='F4A460' zeroPlaneColor='008080' anchorBgColor='FFF000' showPlotBorder='1' plotBorderColor='FFE4B5' canvasBgColor='5EA294'> <set label='一月' value='3250' color='FF0000'/> <set label='二月' value='5650' color='FF0000'/> <set label='三月' value='6200' color='FF0000'/> <set label='四月' value='4500' color='FF0000'/> <set label='五月' value='6100' color='FF0000'/> <set label='六月' value='3134' color='FF0000'/> <set label='七月' value='4578' color='FF0000'/> <set label='八月' value='8745' color='FF0000'/> <set label='九月' value='2356' color='FF0000'/> <set label='十月' value='4580' color='FF0000'/> <set label='十一月' value='6500' color='FF0000'/> <set label='十二月' value='7840' color='FF0000'/></chart>
6、运行web项目,结果如下图:
- FusionChart 2D面积图
- FusionCharts 2D面积图
- HighCharts之2D面积图
- HighCharts之2D堆面积图
- Flex中的FusionCharts 2D面积图
- HighCharts之2D含有负值的面积图
- HighCharts之2D数值带有百分数的面积图
- FusionChart实现漏斗图
- FusionChart
- FusionChart
- fusionchart
- FusionChart
- FusionChart
- FusionChart
- FusionChart
- Fusionchart
- FusionChart
- D重叠面积
- WCF把书读薄(3)——数据契约、消息契约与错误契约
- 在各个平台上关于数据类型的定义
- 异步加载图片
- Spring 3.0 注解注入详解
- POJ-1951-Extra Krunch
- FusionChart 2D面积图
- Java获取网页内容、图片、JavaScript和CSS文件工具类
- POJ-2271-HTML
- GIT版本升级
- Immutable Collections(3)Immutable List实现原理(中)变化中的不变
- linux中shell变量$#,$@,$0,$1,$2的含义解释
- POJ-2272-Bullseye
- 插入排序
- 进程和线程的区别