Creating your own chart styles

You can create your own chart styles by doing either of the following:

Modifying the chart style XML files

You can modify the chart styles included with ColdFusion to create your own chart styles. The files that contain the style information are XML files located in the cf_root\charting\styles directory. You should only modify attributes specified in the file. To specify additional attributes, follow the instructions in the section Using WebCharts3D to create chart styles.

Note: There are two XML files for each default chart style. For example, the beige style for pie charts is defined in the beige_pie.xml file; the beige style for all other types of charts is defined in the beige.xml file.

To modify a chart style XML file:

Open the XML file that you want to modify, for example beige.xml.
Modify the file contents.
Save the file with a different name; for example myBeige.xml.

Using WebCharts3D to create chart styles

ColdFusion MX 7 includes the WebCharts3D utility, which you can use to create chart style files.

To create your own chart style file with the WebCharts3D utility:

Start WebCharts3D by double-clicking the webcharts.bat file in the CFusionMX7\charting directory.
(Optional) Open an existing chart.
Make the changes you want to the chart's appearance.
Note: To use the chart style file in the cfchart tag, you can only make the modifications indicated in the table that follows this procedure.
Click the XML style tab.
Click the Save button in the bottom right corner.
Specify the name of the file; for example, mystyle.xml.
Specify the directory in which you want to save the chart style file.
Note: ColdFusion uses the same rules to look for the chart style XML files as it does for files included using the cfinclude tag. For more information, see cfinclude.
Click Save.

The following table lists the attributes of the cfchart and cfchartseries tags and the associated WebCharts3D commands:

Attribute	WebCharts3D command
`chartHeight`	Drag the chart by handles.
`chartWidth`	Drag the chart by handles.
`dataBackgroundColor`	Background: minColor (type must be PlainColor)
`font`	font: Family (specify only supported fonts.)
`fontBold`	font: check Bold
`fontItalic`	font: check Italic
`fontSize`	font: Size
`foregroundColor`	foreground
`gridlines`	XAxis: labelcount
`labelFormat`	YAxis: LabelFormat: Number \| Percent\| Currency \| Datetime
`markerSize`	Elements: markerSize
`pieSliceStyle`	style: solid \| slice
`rotated`	Type Frame chart: Elements: Shape:
`scaleFrom`	Yaxis: isAbsolute; scaleMin(int)
`scaleTo`	Yaxis: isAbsolute; scaleMax(int)
`seriesPlacement`	Elements: place
`show3D`	is3D
`showBorder`	Decoration: style (none or simple)?
`showLegend`	Legend: isVisible
`showMarkers`	Elements: showMarkers
`showXGridlines`	Frame: isVGridVisible
`showYGridlines`	Frame: isHGridVisible
`tipbgColor`	Popup: background
`tipStyle`	Popup: showOn: MouseOver \| MouseDown \| Disabled
`url`	Elements: action \| Series: action
`xAxisTitle`	Xaxis: TitleStyle: text (enter text)
`xAxisType`	xAxis: type: (category or scale)
`xOffset`	Frame: xDepth
`yAxisTitle`	Yaxis: TitleStyle: text (enter text)
`yAxisType`	Currently has no effect.
`yOffset`	Frame: yDepth

The following table lists the attributes of the cfchartseries tag and the associated WebCharts3D commands:

Attribute	WebCharts3D command
colorlist	Elements: series: Paint: color
markerStyle	Elements: series: Marker type: Rectangle \| Triangle \| Diamond \| Circle \| Letter \| MCROSS \| Snow \| RCROSS
paintStyle	Paint: paint: Plain \| Shade \| Light
seriesColor	Elements: series: Paint: color
seriesLabel	Elements: series:
type	Type: Pie chart \| Type Frame chart: Elements: Shape: Bar \| Line \| Pyramid \| Area \| Curve \| Step \| Scatter \| Cone \| Cylinder \| Horizontalbar \|

View comments in LiveDocs