惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

J
Java Code Geeks
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
S
SegmentFault 最新的问题
博客园 - 三生石上(FineUI控件)
Hugging Face - Blog
Hugging Face - Blog
博客园 - Franky
云风的 BLOG
云风的 BLOG
I
InfoQ
小众软件
小众软件
Last Week in AI
Last Week in AI
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
大猫的无限游戏
大猫的无限游戏
A
About on SuperTechFans
Stack Overflow Blog
Stack Overflow Blog
The Cloudflare Blog
雷峰网
雷峰网
P
Proofpoint News Feed
腾讯CDC
H
Help Net Security
V
Visual Studio Blog
美团技术团队
F
Fortinet All Blogs
MongoDB | Blog
MongoDB | Blog
阮一峰的网络日志
阮一峰的网络日志

博客园 - spoony

Flex4 Skinning 4: 留言板示例 Flex4 Skinning 2: 皮肤协议 Flex4 Skinning 1: 自定义一个简单按钮的皮肤 Air应用程序访问本地数据库 [通篇转载]调程序的小女孩 Adobe ColdFusion Reports(5) Adobe ColdFusion Reports(4) Adobe ColdFusion Reports(3) Adobe ColdFusion Reports(2) Adobe ColdFusion Reports(1) Adobe ColdFusion Charts(2) Adobe ColdFusion Charts(1) Adobe ColdFusion读写Microsoft Office Excel数据(3) Adobe ColdFusion读写Microsoft Office Excel数据(2) Adobe ColdFusion读写Microsoft Office Excel数据(1) Flex与DotNET WebService交互(2) Flex与DotNET WebService交互(1) Ext JS Designer 1.0.5 发布 设置Flex Builder中FlashPlayer调试版本 - spoony - 博客园
Adobe ColdFusion Charts(3)
spoony · 2010-02-08 · via 博客园 - spoony

  作为查询分析的图表大多数情况下是全局的笼统概括的,它能够给使用者以直观的形式产生对总体进行把握的信息。但图表的功能不应仅限于此,当使用者对某个具体部分或某个具体数字感兴趣的时候,他应该可以对这个部分或数字进行进一步详细分析,因此图表中最好有钻取功能以满足需求。

  实现钻取功能最直观的想法就是通过链接传递参数到相关联的查询中来返回对应的信息。在ColdFusion中也是这样做的。你可以在图表的进行单击操作来获取详细信息,实现这一功能只需要设置好cfchart标签的url属性。url属性中的参数等信息可以通过ColdFusion的内置变量来传递。

典型的一个链接如下:

url=”moreinfo.cfm?series=$SERIESLABEL$&item=$ITEMLABEL$&value=$VALUE$”

  三个内置变量分别代表了当前数据组标签,当前项标签,当前值。

  下面通过一个具体示例来进行演示。

  首先创建一个详细信息页面,salary_details.cfm. 此页面实现根据给定的参数信息进行详细信息的查询操作。

<!--- Get data from database with the specified DEPARTMENT --->
<cfquery name="GetSalaryDetails" datasource="cfdocexamples">
	SELECT 
		APP.DEPARTMT.DEPT_NAME,
		APP.EMPLOYEE.FIRSTNAME,
		APP.EMPLOYEE.LASTNAME,
		APP.EMPLOYEE.STARTDATE,
		APP.EMPLOYEE.SALARY,
		APP.EMPLOYEE.CONTRACT
	FROM
		APP.EMPLOYEE,
		APP.DEPARTMT
	WHERE
		APP.DEPARTMT.DEPT_ID = APP.EMPLOYEE.EMP_ID
		AND
		APP.DEPARTMT.DEPT_NAME = '#URL.Item#'
	ORDER By
		APP.EMPLOYEE.LASTNAME,
		APP.EMPLOYEE.FIRSTNAME
</cfquery>

