Flash Charts

Flash charts can be made very easily in Coldfusion using the cfchart tag. within the cfchart tags you set the format to flash and it will appear as a flash chart. This post will show you how to create a simple bar chart.

Here is a quick tutorial on how to create your first flash chart.

First of all you need to create the chart using the cfchart tag.

<cfchart format="flash"
chartheight="300"
chartwidth="300"
showxgridlines="no"
showygridlines="no"
showborder="no"
fontbold="no"
fontitalic="no"
show3d="yes"
rotated="no"
sortxaxis="no"
showlegend="no"
tipstyle="MouseOver"
tipbgcolor="##CCCCCC"
showmarkers="no"
title="Sample">

</cfchart>

Here i have created a flash chart 300px x 300px. Now we must create a series to go in our cfchart tag using the cfchartseries tag.

<cfchartseries type="bar" itemcolumn="Item" valuecolumn="Value">

</cfchartseries>

The series that i am using will create a bar chart with the item named Item and the value named Value. Now me must enter the data into our cfchartseries tag using the cfchartdata tag.

<cfchartdata item="Item 1" value="35"></cfchartdata>
<cfchartdata item="Item 2" value="55"></cfchartdata>
<cfchartdata item="Item 3" value="43"></cfchartdata>

Here i have inserted 3 pieces of data named Item 1, Item 2 and Item 3, all with different values.

After completeing these 3 steps you should have something looking similar to this.

<cfchart format="flash"
chartheight="300"
chartwidth="300"
showxgridlines="no"
showygridlines="no"
showborder="no"
fontbold="no"
fontitalic="no"
show3d="yes"
rotated="no"
sortxaxis="no"
showlegend="no"
tipstyle="MouseOver"
tipbgcolor="##CCCCCC"
showmarkers="no"
title="Sample">

<cfchartseries type="bar" itemcolumn="Item" valuecolumn="Value">
<cfchartdata item="Item 1" value="35"></cfchartdata>
<cfchartdata item="Item 2" value="55"></cfchartdata>
<cfchartdata item="Item 3" value="43"></cfchartdata>
</cfchartseries>

</cfchart>

See this script in action

Related Blog Entries

Comments

Archives By Subject

Advertising (3) [RSS]
Blog Design (1) [RSS]
CFProject Scripts (2) [RSS]
Coldfusion Charts (3) [RSS]
Coldfusion Functions (5) [RSS]
Coldfusion Overview (1) [RSS]
Coldfusion Tutorials (16) [RSS]
Image Manipulation (1) [RSS]
JavaScript (3) [RSS]
Useful Tools (3) [RSS]

Recent Comments

Simple JavaScript Calculator
Phil W. Lowder said: Thanks you Jonny, I've been playing around with the code and have learned from doin so. [More]

FCKeditor
Jonny Shaw said: I know that but unless you can get the new version on FCKeditor in to CF8 then i will keep using FCK... [More]

FCKeditor
Azadi Saryev said: Jonny, their ARE the same. CF8 just uses an earlier version of FCKEditor, so, of course, there are d... [More]

FCKeditor
Jonny Shaw said: There are a few differences between the two, i got annoyed with the CF8 editor because it tries to b... [More]

FCKeditor
Shannon Hicks said: Yeah, from the CF8 docs: Using the rich text editor The ColdFusion rich text editor lets users ente... [More]

Recent Entries

Customizable Homepage
Coldfusion Blog | Coldfusion Hosting | About Me