0
157
ViewsHow to set and adjust plots with equal axis aspect ratios - CHART.js
I have a project where I show the movements of the robot, I want to make this map so that the x and y scales are proportional to each other. These data are real-time data, which, as I mentioned, shows the movement of a robot. Can anyone help me with this?
This is the figure:
myChart = new Chart(ctx, {
type: 'scatter',
data: {
datasets: [{
label: '',
backgroundColor: "blue",
fill: false,
data: [],
}]
},
options: {
scales: {
xAxes: [{
ticks:{
suggestedMax:15,
}
}]
yAxes: [{
ticks:{
suggestedMax:15,
}
}]
}
}
});
·
Juan Pablo Isaza
1 answers
Answer question0
You can define the desired dimension of your canvas through the width or height property.
<canvas id="chartContainer" width="400"></canvas>
...or using CSS.
canvas {
width: 400px;
}
Further you should also define responsive: false and aspectRatio: 1 within the chart options, latter represents a square canvas.
options: {
responsive: false,
aspectRatio: 1,
See Configuration Options at the Chart.js documentation
·
Juan Pablo Isaza
Report
Answer question