I'm attempting to draw a flot chart.
Here's the code used:
var data = [{
color: '#ff7e00',
data: [
[1692473400, 19.95],
[1692480600, 19.194],
[1692484200, 18.606],
]
}, {
color: '#ff0000',
data: [
[1692468000, 32.76],
[1692469800, 33.894],
[1692471600, 20.139],
[1692475200, 21],
[1692477000, 21],
[1692478800, 21.231],
[1692482400, 20.16],
]
}];
$.plot("#pricesToday", data, {
series: {
bars: {
show: true,
barWidth: 0.6,
align: "left"
}
},
xaxis: {
mode: "time",
timeformat: "%H:%M",
timezone: "none"
}
});
This gives the below render:
As you can see, it is not equally sized, despite seeing barWidth: 0.6,
Is this a mistake I've made? How do I force it to be equal sized?
It could be a bug, but I wanted to check this before I raise a bug report.
Thanks
After some investigation: this is ONLY a valid bug on the github version of flot. Archived/hosted versions do not have this bug, such as
<script src="https://cdnjs.cloudflare.com/ajax/libs/flot/0.8.3/jquery.flot.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/flot/0.8.3/jquery.flot.time.min.js"></script>
For all others, suggest you use a tagged version of 0.8.3 until this is fixed.
I raised a bug: https://github.com/flot/flot/issues/1856
TLDR: Do not use https://github.com/flot/flot
master branch