Как убрать минимальное и максимальное значение в Google Visualization Gauge - PullRequest
1 голос
/ 09 марта 2020

Я пытаюсь удалить минимальное и максимальное значения (0 и 100) из индикатора Google Visualizations. Мне удалось удалить главное значение, но не минимальное и максимальное значения. Идея?

       <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
   <script type="text/javascript">
google.charts.load('current', {
  packages: ['gauge']
}).then(function () {
  var data = google.visualization.arrayToDataTable([
    ['Label', 'Value'],
    ['Studio / T1', {v:90, f:''}],
    ['T2', {v:90, f:''}],
  ]);
        var options = {
          width: 400, height: 160,
          redFrom: 66.66, redTo: 100,
          redColor: "#cf1717",
          yellowFrom:33.33, yellowTo: 66.66,
          yellowColor: "#f7e031",
          greenFrom:0, greenTo:33.33,
          greenColor: "#168200",
          minorTicks: 5
        };
  var container = document.getElementById('chart_div');
  var chart = new google.visualization.Gauge(container);
  google.visualization.events.addListener(chart, 'ready', function () {
    Array.prototype.forEach.call(container.getElementsByTagName('circle'), function(circle) {
      if (circle.getAttribute('fill') === '#4684ee') {
        circle.setAttribute('fill', '#4c96d7');
      }
    });
    Array.prototype.forEach.call(container.getElementsByTagName('path'), function(path) {

      if (path.getAttribute('stroke') === '#c63310') {
        path.setAttribute('stroke', '#c4996b');
        path.setAttribute('fill', '#c4996b');
      }
    });
  });
  chart.draw(data, options);

});

    </script>

1 Ответ

0 голосов
/ 10 марта 2020

вы можете указать пустой массив [] для опции majorTicks ...

majorTicks: []

см. Следующий рабочий фрагмент ...

google.charts.load('current', {
  packages: ['gauge']
}).then(function () {
  var data = google.visualization.arrayToDataTable([
    ['Label', 'Value'],
    ['Studio / T1', {v:90, f:''}],
    ['T2', {v:90, f:''}],
  ]);
  var options = {
    width: 400, height: 160,
    redFrom: 66.66, redTo: 100,
    redColor: "#cf1717",
    yellowFrom:33.33, yellowTo: 66.66,
    yellowColor: "#f7e031",
    greenFrom:0, greenTo:33.33,
    greenColor: "#168200",
    majorTicks: [],
    minorTicks: 5
  };
  var container = document.getElementById('chart_div');
  var chart = new google.visualization.Gauge(container);
  google.visualization.events.addListener(chart, 'ready', function () {
    Array.prototype.forEach.call(container.getElementsByTagName('circle'), function(circle) {
      if (circle.getAttribute('fill') === '#4684ee') {
        circle.setAttribute('fill', '#4c96d7');
      }
    });
    Array.prototype.forEach.call(container.getElementsByTagName('path'), function(path) {
      if (path.getAttribute('stroke') === '#c63310') {
        path.setAttribute('stroke', '#c4996b');
        path.setAttribute('fill', '#c4996b');
      }
    });
  });
  chart.draw(data, options);
});
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...