`
wang371134086
  • 浏览: 127100 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

fusioncharts简单实用示例+超全SWF文件

fusioncharts甘特图 
阅读更多

Index.jsp代码如下：

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

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

   <head>

      <title>My First FusionCharts</title>

   </head>

   <body bgcolor="#ffffff">

      <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="900" height="300" id="Column3D" >

         <param name="movie" value="FusionCharts/Column3D.swf" />

         <param name="FlashVars" value="&dataURL=Data/Data.xml">

         <param name="quality" value="high" />

         <embed src="FusionCharts/Column3D.swf" flashVars="&dataURL= Data/Data.xml" quality="high" width="900" height="300" name="Column3D" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />

      </object>

</body>

</html>

只用了解标记的参数就可以了。其中Column3D.swf是显示flash需要用到的文件，在Fusion Charts的资源包中，Data.xml是flash显示数据的数据源。

 

 

 

 

 

 

要导入的文件：

Data.xml文件如下：

<chart caption='Monthly Sales Summary' subcaption='For the year 2006' xAxisName='Month' yAxisName='Sales' numberPrefix='$'>

    <set label='January' value='17400' />

    <set label='February' value='19800' />

    <set label='March' value='21800' />

    <set label='April' value='23800' />

    <set label='May' value='29600' />

    <set label='June' value='27600' />

    <set label='July' value='31800' />

    <set label='August' value='39700' />

    <set label='September' value='37800' />

    <set label='October' value='21900' />

    <set label='November' value='32900' />

    <set label='December' value='39800' />

</chart>

向项目中加入以上代码后生成的flash报表如下：

 

 

2.示例二

Index2.jsp代码如下：

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

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

   <head>

      <title>My First FusionCharts</title>

      <script language="JavaScript" src="FusionCharts/FusionCharts.js"></script>

    

   </head>

   <body bgcolor="#ffffff">

   <div id="chartdiv" align="center">

    <script type="text/javascript">

          var chart = new FusionCharts("FusionCharts/Bar2D.swf", "ChartId", "500", "350", "0", "0");

          chart.setDataURL("Data/Data2.xml");       

          chart.render("chartdiv");

    </script>

   </div>

</body>

</html>

 

Data2.xml如下：

<chart caption="zjshuai" xAxisName="Month" yAxisName="Units" showValues="0" decimals="0" formatNumberScale="0" chartRightMargin="30">

  <set label="Jan" value="462" />

  <set label="Feb" value="857" />

  <set label="Mar" value="671" />

  <set label="Apr" value="494" />

  <set label="May" value="761" />

  <set label="Jun" value="960" />

  <set label="Jul" value="629" />

  <set label="Aug" value="622" />

  <set label="Sep" value="376" />

  <set label="Oct" value="494" />

  <set label="Nov" value="761" />

  <set label="Dec" value="960" />

</chart>

生成的flash报表如下：

 

 

 

     //myChart.setDataXML(strChart);

     myChart.render("chartdiv");

    </script>   </td>

   </tr>

   <tr>

     <td align="center">

       <%

           String strChart = "";

           strChart += "<?xml version='1.0' encoding= 'gb2312'?>";

           strChart += "<chart dateFormat='yyyy/mm/dd'  ganttWidthPercent='85' canvasBorderColor='999999' canvasBorderThickness='0' gridBorderColor='4567aa' gridBorderAlpha='20' showSlackAsFill='1' slackFillColor='eeeeee' ganttPaneDuration='30' ganttPaneDurationUnit='d'>";

           strChart += "<categories bgColor='ffffff' fontColor='1288dd' fontSize='12' align='center'>";

               strChart += "<category start='2011/10/17' end='2011/11/01' label='October'/>";

               strChart += "<category start='2011/11/01' end='2011/11/05' label='November'/>";

            strChart += "</categories>";

            strChart += "<categories bgColor='ffffff' fontColor='1288dd' isBold='0'>";

               strChart += "<category start='2011/10/17' end='2011/10/18' label='17' />";

               strChart += "<category start='2011/10/18' end='2011/10/19' label='18' />";

               strChart += "<category start='2011/10/19' end='2011/10/20' label='19' />";

               strChart += "<category start='2011/10/20' end='2011/10/21' label='20' />";

               strChart += "<category start='2011/10/21' end='2011/10/22' label='21' />";

               strChart += "<category start='2011/10/22' end='2011/10/23' label='22' />";

               strChart += "<category start='2011/10/23' end='2011/10/24' label='23' />";

               strChart += "<category start='2011/10/24' end='2011/10/25' label='24' />";

               strChart += "<category start='2011/10/25' end='2011/10/26' label='25' />";

               strChart += "<category start='2011/10/26' end='2011/10/27' label='26' />";

               strChart += "<category start='2011/10/27' end='2011/10/28' label='27' />";

               strChart += "<category start='2011/10/28' end='2011/10/29' label='28' />";

               strChart += "<category start='2011/10/29' end='2011/10/30' label='29' />";

               strChart += "<category start='2011/10/30' end='2011/10/31' label='30' />";

               strChart += "<category start='2011/10/31' end='2011/11/01' label='31' />";

               strChart += "<category start='2011/11/01' end='2011/11/02' label='1' />";

               strChart += "<category start='2011/11/02' end='2011/11/03' label='2' />";

               strChart += "<category start='2011/11/03' end='2011/11/04' label='3' />";

               strChart += "<category start='2011/11/04' end='2011/11/05' label='4' />";

            strChart += "</categories>";

            strChart += "<processes headerText='里程碑' fontColor='000000' fontSize='12' isAnimated='1' bgColor='4567aa' headerVAlign='middle' headerAlign='left' headerbgColor='4567aa' headerFontColor='ffffff' headerFontSize='12' align='left' isBold='1' bgAlpha='25'>";

               strChart += "<process label='张三' id='1134' />";

               strChart += "<process label='李四' id='1135' />";

            strChart += "</processes>";

            strChart += "<dataTable showProcessName='1' nameAlign='left' fontColor='000000' fontSize='10' vAlign='right' align='center' headerVAlign='bottom' headerAlign='left' headerbgColor='4567aa' headerFontColor='ffffff' headerFontSize='10'>";

            strChart += "</dataTable>";

            strChart += "<tasks >";

               strChart += "<task label='Plan' toolText='Progress:100.00%;TaskTime:2011/10/18To2011/10/19' processId='1134' start='2011/10/18' end='2011/10/20' id='1134-1' color='ffc20e' height='32%' topPadding='12%'  percentComplete='100.00' /> ";

               strChart += "<task label='Actual' toolText='Progress:10.0%;TaskTime:2011/10/18To2011/10/25' processId='1134' start='2011/10/18' end='2011/10/26' id='1134' color='ff938e'  alpha='100' topPadding='56%' height='32%'  percentComplete='10.0' />";

               strChart += "<task label='Plan' toolText='Progress:100.00%;TaskTime:2011/10/18To2011/10/19' processId='1135' start='2011/10/18' end='2011/10/20' id='1135-1' color='ffc20e' height='32%' topPadding='12%'  percentComplete='100.00' />";

               strChart += "<task label='Actual' toolText='Progress:100.0%;TaskTime:2011/10/18To2011/10/18' processId='1135' start='2011/10/18' end='2011/10/19' id='1135' color='92d5ff' alpha='100' topPadding='56%' height='32%' percentComplete='100.0' /> ";

            strChart += "</tasks>";

            strChart += "<legend>";

               strChart += "<item label='Plan' color='ffc20e' />";

               strChart += "<item label='Normal' color='#bdebac' />";

               strChart += "<item label='Advance' color='#92d5ff' />";

               strChart += "<item label='Lag' color='#ff938e' />";

            strChart += "</legend>";

            strChart += "<styles>";

              strChart += "<definition>";

                  strChart += "<style type='Font' name='legendFont' size='12' />";

               strChart += "</definition>";

               strChart += "<application>";

                  strChart += "<apply toObject='LEGEND' styles='legendFont' />";

               strChart += "</application>";

            strChart += "</styles>";

            strChart += "</chart>";

            FusionChartsCreator fusionChartsCreator = new FusionChartsCreator();

            fusionChartsCreator.strToXml(strChart);

            //String chartHTMLCode=FusionChartsCreator.createChartHTML("FusionCharts/Gantt.swf", "", strChart, "myFirst", 800, 300, false);      

        %>

        <%--

        <%=chartHTMLCode%>

         --%>

         <div id="chartdiv1" align="center" class="text">

        </div>

        <script type="text/javascript">

            var myChart = new FusionCharts("FusionCharts/Gantt.swf", "myChartId", "800", "300", "0", "0");

            myChart.setDataURL("Data/Gantt1.xml");

            //myChart.setDataXML(strChart);

            myChart.render("chartdiv1");

        </script>  

    </td>

   </tr>

</table>

</body>

</html>

 

----------------------------------------------------------

附：

一个学习fusioncharts很好的blog

http://blog.sina.com.cn/s/articlelist_1463420203_7_1.html

-----------------------

附件为一些swf文件，相对比较全（gallery.rar为甘特图的swf文件）

示例是随便以前写的，不怎么好，但是附件可能会对你有帮助！

分享到：
评论
2 楼 wang371134086 2013-02-20  
laersheng 写道
木有MSSpline.swf，不过还是谢谢提供这么多的swf文件

1 楼 laersheng 2013-01-28  
木有MSSpline.swf，不过还是谢谢提供这么多的swf文件
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    FusionCharts 46个破解swf及示例

    里面有一个demo.asp把里面的swf列表，点击后在右侧出现swf效果，在文件夹里找跟swf一样名称的xml文档就可以找到示例。 里面共有46个破解swf文件，45个xml示例文档 文件列表： #Area2D.swf; #Bar2D.swf; #Bubble....

    FusionCharts画示例图

    FusionCharts 示例 API 以及说明文档

    FusionCharts（示例资源包）

    Fusioncharts是一个基于Flash的图表组件，可以用来提供数据驱动的动态图标，...提供交互式和强大的动态图标，fusioncharts充分利用流体美丽的Flash为模板，使用XML作为其数据接口，创造紧凑，互动和真正的动态图表。

    FusionCharts_ExportDemo

    FusionCharts 破解版swf文件，和导出图片示例!

    FusionCharts

    该压缩包中涵盖了FusionCharts V3.1与V3.2两个版本的39个例子，包括.SWF与XML文件，及对应的关系，超全，本人自测过，可以用的。

    FusionChartsXTV3.31SR2完整破解版

    一、说明： 1、Charts文件夹下包含65个文件，含JS...4、包含完整的FusionCharts XT使用说明文档（E文）各种swf文件的对象属性一览无余！！ 二、使用 解压缩之后，直接双击运行文件夹中的index.html即可看到指引菜单。

    FusionCharts-v3.1破解版

    基于Flash的跨平台图表组件，利用xml与swf文件结合，页面动态输出flash效果； 压缩包里面含有49个swf文件，包括常见的圆柱图、圆饼图、甘特图、3D线性图等等等（一般页面flash表现视图几乎能找到相似的）。...

    FusionCharts XT V3.3 破解版

    无水印版 1、Charts文件夹下包含65个文件，含JS文件。 2、可以正常运行演示Gallery中近400个示例。 3、包含Tools文件夹，可以...4、包含完整的FusionCharts XT使用说明文档（E文）各种swf文件的对象属性一览无余！！

    jQuery插件FusionCharts绘制ScrollColumn2D图效果示例【附demo源码下载】

    主要介绍了jQuery插件FusionCharts绘制ScrollColumn2D图效果,结合实例形式分析了jQuery使用FusionCharts插件结合swf文件实现ScrollColumn2D图的绘制功能,并附带demo源码供读者下载参考,需要的朋友可以参考下

    jQuery插件FusionCharts绘制的2D帕累托图效果示例【附demo源码】

    主要介绍了jQuery插件FusionCharts绘制的2D帕累托图效果,结合实例形式分析了jQuery使用FusionCharts插件载入xml数据及绘制2D帕累托图的具体实现技巧,并附带demo源码供读者下载参考,需要的朋友可以参考下

    jQuery插件FusionCharts实现的MSBar2D图效果示例【附demo源码】

    主要介绍了jQuery插件FusionCharts实现的MSBar2D图效果,结合实例形式分析了jQuery使用FusionCharts插件结合xml数据载入实现绘制MSBar2D图的相关实现技巧,并附带demo源码供读者下载,需要的朋友可以参考下

    Fusionchart.js

    fusionchart源码swf模板，方便报表和数据统计

Magicbox
Global site tag (gtag.js) - Google Analytics