Chart.jsは、私がこのチャートやりたいだけ1小節

Question

ときに線を描画するために正常に動作しません：

あなたがラインを見ることができるように（メタとランゴデaceptación）ポイントのように描かれた。私はこれが1本のバーしか持たないからだと思うし、別のチャートでは2本のバーで作られているので、ラインが線のように描かれている。

これは私が間違っているコードですか？

<canvas id="myChart2016_5857751099b04" width="500" height="500" style="display: block; width: 500px; height: 500px;"></canvas> 
<script style="text/javascript"> 
       var ctx2016_5857751099b04 = document.getElementById("myChart2016_5857751099b04"); 
       var myChart2016_5857751099b04 = new Chart(ctx2016_5857751099b04, { 
        type: 'bar', 
        data: { 

      labels: ["Año 1"], 
      datasets: [ 
          {backgroundColor:'rgba(36, 143, 36,0)',borderColor:'rgba(75, 172, 198,1)', 
         type: 'line', 
         label: 'Meta', 
         data: [100], 
         options: { tension:0.0, bezierCurve:false },borderWidth: 1,tension:0.25 },       {backgroundColor:'rgba(51, 51, 26,0)',borderColor:'rgba(182, 87, 8,1)', 
         type: 'line', 
         label: 'Rango de aceptación ', 
         data: [90], 
         options: { tension:0.0, bezierCurve:false },borderWidth: 1,tension:0.25 },       {backgroundColor:['rgba(99, 33, 36 ,0.1)'],borderColor:['rgba(99, 33, 36, 1)'], 
         type: 'bar', 
         label: 'Porcentaje de proveedores evaluados satisfactoriamente ', 
         data: [100], 
         options: { tension:0.0, bezierCurve:false },borderWidth: 1,tension:0.25 }   ]}, 
       options: { 
         tension:1, 
         scaleBeginAtZero: true, 
         scaleStartValue: 0, 
         scales: { 
          xAxes: [{ 
           categorySpacing: 20, 
           gridLines: { 
             color: "rgba(0, 0, 0, 0)", 
            }, 
          }], 
          yAxes: [{ 
           categorySpacing: 20, 
           ticks: { 
            beginAtZero:true 
           } 
          }] 
         } 

        } 
       }); 
       </script> 

は私がメタとにしようと試みランゴデaceptaciónデータ：

data: [100,100,100]と

data: [90,90,90]しかし、結果は予想外である：

[

Answer 1

割り当てあなたラブそれ以下ではそれは働き始めるでしょう。以下は

labels: ["Año 1","",""] 

あなたは[jsfiddle]（http://jsfiddle.net/）を提供することができワーキングサンプルコード

<script style="text/javascript"> 
       var ctx2016_5857751099b04 = document.getElementById("myChart2016_5857751099b04"); 
       var myChart2016_5857751099b04 = new Chart(ctx2016_5857751099b04, { 
        type: 'bar', 
        data: { 

      labels: ["Año 1","",""], 
      datasets: [ 
          {backgroundColor:'rgba(36, 143, 36,0)',borderColor:'rgba(75, 172, 198,1)', 
         type: 'line', 
         label: 'Meta', 
         data: [100,100,100], 
         options: { tension:0.0, bezierCurve:false },borderWidth: 1,tension:0.25 },       {backgroundColor:'rgba(51, 51, 26,0)',borderColor:'rgba(182, 87, 8,1)', 
         type: 'line', 
         label: 'Rango de aceptación ', 
         data: [90,90,90], 
         options: { tension:0.0, bezierCurve:false },borderWidth: 1,tension:0.25 },       {backgroundColor:['rgba(99, 33, 36 ,0.1)'],borderColor:['rgba(99, 33, 36, 1)'], 
         type: 'bar', 
         label: 'Porcentaje de proveedores evaluados satisfactoriamente ', 
         data: [100], 
         options: { tension:0.0, bezierCurve:false },borderWidth: 1,tension:0.25 }   ]}, 
       options: { 
         tension:1, 
         scaleBeginAtZero: true, 
         scaleStartValue: 0, 
         scales: { 
          xAxes: [{ 
           categorySpacing: 20, 
           gridLines: { 
             color: "rgba(0, 0, 0, 0)", 
            }, 
          }], 
          yAxes: [{ 
           categorySpacing: 20, 
           ticks: { 
            beginAtZero:true 
           } 
          }] 
         } 

        } 
       }); 
       </script>