<html>
	<head>
		<title>Employee Salary Details</title>
	</head>
	
	<body>
		<h1>
			<cfoutput>
				#GetSalaryDetails.DEPT_NAME[1]# Department	Salary Details
			</cfoutput>
		</h1>
		
		<table border cellspacing="0" cellpadding="5">
			<tr>
				<th>Employee Name</th>
				<th>StartDate</th>
				<th>Salary</th>
				<th>Contact?</th>
			</tr>		
			<cfoutput query="GetSalaryDetails">
				<tr>
					<td>#FIRSTNAME# #LASTNAME#</td>
					<td>#DATEFORMAT(STARTDATE, "mm/dd/yyyy")#</td>
					<td>#NUMBERFORMAT(SALARY, "$999,999")#</td>
					<td>#CONTRACT#</td>
				</tr>
			</cfoutput>
		</table>
	</body>
</html>

  然后定义概括信息页面,salarydetail.cfm. 代码同以前的图表页面一致,只不过要设置cfchart的url属性。

<!--- Get the raw data from the database --->
<cfquery name="GetSalaries" datasource="cfdocexamples">
	SELECT APP.DEPARTMT.DEPT_NAME,
		APP.EMPLOYEE.STARTDATE,
		APP.EMPLOYEE.SALARY
	FROM APP.DEPARTMT, APP.EMPLOYEE
	WHERE APP.DEPARTMT.DEPT_ID = APP.EMPLOYEE.DEPT_ID
</cfquery>

<!--- Generate a query with statistical data for each department. --->
<cfquery dbtype="query" name="DeptSalaries">
	SELECT 
		DEPT_NAME,
		AVG(SALARY) AS AvgByDept
	FROM GetSalaries
	GROUP BY DEPT_NAME
</cfquery>

<!--- Reformat the generated numbers to show only thousands. --->
<cfloop index="i" from="1" to="#DeptSalaries.recordcount#">
	<cfset DeptSalaries.AvgByDept[i]=Round(DeptSalaries.AvgByDept[i]/1000)*1000>
</cfloop>

<!--- Convert start date to start year. --->
<!--- Convert the date to a number for the query to work. --->
<cfloop index="i" from="1" to="#GetSalaries.recordcount#">
	<cfset GetSalaries.STARTDATE[i]=NumberFormat(DatePart("yyyy",GetSalaries.STARTDATE[i]),9999)>
</cfloop>

<!--- Query of queries for average salary by start year. --->
<cfquery dbtype="query" name="HireSalaries">
	SELECT 
		StartDate,
		AVG(Salary) AS AvgByStart
	FROM
		GetSalaries
	GROUP BY
		StartDate
</cfquery>

<!--- Round average salaries to thousands. --->
<cfloop index="i" from="1" to="#HireSalaries.recordcount#">
	<cfset HireSalaries.AvgByStart[i]=Round(HireSalaries.AvgByStart[i]/1000)*1000>
</cfloop>

<html>
	<head>
		<title>Employee Salary Analysis</title>
	</head>
	
	<body>
		<h1>Employee Salary Analysis</h1>
		
		<!--- Pie chart, from DeptSalaries Query of Queries. --->
		<cfchart
				font="Times"
				fontbold="true"
				backgroundcolor="##CCFFFF"
				show3d="yes"
				url="salary_details.cfm?Item=$ITEMLABEL$"
			>
			
			<cfchartseries 
					type="pie"
					query="DeptSalaries"
					valueColumn="AvgByDept"
					itemcolumn="Dept_Name"
					colorlist="##990066,##660099,##006699,##069666"
				/>	
		</cfchart>
		
	</body>
</html>

         在浏览器中浏览,效果如图1,图2.

图 1

图 2

         功能可以实现,效果也很好。但是仔细观察可以发现传递的参数信息是具体的标签,而在实际应用中我们的查询操作一般情况下都会使用编码作为参数,这样既可以保障唯一性,就可以避免由于数据格式不一致造成的错误。因此实际应用中我们还需要对这个参数传递进行进一步加工,笔者在这里不再深究。

         前面三篇随笔只是对ColdFusion Charts做了一个最简单的介绍,还有很多东西值得挖掘,尤其是图标的外观样式。这在以后的关于报表的随笔中还要提到。

         Enjoy!