`
iehyou
  • 浏览: 136477 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

[AJava]FusionCharts Free中文开发指南[使用文档教程]第十四章--在JSP里使用FCF

    博客分类:
  • web
阅读更多
前面我们讲的例子里,都是采用HTML或JavaScript来显示图形,这是一种最基本的使用方法。FCF还提供了一些其他的方法来显示图形,有PHP、ASP、JSP等等。不过,有点要说明的是,这些方法其实都是基本使用方法的一种变形,它们最终其实都是在页面上输出HTML或JavaScript。因此,如果你觉得采用HTML或JavaScript就足够了,那就不需要阅读本章了。

我们来看个例子吧。
这是XML数据代码:


<graph caption='Monthly Unit Sales' xAxisName='Month' yAxisName='Units' decimalPrecision='0' formatNumberScale='0'>   
    <set name='Jan' value='462' color='AFD8F8' />   
    <set name='Feb' value='857' color='F6BD0F' />   
    <set name='Mar' value='671' color='8BBA00' />   
    <set name='Apr' value='494' color='FF8E46' />   
    <set name='May' value='761' color='008E8E' />   
    <set name='Jun' value='960' color='D64646' />   
    <set name='Jul' value='629' color='8E468E' />   
    <set name='Aug' value='622' color='588526' />   
    <set name='Sep' value='376' color='B3AA00' />   
    <set name='Oct' value='494' color='008ED6' />   
    <set name='Nov' value='761' color='9D080D' />   
    <set name='Dec' value='960' color='A186BE' />   
</graph>   


这个是JSP代码:


<HTML>   
    <HEAD>   
        <TITLE>FusionCharts Free - Simple Column 3D Chart</TITLE>   
        <style type="text/css">   
        <!--    
        body {    
        font-family: Arial, Helvetica, sans-serif;    
        font-size: 12px;    
        }    
        -->   
        </style>   
    </HEAD>   
    <BODY>   
        <CENTER>   
            <h2><a href="http://www.fusioncharts.com" target="_blank">FusionCharts Free</a> Examples</h2>   
            <h4>Basic example using pre-built Data.xml</h4>   
            <%    
           
            //Create the chart - Column 3D Chart with data from Data/Data.xml    
            %>     
            <jsp:include page="../Includes/FusionChartsHTMLRenderer.jsp" flush="true">     
                <jsp:param name="chartSWF" value="../../FusionCharts/FCF_Column3D.swf" />     
                <jsp:param name="strURL" value="Data/Data.xml" />     
                <jsp:param name="strXML" value="" />     
                <jsp:param name="chartId" value="myFirst" />     
                <jsp:param name="chartWidth" value="600" />     
                <jsp:param name="chartHeight" value="300" />     
                <jsp:param name="debugMode" value="false" />     
            </jsp:include>   
   
            <BR>   
            <BR>   
            <a href='../NoChart.html' target="_blank">Unable to see the chart    
            above?</a>   
            <BR><H5 ><a href='../default.htm'>« Back to list of examples</a></h5>   
        </CENTER>   
    </BODY>   
</HTML>   


我们可以看到,上例中采用了jsp的include标签,包含了一个叫FusionChartsHTMLRenderer.jsp的JSP页面,它接受一些参数,用来加载数据或控制图形,debugMode必须是flase,因为在FCF里是没有调试功能的。这个JSP页面最终输出的是一段采用HTML来加载图形的代码。它就在下载包 > Code > JSP > Includes文件夹里。

还有另外一个JSP--FusionChartsRenderer.jsp,它输出的是一段采用JavaScript来加载图形的代码。下面是它的使用代码:

<HTML>   
    <HEAD>   
        <TITLE>FusionCharts Free - Simple Column 3D Chart</TITLE>   
        <SCRIPT LANGUAGE="Javascript" SRC="../../FusionCharts/FusionCharts.js"></SCRIPT>   
        <style type="text/css">   
        <!--    
        body {    
        font-family: Arial, Helvetica, sans-serif;    
        font-size: 12px;    
        }    
        -->   
        </style>   
    </HEAD>   
    <BODY>   
        <CENTER>   
            <h2><a href="http://www.fusioncharts.com" target="_blank">FusionCharts Free</a> Examples</h2>   
            <h4>Embedding chart using FusionCharts JavaScript class and using dataURL method.</h4>   
            <%    
   
            //Create the chart - Column 3D Chart with data from Data/Data.xml    
   
            %>     
            <jsp:include page="../Includes/FusionChartsRenderer.jsp" flush="true">     
                <jsp:param name="chartSWF" value="../../FusionCharts/FCF_Column3D.swf" />     
                <jsp:param name="strURL" value="Data/Data.xml" />     
                <jsp:param name="strXML" value="" />     
                <jsp:param name="chartId" value="myFirst" />     
                <jsp:param name="chartWidth" value="600" />     
                <jsp:param name="chartHeight" value="300" />   
                <jsp:param name="debugMode" value="false" />     
                <jsp:param name="registerWithJS" value="false" />   
            </jsp:include>   
            <BR>   
            <BR>   
            <a href='../NoChart.html' target="_blank">Unable to see the chart above?</a><BR><H5 ><a href='../default.htm'>« Back to list of             examples</a></h5>   
        </CENTER>   
    </BODY>   
</HTML>   
  

debugMode和registerWithJS必须是flase,因为在FCF里是没有这两个功能的。

上面两个页面,显示的图形是一样的:


图片1

结束语关于FCF的使用,到这里基本就结束了,大家在阅读练习的过程中,如果发现文章有什么错误,或者是你遇到了一些问题,都可以和我联系,联系方式是:QQ:634369863。FCF论坛:AJava Ask。此教程的官方网站是AJava。

分享到:
评论

相关推荐

    FusionCharts Free开发文档

    FusionCharts Free开发文档 FusionCharts Free是InfoSoft Global公司开发的基于Flash的图表组件,提供跨平台、跨浏览器的解决方案,能够生成交互式的动态图表。下面是FusionCharts Free开发文档的详细知识点: 一...

    FusionCharts Free中文开发指南[使用文档教程](配图)

    FusionCharts Free 的最新版本v2.1带来了若干改进,包括对JSP和Ruby on Rails的集成支持、FusionCharts DOM的优化、.Net使用代码和文档的更新、新的PHP API、对双引号的支持以及UTF-8编码的示例。所有这些改进旨在...

    FusionCharts Free中文开发指南

    ### FusionCharts Free中文开发指南知识点概述 #### 一、FusionCharts Free简介 - **定义与特点**:FusionCharts Free是一款跨平台、跨浏览器的Flash图表组件解决方案,支持多种编程环境,包括ASP.NET、ASP、PHP、...

    FusionCharts Free中文开发指南 (完全版)

    《FusionCharts Free中文开发指南 (完全版)》是一份详尽的教程,旨在帮助开发者掌握FusionCharts Free这款强大的图表生成工具。FusionCharts Free是一款JavaScript库,它能够为Web应用程序提供丰富的交互式图表,...

    FusionCharts Free中文开发指南.doc

    ### FusionCharts Free中文开发指南知识点概述 #### 一、FusionCharts Free简介 - **定义与功能**:FusionCharts Free是一款免费版本的数据可视化工具,主要用于网页应用中展示各种图表,支持多种图表类型如柱状图...

    FusionCharts Free中文开发指南第二版

    《FusionCharts Free中文开发指南第二版》详细解析 **一、FusionCharts Free概览** FusionCharts Free是一款功能强大的免费Flash图形解决方案,适用于Web应用程序的报表制作。该工具支持多种图表类型,包括3D/2D...

    FusionCharts Free中文开发指南.rar

    **FusionCharts Free中文开发指南** FusionCharts是一款强大的数据可视化工具,专为创建交互式图表和图形而设计。FusionCharts Free是其免费版本,适用于个人和非商业项目,提供了一系列基本图表类型,帮助开发者将...

    FusionCharts Free中文开发指南.pdf

    FusionCharts Free 中文开发指南,不要钱,喜欢的下!

    FusionCharts_Free中文开发指南

    ### FusionCharts_Free中文开发指南知识点总结 #### 一、FusionCharts_Free简介 - **概述**:FusionCharts_Free是一款由InfoSoft Global公司提供的免费版图表组件,支持跨平台、跨浏览器的应用,适用于多种开发...

    《FusionCharts Free中文开发指南》

    **FusionCharts Free中文开发指南**是一本专为开发者准备的详细教程,旨在帮助读者深入理解和熟练使用FusionCharts Free这款强大的图表库。FusionCharts是一款基于JavaScript和Flash的交互式图表解决方案,它能轻松...

    FusionCharts Free简介(FCF)

    提供的文档“FusionCharts_free_使用手册.docx”是FusionCharts Free的官方使用指南,包含了详细的功能介绍、API参考、示例代码以及故障排查等内容。新手开发者应首先查阅此手册,以便快速掌握FusionCharts Free的...

Global site tag (gtag.js) - Google Analytics