Google Gauge Chart - Ajouter une étiquette de texte pour chaque section de la jauge

Question

J'essaie d'utiliser les graphiques de Google Gauge dans ma page. Maintenant, je veux ajouter du texte dans le graphique pour chaque section ou couleur. Est-ce que je peux le faire à l'intérieur du graphique ? J'ai essayé de faire quelques modifications html mais sans succès.

Essai à partir de ce lien - https://developers.google.com/chart/interactive/docs/gallery/gauge

Par exemple, j'aimerais ajouter le texte 1 pour la couleur blanche et ainsi de suite.

Answer 1

Utiliser le majorTicks option de configuration pour fournir des étiquettes pour les principaux ticks

voir l'extrait de travail suivant...

google.charts.load('current', {
  callback: function () {
    var container = document.getElementById('chart_div');
    var chart = new google.visualization.Gauge(container);

    var data = google.visualization.arrayToDataTable([
      ['Label', 'Value'],
      ['Memory', 80],
      ['CPU', 55],
      ['Network', 68]
    ]);

    var options = {
      width: 600, height: 200,
      redFrom: 90, redTo: 100,
      yellowFrom:75, yellowTo: 90,
      majorTicks: ['A', 'B', 'C', 'D', 'E'],
      minorTicks: 3
    };

    chart.draw(data, options);
  },
  packages: ['gauge']
});

<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>