<< Adobe Pakistan User Group

Discussion Area

ask questions, discuss topics, solve problems

Discussion Home | About | Threads By Date | Search

Language Features - Client-side charting

Thread posted 02/25/12 by Tayyab Hussain
2,633 views, 0 comments.

Title
Language Features - Client-side charting

Content

ColdFusion Zeus supports client-side charting. This is in addition to the existing server-side charting feature (which continues to serve the way it used to).Client-side charting supports the following:

• Dynamic and interactive charting: Modify the charts, add styles, and add new series or plots

• Popular chart formats with appropriate fallback functionality: Use HTML 5, Flash, SVG, or VML charts.

• If your browser does not support HTML 5 features relevant to charting, charts are rendered in Flash. Similarly, if

• Flash is not supported, charts are rendered in HTML.

• Features identical to server-side charting: Most of the server-side charting features are available with client-side charting.

• Old and new charts: In addition to the contemporary chart types, offers a new set of charts.

• Needs minimal trips to server: As compared to generating charts at server-level, for every user interaction

Supported charts

Line Charts	Area Charts	Bar Charts	Scatter Charts
Bubble Charts	Horizontal Bar Charts	Pie Charts	Radar Charts
Bullet Charts	Nested Pie Charts	Piano Charts	Funnel Charts
Gauges	Horizontal Bullet Charts	Cone	3D Line Charts
3D Area Charts	3D Pie Charts	3D Horizontal Bar Charts	Pyramid
Cylinder

 

How client side charting works

Use the cfchart tag and specify 2 as the value for the attribute version.

By default, the version is 1 (which is applicable to server-side charting).

Specify the chart details as you specify them for server-side charting in the previous release

Limitations

Image

File
test.cfm (710 b)

Code
<cfchart format ="html" type="pie">
<cfchartseries>
<cfchartdata item="New car sales" value="50000">
<cfchartdata item="Used car sales" value="25000">
<cfchartdata item="Leasing" value="30000">
<cfchartdata item="Service" value="40000">
</cfchartseries>
</cfchart>

<cfchart format ="html" type="bubble">
<cfchartseries type="bubble" label="Total_Days">
<cfchartdata item=1 value=10 zvalue=40>
<cfchartdata item=2 value=20 zvalue=30>
<cfchartdata item=3 value=30 zvalue=20>
<cfchartdata item=4 value=20 zvalue=35>
<cfchartdata item=5 value=40 zvalue=10>
</cfchartseries>

</cfchart>