airblade/chartjs-ror

No way to access chart object

Opened this issue · 9 comments

Hello,

There are some built-in function to auto update the chart with new data?

If not, please do you have any sugestions to auto update the chartjs-ror graphic?

Please let me know, thank you very much!

This plugin just loads Chart.js via a Ruby gem. You'll need to ask on the Chart.js repo how to update your chart with new data.

Thank you!

Actually Chart.js includes the updateData function. There is some way to access to the chart object generated by chartjs-ror?

Hello,

I just achieved my goal. I'm not an expert in javascript but I modified the file "chart_helpers.rb", in line 42, to remove the "var" prefix on "chart" variable so now I am able to access to the chart object from another piece of javascript on the same page, for instance:

<script type="text/javascript"> chart.data.datasets[0].data[6] = 2500; chart.update(); </script>

I'm not sure if this change could provoke some inestable performance on the plugin, but it worked for me.

Thank you very much, this plugin is awesome because it supports the complete set of options of Chart.js, such as the multi Y axis or the time format X axis.

Glad you got it working for you.

You're right, there isn't a way to access the chart object. I'll leave this issue open until that's possible.

I did a small hack where I am using the global window object and adding charts object to it

 var initChart = function() {
            var ctx = document.getElementById(#{element_id.to_json});
            var chart = new Chart(ctx, {
              type:    "#{camel_case type}",
              data:    #{to_javascript_string data},
              options: #{to_javascript_string options}
            });
            window.charts = window.charts || [];
            window.charts.push(chart);
          };

I don't think it is completely safe but it's an idea

+1 to find a way to access the chart object.

Was there a pull request ever submitted for your changes @vijayj ?
Or did you end up cloning/forking this project?

@jdefrance-stessa - I just added that code to my project so no clone or fork. I am still not convinced whether this is the safest way to access chart object. I am not sure this merits a pull request

EDIT: SORRY i realized my mistake that the google search led me to a ruby project in search of accessing chartjs objects at a later time!

@BlackBeast593 , @vijayj , @AlainPilon
Since this issue is still open i'd like to propose you use the following procedure

// when you initialize a new chart, save the chart to the data field that is hidden in the DOM.
// you can store objects here and retrieve them whenever you need to.
// so in yourFunctionThatInitsYourChart:

var ctx = $('#yourcanvas');
var yourChart = new Chart(ctx, config);
ctx.data('storedChart', yourChart);`

// and then load the data field at any time you wish by selecting this data field again
// so in yourFunctionThatGetsCalledToUpdateYourChart:

var chartLoadedAgain = $('#yourcanvas').data('storedChart');
var labelsAndDataContainer = seperateLabelsAndData(timeSeriesData);
var labelsArray = labelsAndDataContainer[0];
var dataArray = labelsAndDataContainer[1];

graph.data.labels = labelsArray;
graph.data.datasets[0].data = dataArray;
chartLoadedAgain.update();