[Chartjs]-How to change fonts and axis labels for Chart.js image rendering with QuickChart?

The answers you seek are in the Chart.js documentation.

First, to change the yAxis to go to 10, use options.scales.yAxes.ticks.suggestedMax (chart.js doc).

To change font size and style, you can set these values for each component of the graph:

• For the legend, use options.legend.labels.fontColor/fontStyle/fontFamily (chart.js doc).

• For the axes, use options.scales.<axis>.ticks.font* (chart.js doc).

• For the chart title, use options.title.font* (chart.js doc).

Put it all together:

{
  type: 'line',
  data: {
    labels: ['January', 'February', 'March', 'April', 'May'],
    datasets: [{
      label: 'Dogs',
      data: [5,6,7,8,9],
      fill: false,
      borderColor: 'red',
    }, {
      label: 'Reality',
      data: [6,6,5,9,9],
      fill: false,
      borderColor: 'green',
    }]
  },
  options: {
    legend: {
      position: 'bottom',
      labels: {
        fontSize: 20,
        fontStyle: 'bold',
      }
    },
    title: {
      display: true,
      text: 'Dogs v Cats',
      fontSize: 20,
    },
    scales: {
      yAxes: [
        {
          ticks: {
            suggestedMax: 10,
            beginAtZero: true,
            fontFamily: 'Mono',
          },
        },
      ],
      xAxes: [
        {
          ticks: {
            fontFamily: 'Serif',
            fontStyle: 'italic',
          },
        },
      ],
    },
  },
}

QuickChart link