Summary

---

 Download CD Content

Overview

This chapter demonstrates how to use ECMAScript in order to create circular and elliptic pie charts that also incorporate mouse-handling events. As in the two previous chapters, the ECMAScript functions in this chapter dynamically create SVG elements. In the case of pie charts, these elements are SVG path elements whose contents consist of computed points in the plane. The first example shows you how to render a circular pie chart, after which it is very straightforward to modify the pie chart code in order to render an elliptic pie chart. You can also make another simple modification to create a rotating circular pie chart, as shown later in this chapter. A third modification to the circular pie chart code allows you to make it 'mouse-aware' so that you can rotate the pie chart either clockwise or counterclockwise. Therefore, your primary goal in this chapter is to focus on understanding the code for the circular pie chart because that example will enable you to grasp the other examples more easily.

Some of the examples in this chapter have long sections of similar SVG code that are not displayed because their inclusion would make the code more difficult to understand. If you want to see the code in its entirety, you can find the unedited files on the companion CD-ROM. All code and images for this chapter can be found on the companion CD-ROM in the Chapter 15 folder.

---