Chart.js - 棒グラフ（タ​​イプバー）で水平線を描く

Question

おはようございます、Chart.jsを使って棒グラフに水平線を描きたいと思います。

私は質問Chart.js - draw horizontal lineを読みましたが、棒グラフに線を描くことはできませんでした。線図の実装が示されています。

は私のコードは、JS

var data = { 
    labels: ["Docente 1", "Docente 2", "Docente 3", "Docente 4", "Docente 5", "Docente 6", "Docente 7"], 
    datasets: [ 
     { 
      label: "Semestre 2017-I", 
      borderWidth: 1, 
      data: [3.65, 2.59, 1.80, 2.81, 0.56, 0.55, 3.40] 
     } 
    ] 
};    

var ctx = document.getElementById("ctx"); 

var myBarChart = new Chart(ctx, { 
    type: 'bar', 
    data: data 
}); 

jsfiddle

HTML

<div> 
    <canvas id="ctx"></canvas> 
</div> 

に実装され、フォームのグラフを得、水平線を描画することができるであろう。 http://i.stack.imgur.com/QlOKG.png

Answer 1

HTML：

<div> 
    <canvas id="ctx" width="600" height="400"></canvas> 
</div> 

JS：http://jsfiddle.net/zk9oc4c9/

重要：ここで

var data = { 
       labels: ["Docente 1", "Docente 2", "Docente 3", "Docente 4", "Docente 5", "Docente 6", "Docente 7"], 
       datasets: [ 
        { 
         label: "Semestre 2017-I", 
         borderWidth: 1, 
         data: [3.65, 2.59, 1.80, 2.81, 0.56, 0.55, 3.40] 
        } 
       ] 
      };    

var ctx = document.getElementById("ctx").getContext("2d"); 

Chart.types.Bar.extend({ 
    name: "BarWithLine", 
    initialize: function() { 
     Chart.types.Bar.prototype.initialize.apply(this, arguments); 
    }, 
    draw: function() { 
     Chart.types.Bar.prototype.draw.apply(this, arguments); 

     var lineHeight = 2; // <---- 

     // draw line 
     this.chart.ctx.beginPath(); 
     this.chart.ctx.moveTo(0, this.scale.calculateY(lineHeight)); 
     this.chart.ctx.strokeStyle = '#ff0000'; 
     this.chart.ctx.lineTo(this.chart.width, this.scale.calculateY(lineHeight)); 
     this.chart.ctx.stroke(); 
    } 
}); 

var myBarChart = new Chart(ctx).BarWithLine(data, { 
    type: 'bar', 
    data: data 
}); 

はフィドルある http://www.chartjs.org/assets/Chart.min.js

：私はにChart.jsライブラリURLを変更そして、fiddからhttpsを削除したル。