This is my current line graph. The x-axis is just a mock data so hope u guys can overlook the bad data used. As you can see on the y-axis, it is starting from 60 which is not what i want. I have tried
beginAtZero = true
but its not working. I would also like to remove the label weight
but by simply removing not putting the labels, it would say undefined
.
Below is the code for the line graph.
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
It seems that you're using Chart.js version 3, where the scales
option needs to be defined differently (see Chart.js documentation ).
options = {{
resposive: true,
maintainAspectRatio: true,
scales: {
y: {
beginAtZero: true
}
}
}}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.