ColdFusion MX 1/3

1 Introduction
Since ColdFusion (CF) was acquired by Macromedia, MM has upgraded its CF application in FLASH to a new level. Using CF, it can be dynamically integrated with FLASH. The longest use is HARPOON, but the role of CF in FLASH charts is rarely known. Today I want to talk about one of the most favored features of FLASH in CF, built-in charts.

First, we need tools to dynamically generate FLASH charts based on Macromedia Generator. Generator is the engine used by the FLASH output server to launch CF graphics. The general process of Generator plotting is:
1) CF transfers data to Generator
2) Generator converts the data into a chart and returns it to CF
3) output to the browser

Of course, you should not specifically install Generator, which is automatically installed when you install ColdFusion. If you have installed COLDFUSION, you can download this tutorial, which contains the databases and script files to be used in this article.

2. familiarization mark
The CF labels used for drawing are <CFGRAPH> and <CFGRAPHDATA>. <CFGRAPH> is used most of the time, while <CFGRAPHDATA> uses less than 1% of the time, so we only need to be familiar with <CFGRAPH>. First, we will introduce <CFGRAPH> several basic attribute fields.

<CFGRAPH> the following output parameters are required.
1. TYPE: the TYPE of the chart. There are five types: pie chart, column chart, line chart, bar chart, and area chart.
2. QUERY: Used to accept data transmitted by CF
3. VALUECOLUMN: The data query Column Used for plotting. For example, the total number of articles of a type.
4. FILEFORMAT: The format output by the browser. There are two formats: flash swf and JPG.

There are still some parameters, because they are not very important. We will introduce them one by one in subsequent practical applications.

Demonstration 3
This is the key point. You can download the database used in this tutorial. Do not create another database. In addition, the data source set for this database in CF is CFLASH.
My database design is relatively simple and I did it for this article. There are two tables in total: FILE and SORTFILE tables to store the TITLE of the article, details detail, article type SORT, of course, there is also an IDSORT that contains the type SORTID and name SORTNAME of the article.
The relationship between the two tables is: the SORT in the FILE is connected to the SORT query.

Let's start.

1. First, we create a query in CF, and then group and sort it. Of course you can skip sorting.
The content is as follows:

<Cfquery name = "wait" DATASOURCE = "cflash">
SELECT sortname, COUNT (*) AS Count
FROM sort, file
WHERE file. sort = sort. sortID
Group by sortname
Order by sortname
</CFQUERY>

The preceding QUERY queries the number of articles in each type.

2. After the query is completed, you can create a chart.

If you are not familiar with <CFGRAPH>, take a look at the basic types described above.

<CFGRAPH
TYPE = "Pie"
QUERY = "wait"
VALUECOLUMN = "Count"
ITEMCOLUMN = "sortname"
FILEFORMAT = "Flash"
TITLE = "The Pie"
Borderwidth = "0"
Depth = "10">
</CFGRAPH>

I will introduce that PIE is a PIE chart of the TYPE, and QUERY is the name of the previous QUERY in CF. VALUECOLUMN is used to query column data. My goal is to count the number of articles in each type. ITEMCOLUMN is the display label. Here I set the display SORTNAME and type name. FILEFORMAT is the output type. I chose FLASH here. If you want to display the image, you can change it to JPG. Borderwidth: This is the chart border, and 0 is the border. DEPTH: DEPTH. Do you want your chart to be a rigid plane chart? The setting can be more stereoscopic here.

Okay. Now we combine the above into a file. The source file is as follows:

<! Doctype html public "-// W3C // dtd html 4.01 Transitional // EN">
<! ---
Title: Make ColdFusion FLASH <1>
Author: wait (parole@163.net)
Description: Graph Application
Date: November, 11 2002
--->
<! --- Query database --->
<Cfquery name = "wait" DATASOURCE = "cflash">
SELECT sortname, COUNT (*) AS Count
FROM sort, file
WHERE file. sort = sort. sortID
Group by sortname
Order by sortname
</CFQUERY>

<Html>
<Head>
<Title> Use ColdFusion for FLASH </title>
</Head>
<Body>
<Center> <Hr>
<Center>
<! --- The following lists the applications of various attributes --->
<CFGRAPH
TYPE = "Pie"
QUERY = "wait"
VALUECOLUMN = "Count"
ITEMCOLUMN = "sortname"
FILEFORMAT = "Flash"
TITLE = "The Pie"
Borderwidth = "0"
Depth = "10">
</CFGRAPH>
<HR>
<Center> <B> Power by ColdFusion </B> <br> <fontsize = "-1"> COPYRIGHT (C) 2002 <a href = "MAILTParole@163.net"> wait </A>. all Rights Reserved. </font> </center>
</Body>
</Html>

Code copy box

The following is a reference clip: <! Doctype html public "-// W3C // dtd html 4.01 Transitional // EN"> <! --- Title: Make ColdFusion FLASH <1> Author: wait (parole@163.net) Description: Graph Application Date: November, 11 2002 ---> <! --- Query database ---> <Cfquery name = "wait" DATASOURCE = "cflash"> SELECT sortname, COUNT (*) AS Count FROM sort, file WHERE file. sort = sort. sortID Group by sortname Order by sortname </CFQUERY> <Html> <Head> <Title> Use ColdFusion for FLASH </title> </Head> <Body> <Center> <Hr> <Center> <! --- The following lists the applications of various attributes ---> <CFGRAPH TYPE = "Pie" QUERY = "wait" VALUECOLUMN = "Count" ITEMCOLUMN = "sortname" FILEFORMAT = "Flash" TITLE = "The Pie" Borderwidth = "0" Depth = "10"> </CFGRAPH> <HR> <Center> <B> Power by ColdFusion </B> <br> <fontsize = "-1"> COPYRIGHT (C) 2002 <a href = "MAILTParole@163.net"> wait </A>. all Rights Reserved. </font> </center> </Body> </Html>

The image is shown as follows:

Each type is displayed in proportion, which is a pie chart.
Of course, you only need to change the TYPE to another graph, for example, the line chart that I always wanted.
The following are four common examples.

Is it interesting? The chart proportion is dynamically formed based on the actual proportion of our database. What effect do you want? You can change it based on your needs, such as the background color, Font, and font. Note that Chinese characters are not supported [maybe I am ignorant]. If it is not the expected effect, please go on tomorrow. Tomorrow, we will link it on the pie chart to truly achieve dynamic charts. Note: the source code and tutorial downloaded today do not include the ones to be mentioned tomorrow (not written yet), but the database will not change.

All rights reserved. For more information, please notify me in advance.
Parole@163.net