Я пытаюсь создать компонент диаграммы погоды в React с помощью диаграммы. js. Мне нужны две разные оси x с температурой над диаграммой и временем под диаграммой. Данные верны в том смысле, в котором я этого не хочу, я просто хочу использовать две разные метки вверху и внизу оси x. Как мне это сделать?
import React from "react";
import { Line } from 'react-chartjs-2';
class WeatherOverview extends React.Component {
constructor(props){
super(props);
this.state = {
chartData: {
labels: ['15:00', '18:00', '21:00', '00:00', '03:00', '06:00', '09:00', '12:00'], //time
datasets: [{
data: [18, 19, 18, 16, 15, 15, 16, 17, 18] //temp
}],
}
}
}
render(){
return (
<div className="chart">
<Line
data={this.state.chartData}
options={{
scales: {
yAxes: [{
gridLines: {
drawOnChartArea: false
},
ticks: {
suggestedMin: 13, // lowest from data minus 2/3
display: false
}
}],
xAxes: [
{
gridLines: {
drawOnChartArea: false
},
},
{ position: 'top' },
]
}
}}
/>
</div>
)
}
}
export default WeatherOverview;