
Contents > Developing ColdFusion MX Applications > Charting and Graphing Data > Linking charts to URLs

Linking charts to URLs

ColdFusion provides a data drill-down capability with charts. This means you can click on an area of a chart, both the data and the legend areas, to request a URL. For example, if you have a pie chart and want a user to be able to select a pie wedge for more information, you can build that functionality into your chart.

You use the url attribute of the cfchart tag to specify the URL to open when a user clicks anywhere on the chart. For example, define a chart that opens the page moreinfo.cfm when a user clicks on the chart using the following code:

<cfchart
   xAxisTitle="Department"
   yAxisTitle="Salary Average"
   url="moreinfo.cfm"
   >

      <cfchartseries 
         seriesLable="Department Salaries"
      ...
      />

</cfchart>

You can use the following variables in the url attribute to pass additional information to the target page:

$VALUE$ The value of the selected item, or an empty string
$ITEMLABEL$ The label of the selected item, or an empty string
$SERIESLABEL$ The label of the selected series, or empty string

For example, to let users click on the graph to open the page moreinfo.cfm, and pass all three values to the page, you code the url attribute as follows:

url="moreinfo.cfm?Series=$SERIESLABEL$&Item=$ITEMLABEL$&Value=$VALUE$"

The variables are not enclosed in # signs like ordinary ColdFusion variables. They are enclosed in dollar signs. Clicking on a chart that uses this url attribute value could generate a URL in the following form:

http://localhost:8500/tests/charts/moreinfo.cfm?
Series=Department%20Salaries&Item=Training&Value=86000

You can also use JavaScript in the URL to execute client-side scripts. For an example, see Linking to JavaScript from a pie chart.


Contents > Developing ColdFusion MX Applications > Charting and Graphing Data > Linking charts to URLs

Version 6.1

Comments are no longer accepted for ColdFusion MX 6.1. ColdFusion 8 is the current version.

Comments

spage said on Sep 24, 2003 at 10:17 PM :

Typo in the cfchartseries attribute, it should be seriesLabel, not seriesLable.

RSS feed | Send me an e-mail when comments are added to this page | Comment Report

Current page: http://livedocs.adobe.com/coldfusion/6.1/htmldocs/graphi19.htm