Book Image

Learning jqPlot

By : Scott Gottreu
Book Image

Learning jqPlot

By: Scott Gottreu

Overview of this book

Table of Contents (19 chapters)
Learning jqPlot
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Building a donut chart to show web browser usage


We find the data feed, and it is composed of nested objects. We'll need to manipulate the remote data quite a bit to get it in the format we need. We achieve this by executing the following steps:

  1. We start by including the donutRenderer plugin file. With donut charts, we can use seriesColors for each ring, so we create arrSeriesColors to store the colors of our outer rings. Then, we create innerRingColors to hold the matching colors for our inner ring wedges:

    <script src="../js/jqplot.donutRenderer.min.js"></script>
    <script src="../js/functions.js"></script>
    <script>
    var arrSeriesColors = "#4bb2c5", "#F4CA4A", "#EAA228", "#E4CAAB", "#00CC55", "#AED8D0", "#F2C185"];
    var innerRingColors = [];
  2. Next, we create our function to parse our remote data. Since we have multiple levels in our JSON, we decide to store the browsers and versions objects in variables to make our code a little easier to read. We pass the browser...