2017-02-17 12 views
0

私はこのフィドルを作成しました。それはChartJSの棒グラフが含まれていますCharJS 2.5.0 - バー間のスペースを取り除く方法

https://jsfiddle.net/07pzys9t/

 var options = { 
     legend: { display: false }, 
     animation: { 
      animateScale: true 
     }, 
     scales: { 
      xAxes: [{ 
       barPercentage: 1, 
       categoryPercentage: 1, 
       barThickness : 45 
      }], 
      yAxes: [{ 
       barPercentage: 1, 
       categoryPercentage: 1, 
       ticks: { 
        beginAtZero: true 
       } 
      }] 
     }, 
     tooltips: { 

     } 
    }; 
    var dataForChart = { 
     datasets: [{ 
      data: [0.2, 0.4, .78, 0.05], 
      backgroundColor:["#FF6384","#4BC0C0","#FFCE56","#36A2EB"], 
      borderWidth: 0 
     }], 
     labels: ['1', '2', '3', '4'] 
    }; 
    var chart = new Chart($("#statsRenderingResultsDeliveryClaimsChart"), { 
     type: 'bar', 
     data: dataForChart, 
     options: options 
    }); 

どのように私は棒の間のスペースを削除することができますか?私はこの答え読み:

Chart.js Bar Chart: How to remove space between the bars in v2.3?

をしかし、あなたが私は両方の軸にbarPercentagecategoryPercentageプロパティを追加作成したフィドルのコードを見れば理由は動作するようには思えません。

希望の動作を達成する方法についての任意のアイデアですか?

ご注意いただきありがとうございます。

答えて

0

レスポンシブアスペクトのチャートを使用する場合、バーに幅の値を強制しないでください。

あなたはちょうどこの二つの属性

xAxes: [{ 
    barPercentage: 1.0, 
    categoryPercentage: 1.0 
}] 

の代わりにあなたのxAxesを設定する必要があります:あなたはbarPercentageとcategoryPercentage属性を使用して応答性の面でのパーセント値を使用する必要がある

xAxes: [{ 
    barPercentage: 1, 
    categoryPercentage: 1, 
    barThickness : 45 
}] 

関連する問題