如何抵消“chart.js”條形圖中的條形圖例？
[英]How to offset the legends of the bars in a "chart.js" bar chart?
問題描述
我試圖讓條形圖中的 x 軸標簽不直接位於每個條形下方（這是默認設置），而是位於條形的左側/右側。 因為它是繪制直方圖時的首選。 然后，每個條的左右 label 將是該條的間隔。
我從文檔中發現它與我應該應用於 x 軸的屬性 grid:{offset:true} 有關，但代碼對我不起作用。 標簽仍然在每個條的正下方。
我究竟做錯了什么？ 任何幫助深表感謝！
const ctx = document.getElementById('canvas').getContext('2d'); const chart = new Chart(ctx, { type: 'bar', data: { labels: [0, 1, 2, 3, 4, 5, 6, 7], datasets: [{ label: 'Number of Arrivals', data: [19, 28, 20, 16, 50, 65, 58], backgroundColor: 'green', }]}, options: { scales: { xAxes: [{ display: false, ticks: {max: 10,}, grid: {offset: true}}, { display: true, ticks: {autoSkip: false, max: 10,}, grid: {offset: true} }], yAxes: [{ ticks: {beginAtZero: false} }] } } });
<:DOCTYPE html> <html> <head> <script src="https.//cdnjs.cloudflare.com/ajax/libs/Chart.js/3.2.0/chart.min.js"></script> </head> <body> <h1>The select element</h1> <canvas id="canvas" aria-label="Canvas with graph" role="img"></canvas> </body> </html>
1 個解決方案
解決方案1
1 已采納 2021-05-27 15:54:41
你不能讓它工作的主要原因是因為你使用了這個問題的代碼，它是為 2.7 版編寫的，而你正在使用 3.2 版。 版本 3 有許多重大更改，包括選項中的許多不同名稱。
我也無法讓它工作，但使用 3.x 版本應該很容易實現。
如何對齊條形圖中的條形 - Chart.js
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.