CFCHARTSERIES  
Description

Used with the cfchart tag. This tag defines the chart style in which the data displays: bar, line, pie, and so on.

 
Category

Data output tags, Extensibility tags

 
Syntax
<cfchartseries 
   colorlist = "list">
   itemColumn="queryColumn"
   markerStyle="style"
   paintStyle="plain, raise, shade, light"
   query="queryName"
   seriesColor="Hex value or Web color" 
   seriesLabel="Label Text"
   type="type"
   valueColumn="queryColumn"
   dataLabelStyle="style"
</cfchartseries>
 
See also

cfchart, cfchartdata; Chapter 31, "Creating Charts and Graphs," in ColdFusion MX Developer's Guide

 
History

ColdFusion MX 7: Added the dataLabelStyle attribute and the horizontalbar chart type.

ColdFusion MX 6.1: Changed interpolation behavior: the tag now interpolates data points on line charts with multiple series.

ColdFusion MX: Added this tag.

 
Usage

For a pie chart, ColdFusion sets pie slice colors as follows:

  • If the seriesColor attribute is omitted, ColdFusion automatically determines the colors of the slices.
  • If the seriesColor attribute is specified, ColdFusion automatically determines the colors of the slices after the first one, starting with the specified color for the first slice.
 
Example
<!--- The following example analyzes the salary data in the cfdocexamples
database and generates a bar chart showing average salary by department. --->

<!--- Get the raw data from the database. --->
<cfquery name="GetSalaries" datasource="cfdocexamples">
SELECT Departmt.Dept_Name, 
Employee.Dept_ID, 
Employee.Salary
FROM Departmt, Employee
WHERE Departmt.Dept_ID = Employee.Dept_ID
</cfquery>

<!--- Use a query of queries to generate a new query with --->
<!--- statistical data for each department. --->
<!--- AVG and SUM calculate statistics. --->
<!--- GROUP BY generates results for each department. --->
<cfquery dbtype = "query" name = "DataTable">
SELECT 
Dept_Name,
AVG(Salary) AS avgSal,
SUM(Salary) AS sumSal
FROM GetSalaries
GROUP BY Dept_Name
</cfquery>

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

<h1>Employee Salary Analysis</h1> 
<!--- Bar graph, from Query of Queries --->
<cfchart format="flash" 
xaxistitle="Department" 
yaxistitle="Salary Average"> 

<cfchartseries type="bar" 
query="DataTable" 
itemcolumn="Dept_Name" 
valuecolumn="avgSal" />
</cfchart>
COLORLIST  
  Optional
 

Sets colors for each data point. Applies if the cfchartseries type attribute is pie, pyramid, area, horizontalbar, cone, cylinder, or step.

Comma-delimited list of hexadecimal values or supported, named web colors; see the name list and information about six- and eight-digit hexadecimal values in the cfchart Usage section.

For a hexadecimal value, use the form "##xxxxxx" or "##xxxxxxxx", where x = 0-9 or A-F; use two number signs or none.

ITEMCOLUMN  
  Required if query attribute is specified
 

Name of a column in the query specified in the query attribute; contains the item label for a data point to graph.
MARKERSTYLE  
  Optional
 
Default value: "rectangle"

Sets the icon that marks a data point for two-dimensional line, curve, and scatter graphs:

  • rectangle
  • triangle
  • diamond
  • circle
  • letter
  • mcross
  • snow
  • rcross
PAINTSTYLE  
  Optional
 
Default value: "plain"

Sets the paint display style of the data series:

  • plain: solid color.
  • raise: the appearance of a button.
  • shade: gradient fill, darker at the edges.
  • light: a lighter shade of color; gradient fill.
QUERY  
  Optional
 

Name of the ColdFusion query from which to get data to graph.
SERIESCOLOR  
  Optional
 

Color of the main element (such as the bars) of a chart. For a pie chart, the color of the first slice.

Hexadecimal value or supported named color; see the name list and information about six- and eight-digit hexadecimal values in the Usage section for the cfchart tag.

For a hexadecimal value, use the form "##xxxxxx" or "##xxxxxxxx", where x = 0-9 or A-F; use two number signs or none.

SERIESLABEL  
  Optional
 

Text of the data series label
TYPE  
  Required
 

Sets the chart display style:

  • bar
  • line
  • pyramid
  • area
  • horizontalbar
  • cone
  • curve
  • cylinder
  • step
  • scatter
  • pie
VALUECOLUMN  
  Required if query attribute is specified
 

Name of a column in the query specified in the query attribute; contains data values to graph.
DATALABELSTYLE  
  Optional
 
Default value: "None"

Specifies the way in which the color is applied to the item in the series:

  • none: nothing is printed.
  • value: the value of the datapoint.
  • rowLabel: the row's label.
  • columnLabel: the column's label.
  • pattern: combination of column label, value, and aggregate information, such as columnLabel value for the percentage of total graph; for example, Sales 55,000 20% of 277,000.