Merge pull request projectmesa#634 from jdfoote/histogram_update

Updating the docs for the new version of Chart.js

docs/tutorials/adv_tutorial.rst

@@ -366,7 +366,7 @@ context, which is required for doing anything with it.
         canvas_tag += "style='border:1px dotted'></canvas>";
         // Append it to body:
         var canvas = $(canvas_tag)[0];
-        $("body").append(canvas);
+        $("#elements").append(canvas);
         // Create the context and the drawing controller:
         var context = canvas.getContext("2d");
     };
@@ -386,8 +386,13 @@ created, we can create the chart object.
     // HistogramModule.js
     var HistogramModule = function(bins, canvas_width, canvas_height) {
         // Create the elements
-
         // Create the tag:
+        var canvas_tag = "<canvas width='" + canvas_width + "' height='" + canvas_height + "' ";
+        canvas_tag += "style='border:1px dotted; position:relative;'></canvas>";
+        // Append it to body:
+        var canvas = $(canvas_tag)[0];
+        $("#elements").append(canvas);
+
         var canvas_tag = "<canvas width='" + canvas_width + "' height='" + canvas_height + "' ";
         canvas_tag += "style='border:1px dotted'></canvas>";
         // Append it to body:
@@ -420,7 +425,11 @@ created, we can create the chart object.
         };
 
         // Create the chart object
-        var chart = new Chart(context).Bar(data, options);
+        var chart = new Chart(context, {
+            type: 'bar',
+            data: data,
+            options: options
+        });
 
         // Now what?
     };
@@ -445,14 +454,17 @@ With that in mind, we can add these two methods to the class:
     var HistogramModule = function(bins, canvas_width, canvas_height) {
         // ...Everything from above...
         this.render = function(data) {
-            for (var i in data)
-                chart.datasets[0].bars[i].value = data[i];
+            chart.config.data.datasets[0].data = data;
             chart.update();
         };
 
         this.reset = function() {
             chart.destroy();
-            chart = new Chart(context).Bar(data, options);
+            chart = new Chart(context, {
+            type: 'bar',
+            data: data,
+            options: options
+        });
         };
     };