1👍
✅
This is intergraded in chart.js by using the reverse
option:
options: {
scales: {
yAxes: [{
ticks: {
reverse: true
}
}]
}
}
var ctx = document.getElementById('myChart');
var myChart = new Chart(ctx, {
type: 'scatter',
data: {
datasets: [{
label: 'sample title',
fill: false,
showLine: true,
cubicInterpolationMode: 'default',
data: [{ x: 118, y: 92.82 }, {x: 115.8, y: 92.88 }, {x: 113.03, y: 93.62 }, {x: 110.94, y: 93.84 }, {x: 107.93, y: 94.95 }, {x: 103.86, y: 97.22 }, {x: 101.78, y: 98.54 }, {x: 100.68, y: 99.95 }, {x: 98.34, y: 102.58 }, {x: 96.67, y: 105.9 }, {x: 95.47, y: 109 }, {x: 94.69, y: 111.41 }, {x: 94.18, y: 113.71 }, {x: 93.92, y: 115.63 }, {x: 93.82, y: 117.25 }, {x: 93.67, y: 118.48 }, {x: 93.57, y: 120 } ],
pointRadius: 0
}]
},
options: {
scales: {
yAxes: [{
ticks: {
reverse: true,
}
}]
}
}
});
canvas { max-width: 400px; }
<script src="https://cdn.jsdelivr.net/npm/chart.js@2.8.0"></script>
<canvas id="myChart"></canvas>
Output:
Source:stackexchange.com