Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

No way to access chart object #34

Open
BlackBeast593 opened this issue Mar 12, 2017 · 9 comments
Open

No way to access chart object #34

BlackBeast593 opened this issue Mar 12, 2017 · 9 comments

Comments

@BlackBeast593
Copy link

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!

@airblade
Copy link
Owner

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.

@BlackBeast593
Copy link
Author

Thank you!

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

@BlackBeast593
Copy link
Author

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.

@airblade
Copy link
Owner

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.

@airblade airblade changed the title Auto update No way to access chart object Mar 15, 2017
@airblade airblade reopened this Mar 15, 2017
@vijayj
Copy link

vijayj commented Dec 13, 2017

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

@AlainPilon
Copy link

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

@jdefrance-stessa
Copy link

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

@vijayj
Copy link

vijayj commented Jan 12, 2019

@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

@justagitcookie
Copy link

justagitcookie commented May 18, 2019

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();

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants