`

FCF学习笔记二

阅读更多
   前面写了第一个FCF应用,可以发现页面的代码量非常大,这一点在应用中,是非常不合理的,为此,FCF为我们封装了一些列的数据,使得我们可以方便构造一个漂亮的Chart图。好了,直接上代码:

<%@ 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">
<script type="text/javascript" src="js/FusionCharts.js"></script>
<title>销售额度柱形图</title>
</head>
<body bgcolor="#fffff">
<!-- 第一个chart图 -->
<div id="chartdiv" align="center">
存放fusionChartsdiv区域1
</div>
<script type="text/javascript">
var myCharts = new FusionCharts("FusionCharts/Column3D.swf","chartsId1","400","300");
myCharts.setDataURL("data/Data.xml");
myCharts.render("chartdiv");
</script>

<!-- 第二个chart图 -->
<div id="chartdiv1" align="center">
存放fusionChartsdiv区域2
</div>
<script type="text/javascript">
var myChart1 =new FusionCharts("FusionCharts/Pie3D.swf","chartsId2","400","300");
myChart1.setDataURL("data/Data.xml");
myChart1.render("chartdiv1");
</script>

<!-- 第三个chart图 -->
<div id="chartdiv2" align="center">
存放fusionCharts区域3
</div>
<script type="text/javascript">
var myChart2 = new FusionCharts("FusionCharts/Line.swf","chartsId3","400","300");
myChart2.setDataURL("data/Data.xml");
myChart2.render("chartdiv2");
</script>
</body>
</html>


上面是一个拥有三个chart图的页面
简单梳理下实现过程:
1、首先要将js文件(FusionCharts.js)cp到项目中,并正确引入到页面中;
2、创建一个div,用于渲染chart图;
3、在div后构建一段js代码,在其中要做的工作有:创建一个FusionCharts对象,并且设置其构造参数(包括引入的SWF文件位置、该chart图的id、长与宽);
4、设置data数据的来源(URL);
5、设置渲染的div(指定id)。
分享到:
评论

相关推荐

    FCF_Column2D

    zgraphix/public/FusionCharts/FCF_Column2D.swf. Fetching contributors… Cannot retrieve contributors at this time. Raw History. executable file 18.9 KB.

    Haslam_UCP_FCF_3.0

    2. **数据库层通知应用层处理**:这种方式中,数据库通过发送特定的消息通知应用层,使其能够自行处理故障情况。 这两种方案的核心在于透明的应用程序连接管理和快速恢复机制。 - **透明应用程序失败(TAF, ...

    What's the difference between TAF and FCF

    透明应用故障切换(TAF)和快速连接故障切换(FCF)是两种在高可用性环境中用于处理数据库连接故障的机制。它们都是Oracle数据库提供的功能,以确保在系统出现故障时,应用程序能够继续运行,而不会中断服务。下面将...

    ASP.NET统计图FCF

    2. **高度自定义**:FCF允许开发者自定义图表的颜色、大小、字体、轴标签、图例、数据点等几乎每一个细节,以实现个性化的设计。 3. **交互性**:FCF图表可以响应用户的交互,如点击、悬浮、拖拽等,为用户提供更...

    FCF-621CT电压采集模块Modbuspull调试.rar

    Modbus是一种串行通信协议,是Modicon公司(现在的施耐德电气 Schneider Electric)于1979年为使用可编程逻辑控制器(PLC)通信而发表。Modbus已经成为工业领域通信协议的业界标准(De facto),并且现在是工业电子设备...

    FCF全部的SWF96个

    标题 "FCF全部的SWF96个" 暗示了这可能是一个包含96个SWF(ShockWave Flash)文件的集合。SWF是一种用于在Web上展示交互式内容,如动画、游戏和应用程序的文件格式。这些文件通常与Adobe Flash相关,一个曾经非常...

    FusionChartsFree示例工程加FCF教程

    ### FCF教程学习 FCF教程将引导您逐步掌握使用技巧,从基础概念到高级应用,包括: 1. **快速入门**:介绍基本的图表创建流程和必需的文件。 2. **图表类型**:详细讲解每种图表的特点和应用场景。 3. **数据管理*...

    构造基于FCF的财务战略体系课件.pptx

    二、基于FCF的管控体系 1. 经营活动管控:优化运营流程,提高效率,减少非必要的现金流出,增加经营活动现金流。同时,强化应收账款管理和库存控制,确保资金回笼。 2. 投资活动管控:理性投资,优先选择能带来...

    PB115_FCF源码_pb动态图表源码_

    2. **数据绑定**:源码中可能包含了将PB的数据源(如数据库查询结果)绑定到Flash图表上的方法。这涉及到数据的提取、转换和传递,以及在Flash中解析和渲染数据。 3. **图表类型**:描述中提到有10种不同的图表格式...

    科技行业美股科技巨头系列报告7:奈飞,规模效应持续凸显,FCF拐点临近.rar

    2. 收入增长:Netflix的订阅收入随着全球用户基数的扩大而稳步增长,这将有助于提高FCF。 3. 利润率提升:随着规模效应的发挥,Netflix的运营效率不断提升,利润率有望进一步提高,为FCF的改善提供动力。 报告还...

    FCF

    NULL 博文链接:https://self4j.iteye.com/blog/812259

    FusionCharts Free简介(FCF)

    通过阅读源码,开发者可以了解其内部工作原理,学习图表绘制的最佳实践,甚至可以根据需求进行二次开发。 在实际项目中,FusionCharts Free通常与其他开发工具集成,如IDEs(如Visual Studio Code、Eclipse)、版本...

    60fcf3ccd9a2ebc9e432ffb5cb91638b-ippicv_2017u2_win_ia32_20170418

    标题 "60fcf3ccd9a2ebc9e432ffb5cb91638b-ippicv_2017u2_win_ia32_20170418" 提供的是一个特定版本的 IPPICV(Intel Performance Primitives Image Processing Library for Computer Vision)软件包,适用于 Windows...

    59577493-e5e4-4687-9c40-4fcf86.html

    59577493-e5e4-4687-9c40-4fcf86.html

    具有D2D通讯的蜂窝系统中FCF中继的性能

    2. **功率效率**:D2D通信缩短了信号传输路径,降低了发射功率需求;FCF中继策略中的喷泉编码技术能够根据接收方实际需求动态调整数据包数量,减少了不必要的能量消耗。 综上所述,本文提出了一种基于D2D通信的FCF...

    FreeRDP-FreeRDP-1.0.1-217-gc0fcf6a.zip_FreeRDP_freerdp安卓下载_remot

    2. **跨平台**:FreeRDP设计时考虑到了不同操作系统的兼容性,允许用户在Android手机或平板上实现与桌面系统的无缝连接。这使得用户可以在外出时也能方便地处理办公任务或者进行远程技术支持。 3. **自定义配置**:...

    A312.1.0R7综合补丁包sp34_92de0f16-7555-4321-bfeb-6cd1a6b0fcf3.zip

    A312.1.0R7综合补丁包sp34_92de0f16-7555-4321-bfeb-6cd1a6b0fcf3.zip A3 补丁

    选择哥伦比亚FCF表「Seleccion Colombia FCF Tab」-crx插件

    要删除它,您有2个简单的选项:-在地址栏中输入chrome:// extensions,向下滚动并删除它-转到chrome,设置,扩展名,向下滚动并删除它。 免责声明:这个不错的扩展是由粉丝完成的。 商标属于其各自所有者。 支持...

Global site tag (gtag.js) - Google Analytics