Chart.js: chartjs v2: Change legend position in line chart
Hello,
Is it possible to change the legend position through CSS in chartjs version 2.0.0-beta2?
Currently my line chart looks like this
This chart consists of two separate charts. And the legend belongs to the chart on the left. Is there a way I can modify the legend position manually (instead of just top and bottom) so that it will be positioned at the centre under the "two charts" like the chart title?
ooisiang
All 7 comments
This is currently not possible since the legend is drawn on the canvas itself. We could easily add some positioning though.
etimberg
on 26 Feb 2016
Closing because we aren't going to implement this in the core. It may be possible to find a solution that changes the legend by changing this line in a custom build but we are not going to add options for this at the moment since this seems to be fairly specific to this use case
etimberg
on 16 Oct 2016
It would have been an interesting feature though, especially if you just want to add some vertical padding between the chart and the legend.
Also the centering of the legend is not perfect. It probably doesn't properly take into account the right padding added to the last label which results in a slightly left-shifted legend (it gets really visible if you use a big padding). Being able to shift the legend manually would also be useful in this case.
ghugues
on 9 Nov 2016
How can vertical padding be a specific use to a case? It's fundamental for preserving the general styles of the environment the chart will be implemented.
rockstarwebdesign
on 11 Apr 2017
@etimberg - Like @rockstarwebdesign says this isn't a specific use to a case and this issue shouldn't be closed! It would be very useful to change the position of the legend.
It would be nice if you could at least add vertical padding for top and bottom legends and horizontal for left and right legends - currently a top legend is very close to the top of the chart.
Also like @ghugues says the legend isn't currently centered, which is a problem when you change the padding.
Nissen96
on 1 Jun 2017
Yeah, this is something that is supported in all the other visualization libraries that we have been looking at.
pheaver
on 12 Jul 2017
Its 2019, and we are still demanding this simple feature?
zhuhang-jasper
on 31 Oct 2019
Related issues
adriantombu
路
3Comments
srijitcoder
路
3Comments
Woogles
路
3Comments
akashrajkn
路
3Comments
nickgoodliff
路
3Comments
Most helpful comment
It would have been an interesting feature though, especially if you just want to add some vertical padding between the chart and the legend.
Also the centering of the legend is not perfect. It probably doesn't properly take into account the right padding added to the last label which results in a slightly left-shifted legend (it gets really visible if you use a big padding). Being able to shift the legend manually would also be useful in this case.