CODEWITHSUNDEEP
google-visualization
MDT
MDT

Reputation: 1659

Google charts: line break title in ColumnChart

I would like to split my title in my ColumnChart into 2 (or more) lines.

(see https://developers.google.com/chart/interactive/docs/gallery/columnchart)

I tried using the pipe ("|") symbol as follows, but it doesn't work, neither does "\n".

var options = {"title":"My first line | \n this should be the second line!"};

Thank you for your attention!

Upvotes: 5

Views: 7913

Answers (5)

Cb_M
Cb_M

Reputation: 307

In case someone need this tips for add break line on ColumnName (DataTableChart) you can use <br> but need to add on chart options : { allowHtml: true }

Upvotes: 1

Lawrence
Lawrence

Reputation: 73

The \n option seems to work now. I have just used:

var options = {title: 'Heading\nSub-heading'}

and got this output:

Heading
Sub-heading

Perhaps this is a recent addition.

Upvotes: 1

Eric Schrepel
Eric Schrepel

Reputation: 71

And in javascript, in your chart options variable, just add \n where you want a break, like:

vAxis: { title: "Line one of the title\nLine two of the title" }

Upvotes: 3

Philip Hancock
Philip Hancock

Reputation: 53

You need to add ASCII code 10.

In Ruby I used the following:

Label = first_line_string + 10.chr + second_line_string

Upvotes: 0

asgallant
asgallant

Reputation: 26330

The Google Visualization API charts don't support line breaks in the titles. I am given to understand that support for using HTML is in the pipeline (which would allow you to use <br /> tags for line breaks), so keep an eye out for announcements to that effect in the Visualization API group.

Upvotes: 1

Related Questions