Google Charts Tools - How to change colors of labels

Question

I set up a line chart using Google Chart Tools. But I can’t change the colors of the labels. Look at this chart:

http://assets.chris-saylor.com/img/g_chart_example1.png

How I would change the colors of those values S1, S2, S3 (below the chart) and the numeric scales on the left. Thank you.

Answer 1

Since you only posted an image of the graphic I will be taking into account the example code of Google Charts Playground having only the horizontal axis values similar to the one proposed (S1, S2...).

To achieve what you want you must set the property textstyle of vAxis and the hAxis. According to the documentation we have something like this:

function drawVisualization() {
  // Create and populate the data table.
  var data = google.visualization.arrayToDataTable([
    ['x', 'Piston 1', 'Piston 2'],
    ['S1',   1,       1],
    ['S2',   2,       0.5],
    ['S3',   4,       1],
    ['S4',   8,       0.5],
    ['S5',   7,       1],
    ['S6',   7,       0.5],
    ['S7',   8,       1],
    ['S8',   4,       0.5],
    ['S9',   2,       1],
    ['S10',   3.5,     0.5],
  ]);

  // Create and draw the visualization.

  new google.visualization.LineChart(

      document.getElementById('visualization'))
              .draw(
                  data,
                  {
                      width: 500, height: 400,
                      hAxis: {textStyle: { color: 'red'}},
                      vAxis: {textStyle: { color: 'blue'}}

                  }
  );
}

This example will make the vertical numbers blue and the horizontal ones red.

For some reason I do not know, at least in the Playground the horizontal labels are not aligned.