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

Creating a scatterplot chart


Now that we have created our new function file, we are ready to begin building our chart. A scatterplot chart is rendered the same in jqPlot as a normal line chart except that we turn off the lines connecting our data points.

  1. We start our code by including the trend line plugin and our new functions.js file. We create a new data conversion function called dataConversion. Since remoteDataCallback is passing back an array, we simply need to wrap it in another array for jqPlot:

    <script src="../js/jqplot.trendline.min.js"></script>
    <script src="../js/functions.js"></script>
    <script>
    function dataConversion(remoteData) {
      var data = new Array();
      data[0] = remoteData;
      return data;
    }
  2. We create our chart object and pass in the URL of the data feed that IT created for us:

    $(document).ready(function(){
      var share_conversions = $.jqplot ('share_conversions', "./data/share_conversions.json",
      {
        title:'Conversions from Total Shares',
  3. We...