Topic: [Charts] Can't Middle Align Tooltip Text

nichharp pro asked 6 years ago


I've made a Line Chart but I can't seem to center the text within the tooltip. I can seem to get the text middle aligned but then it is spilling off the end of the tooltip. (Please see https://github.com/chartjs/Chart.js/issues/1977 for references to people with the same issue as me. The image I have attached is from this.)

Is this a bug or does something need to be changed in my options? Below are the options from my TS file.

 

public chartOptionsLine: any = {
responsive: true,

legend: {
position: 'top',
alignment: 'left',
labels: {
usePointStyle: true,
}
},

tooltips: {
mode: 'nearest',
intersect: false,
position: 'nearest',
caretSize: 8,
borderStyle: 'solid',
displayColors: false,

yAlign: 'bottom',
xAlign: 'center',
xPadding: 25,
yPadding: 15,
_bodyAlign: 'center',
_footerAlign: 'center',
bodyAlign: 'center',
titleAlign: 'center',
},
};

Example of Issue

Damian Gemza staff answered 6 years ago


Dear @nichharp 

It seems that this bug is related to the Chart.js library. So i think that you should wait until the Chart.js Team will fix this problem. We will be monitoring this issue.

Best Regards,

Damian



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Resolved

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 7.0.0
  • Device: Computer
  • Browser: Chrome/All
  • OS: Ubuntu
  • Provided sample code: Yes
  • Provided link: No