Break diagram callback diagram js v2

I'm trying to add line break inside js v2 tooltip callback

my code is:

var myChart = new Chart(ctx, { type: 'line', data: data, options: { tooltips: { callbacks: { label: function(tooltipItem, data) { var tooltip = "example tooltip"; var otherTooltip = "other tooltip"; return tooltip + "\n\r" + otherTooltip; } } } } }); 

Using \r , \n or their combination does not work, did anyone understand any idea?

I am using js v2.3.0 schema by the way.

UPDATE

I fixed the problem!

Convert the tooltip text to an array of strings (I will go from my code above) for example

 ... label: function(tooltipItem, data) { var firstTooltip = "tooltip1"; var otherTooltip = "tooltip2"; var tooltip = new Array(firstTooltip, otherTooltip); return tooltip; } 

and voila!

now tooltip has line break.

+6
source share
2 answers

The way to do this is simply adding a callback function to the tooltip property, which returns an array of strings, each of the strings will be placed on a new line.

 tooltips: { callbacks: { label: function (tooltipItem, data) { return ['first thing', 'another thing', 'and another one']; } } } 

See this jsfiddle ...

https://jsfiddle.net/alelase/6f8wrz03/3/

+6
source

Try using:

 return tooltip + "<br />" + otherTooltip; 
-2
source

Source: https://habr.com/ru/post/1012363/


All Articles