Possible to extend horizontal bar controller?

In the documentation I see that you can extend the controllers for .line, .bar, .radar, .doughnut, .polarArea, and .bubble. Can you also extend the horizontal bar controller? I am attempting to add target lines to each bar in the graph and I successfully did that by overriding the original controller. I would also like to create other horizontal graphs without the target line but since I overridden the horizontal bar controller it will always draw a target line. Here is my code for the target line with overriding the controller:

            var originalHorBarController = Chart.controllers.horizontalBar;
            Chart.controllers.horizontalBar = Chart.controllers.horizontalBar.extend({
                draw: function(){
                    var self = this;
                    var base;
                    var x;
                    var y;
                    var width;

                    originalHorBarController.prototype.draw.call(this, arguments[0]);
                    console.log("x:" + this.calculateBarX(1, 0) + " y:" + this.calculateBarY(1, 0) + " width:" + this.calculateBarBase(0, 0));

                    for(var i = 0; i < this.chart.data.datasets[0].data.length; i++){
                        base = this.calculateBarBase(0, i);
                        x = this.calculateBarX(i, 0);
                        y = this.calculateBarY(i, 0);
                        width = this.getRuler(i).barHeight;

                        this.chart.chart.ctx.lineWidth = "5";
                        this.chart.chart.ctx.strokeStyle ="black";
                        this.chart.chart.ctx.moveTo(x - 10, y - (width / 2));
                        this.chart.chart.ctx.lineTo(x - 10, y + (width / 2));

              new Chart(canvas, {
                type: 'horizontalBar',
                data: data

Author: Fantashit

1 thought on “Possible to extend horizontal bar controller?

Comments are closed.