![](/img/trans.png)
[英]One common component for Chart.js to use with different y-axis With React.js
[英]Chart.js Line graph y-axis not starting from 0
這是我目前的折線圖。 x軸只是一個模擬數據,所以希望你們可以忽略使用的不良數據。 正如您在 y 軸上看到的,它從 60 開始,這不是我想要的。 我試過
beginAtZero = true
但它不起作用。 我還想刪除 label weight
,但只需刪除不放置標簽,就會顯示undefined
。
下面是折線圖的代碼。
import React from 'react'
import {Line} from 'react-chartjs-2'
function LineChart(datasets) {
const dataset = datasets.data
return (
<div>
<Line
data={{
labels: dataset.map(data=> data.created_at),
datasets: [{
label: 'Weight',
data: dataset.map(data => data.weight),
backgroundColor: 'rgba(255, 99, 132, 0.2)',
borderWidth: 1,
borderColor: 'rgb(255, 99, 132)',
}]
}}
height = {200}
options = {{
resposive: true,
maintainAspectRatio: true,
scales: {
yAxes: [{
ticks: {
min: 0,
beginAtZero: true,
}
}]
}
}}
/>
</div>
)
}
export default LineChart
您似乎使用的是 Chart.js 版本 3,其中scales
選項需要以不同方式定義(請參閱Chart.js 文檔)。
options = {{
resposive: true,
maintainAspectRatio: true,
scales: {
y: {
beginAtZero: true
}
}
}}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.