ColdFusion 10 includes a good number of charting enhancements including Client Side Charting using the ZingChart library. This is great news as we can look at ZingChart documentation to look at some of the new things you can do with Charts in ColdFusion 10.

I started playing around with this and did a quick demo of pie and bar charts with some of the new options.
View Demo (Free CF10 beta hosting from Hostek!. If it doesn't load, refresh page).

Code is pretty simple, just had to look through ZingChart documentation to exact structure builds. Code Follows...

view plain print about
1<!--- Get Graph Data --->
2<cfquery name="selChartData" datasource="#Application.DataSource#">
3    SELECT
4        SUM(Total) As InvTotal,
5        Vendor
6    FROM
7        Invoices
8    GROUP BY Vendor    
9</cfquery>
10
11<cfscript>
12    plotPie = {
13            "slice":20, //Adds the blank circle in middle
14
            "offset":50, //Does not trigger
15
            "rules":[ //Change styling based on values                
16
                {
17                "rule":"%v <= 1000000",
18                "background-color":"##01DF01",
19                "border-color":"##01DF01",
20                "border-width":2,
21                "shadow":true,                
22                "shadow-distance":8,                        
23                "shadow-color":"##6E6E6E"
24                },
25                {
26                "rule":"%v >= 1000000",
27                "background-color":"##DF3A01",
28                "border-color":"##DF3A01",
29                "border-width":2,
30                "shadow":true,                
31                "shadow-distance":8,                        
32                "shadow-color":"##6E6E6E"
33                }
34            ]
35    };
36    
37    plotBar = {            
38            "value-box" : { //Add Value maximum for each bar
39
             "type" : "max",
40             "text" : "Max: %v",
41             "text-align" : "center"
42         },
43            "rules":[ //Change styling based on values                
44
                {
45                "rule":"%v <= 1000000",
46                "background-color":"##01DF01",
47                "border-color":"##01DF01",
48                "border-width":2,
49                "shadow":true,                
50                "shadow-distance":8,                        
51                "shadow-color":"##6E6E6E"
52                },
53                {
54                "rule":"%v >= 1000000",
55                "background-color":"##DF3A01",
56                "border-color":"##DF3A01",
57                "border-width":2,
58                "shadow":true,                
59                "shadow-distance":8,                        
60                "shadow-color":"##6E6E6E"
61                }
62            ]
63    };
64    
65    background = {
66        "background-color":"##F7F8E0"
67    };
68    
69    animate = { //Bars will slide up during load        
70
        "effect":"slideup"
71    };
72    
73    arrows = [ //Puts arrow on graph
74
        {
75        "from": {"x":100,"y":100},
76        "to" : {"x":270,"y":270},
77        "size":2,
78        "label":"See This" //Nothing shown...
79
        }
80    ];
81
</cfscript>
82
83<!--- Pie Graph --->
84<cfchart format="html" ID="InvoicesCF10Pie" title="Invoices by Vendor" height="500" width="500"
85    plot="#plotPie#" pieslicestyle="sliced" background="#background#">
    
86    <cfchartseries type="pie" query="selChartData" itemcolumn="Vendor" valuecolumn="InvTotal" serieslabel="Total"
87    paintstyle="plain" colorlist="##0000FF,##5858FA,##81BEF7,##2E9AFE,##0174DF">

88    </cfchartseries>        
89</cfchart>
90
91<cfoutput>
92    <hr/>    
93</cfoutput>
94
95<!--- Bar Graph --->
96<cfchart format="html" ID="InvoicesCF10Bar" title="Invoices by Vendor" height="500" width="500"
97    plot="#plotBar#" background="#background#" arrows="#arrows#">
    
98    <cfchartseries type="bar" query="selChartData" itemcolumn="Vendor" valuecolumn="InvTotal" serieslabel="Total"
99    paintstyle="plain" colorlist="##0000FF,##5858FA,##81BEF7,##2E9AFE,##0174DF" animate="#animate#">

100    </cfchartseries>        
101</cfchart>

Some of the new attributes we are using are the plot, animate, background attributes. The plot allows you to define rules which govern the styling of the data value elements of the graph. Using the rules you can set different coloring, shadow, border depending on the values. This would give you a lot of flexibility with graph display. We also find some ZingChart definitions that don't seem to have been implemented as of yet at least in the beta.

I will continue experimentation with additional charts to see what new things we can do using ZingChart.