question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

New Chart extending BAR chart doesn't work

See original GitHub issue

Expected Behavior

In the version 2.8.0, creating new chart extending a bar chart, it works. See the code:

Chart.defaults.derivedBar = Chart.defaults.bar;
var custom = Chart.controllers.bar.extend({
   draw: function(ease) {
          Chart.controllers.bar.prototype.draw.call(this, ease);
   }
});
Chart.controllers.derivedBar = custom;

var ctx = document.getElementById("myChart");
var myChart = new Chart(ctx, {
    type: 'derivedBar',
    data: {
        labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
        datasets: [{
            label: '# of Votes',
            data: [12, 19, 3, 5, 2, 3]
        }]
    }
});

okController

Current Behavior

In the new vesion 2.9.1, new chart is not rendered and completely empty (without any message into log)

bugController

The problem is ONLY for BAR chart (at least on my tests).

Environment

  • Chart.js version: 2.9.1
  • Browser name and version: FF 70.0

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:5 (4 by maintainers)

github_iconTop GitHub Comments

4reactions
stockiNailcommented, Oct 29, 2019

@benmccann Thank you! It works. A hint, if I may. In the doc, about Controllers, I don’t find (but I’m getting old and maybe there is…) something like that:

Chart.defaults.global.datasets.derivedBar = Chart.defaults.global.datasets.bar;
3reactions
benmccanncommented, Oct 29, 2019

@stockiNail I’m guessing you also need the dataset defaults, which were introduced in 2.9. There’s some info in the docs and you can see it being done in the current bar controller source. The reason for this is to better support mixed charts

Read more comments on GitHub >

github_iconTop Results From Across the Web

Extend bar chart on Chart JS 2 into a new type of Chart
So, I'm trying to extend the Bar Chart into a new one which takes a parameter called lineAtValue which provides the y value...
Read more >
Extend bar chart on Chart JS 2 into a new type of Chart-Chart.js
I finally suceeded in creating the new type that extend the bar type and add a line if the value is provided. //...
Read more >
New Charts | Chart.js
Extending Existing Chart Types. Extending or replacing an existing controller type is easy. Simply replace the constructor for one of the ...
Read more >
Update the data in an existing chart - Microsoft Support
Learn how to update the data in an existing chart from its source. Edit a chart in Excel, create a chart from a...
Read more >
Visualization: Column Chart - Google Developers
In our data table, we define a new column with { role: 'annotation' } to hold ... Note: Material Charts will not work...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found