2017-02-17 59 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:

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

您需要使用百分比值使用barPercentage和categoryPercentage屬性響應方面。