Formatting legend and axis in Google Charts

34,104

Solution 1

After some time experimenting, I daresay it is not posible to choose how much part of the words on legend or axis you can show.

However, you can play with their sizes and position so you get -more or less- what we were looking for. This is what can be done:

legend: {position: 'top', textStyle: {fontSize: 14}}

I've also made the image a little bit bigger so it fits the x-axis without problems (There was also the option of making its text smaller).

So doing this, this is what you get: enter image description here

Solution 2

Its basically about setting your chart area vs width / height.

width: [yourChoice]px,
chartArea: {width: '50%'}

ref https://stackoverflow.com/a/6870732/661584

Also as @ArcDare says using the other available styling options such as font size etc

Share:
34,104
ArcDare
Author by

ArcDare

Telecommunication Engineer who works with Android, SQL, ASP, PHP and others. Expert in EDI (Edifact, X12, XML, etc.)

Updated on August 06, 2022

Comments

  • ArcDare
    ArcDare almost 2 years

    I'm new with Google Charts and I am not able to obtain a fine result with the texts surrounding the graph.

    This is how my chart looks:

    This is how looks my chart

    As you can see, it does cut both Horizontal-Axis and Legends, so the final result is not as good as It could be. Is there a way to solve this? I've been reading the official documentation and some posts from here, but I haven't found the way to do this.

    Recap: How do we modify the legend or the axis texts so they are fully visible?