Contents > Developing ColdFusion MX Applications > Charting and Graphing Data > Linking charts to URLs > Linking to JavaScript from a pie chart

Linking to JavaScript from a pie chart

In the following example, when you click a pie wedge, ColdFusion uses JavaScript to display a pop-up window about the wedge.

Create a dynamic chart using JavaScript

1. Create a new application page with the following content:

   <script>
   function Chart_OnClick(theSeries, theItem, theValue){
   alert("Series: " + theSeries + ", Item: " + theItem + ", Value: " + 
   theValue);
      }
   </script>
   
   <cfchart 
         xAxisTitle="Department"
         yAxisTitle="Salary Average"
         tipstyle=none
         
   url="javascript:Chart_OnClick('$SERIESLABEL$','$ITEMLABEL$','$VALUE$');"
      >
      <cfchartseries type="bar" seriesLabel="Average Salaries by Department">
         <cfchartData item="Finance" value="75000">
         <cfchartData item="Sales" value="120000">
         <cfchartData item="IT" value="83000">
         <cfchartData item="Facilities" value="45000">   
      </cfchartseries>
   </cfchart>
   

2. Save the page as chartdata_withJS.cfm in myapps under the web root directory.
3. Return to your browser and enter the following URL to view chartdata_withJS.cfm:

   http://127.0.0.1/myapps/chartdata_withJS.cfm

4. Click the slices of the pie chart to display the pop-up window.

Contents > Developing ColdFusion MX Applications > Charting and Graphing Data > Linking charts to URLs > Linking to JavaScript from a pie chart

ColdFusion 9 | ColdFusion 8 | ColdFusion MX 7 | ColdFusion MX 6.1 | ColdFusion MX | Forums | Developer Center | Bug Reporting

Version 6.1

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