JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.4/Chart.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/build/global/luxon.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
<canvas id="graph"></canvas>
JavaScript
chart = new Chart(document.getElementById('graph').getContext('2d'), {
type: 'line',
data: {
datasets: [{
label: 'test',
data: [10, 40],
yAxisID: 'p',
}]
},
options: {
aspectRatio: 1,
scales: {
xAxes: [{
display: true,
labels: ["label1","label2"],
}],
yAxes: [{
id: 'p',
display: true,
ticks: {
callback: function(value, index, values){ return value+'kW'; },
},
},{
id: 'k',
display: false,
ticks: {
callback: function(value, index, values){ return value+'km/h'; },
},
},{
id: 'e',
display: false,
ticks: {
callback: function(value, index, values){ return value+'%'; },
},
},{
id: 'r',
display: true,
ticks: {
callback: function(value, index, values){ return value+'km'; },
},
},{
id: 't',
display: false,
ticks: {
callback: function(value, index, values){ return value+'min'; },
},
},],
},
}
});