如何改变谷歌图表API的背景颜色，我做错了什么

How to change the background color for google chart API, what am i doing wrong

本文关键字：颜色 背景 什么 错了 API 何改变 改变 谷歌      更新时间：2023-09-26

这是我的代码，就图表背景颜色而言，它有什么问题。。。

我知道其他一切都有效，但我无法改变背景色。我一直在看文档，不断得出同样的结论。。。没有什么

代码本身检索所有指定的变量，构建图表并更改**HTML背景，但无法接收图表背景颜色更改

<html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <?php echo "<style> body, div {background-color: #".$_GET['color']."} </style>"?>
    <script type="text/javascript">
      google.charts.load('current', {'packages':['bar']});
      google.charts.setOnLoadCallback(drawStuff);

      var goal = <?php echo $_GET['goal']; ?>;
      var complete = <?php echo $_GET['complete']; ?>;
      var dmr = <?php echo $_GET['dmr']; ?>;
      var wysb = <?php echo $_GET['wysb']; ?>;
      function drawStuff() {
        var data = new google.visualization.arrayToDataTable([
          ['Type', 'Quantity:'],
          ["Goal", goal],
          ["Complete", complete],
          ["DMR", dmr],
          ["W.Y.S.B.", wysb],
        ]);
        var options = {
          title: 'Productivity Monitor',
          width: 900,
          legend: { position: 'none' },
          chart: { title: 'Productivity Monitor',
                   subtitle: 'Comparative Chart with color indicator background' },
          bars: 'horizontal', // Required for Material Bar Charts.
          backgroundColor :{fill : '<?php echo "#".$_GET["color"]; ?>' },
          axes: {
            x: {
              0: { side: 'top', label: 'Percentage'} // Top x-axis.
            }
          },
          bar: { groupWidth: "90%" }
        };
        var chart = new google.charts.Bar(document.getElementById('top_x_div'));
        chart.draw(data, options);
      };
    </script>
  </head>
  <body>
    <div id="top_x_div" style="width: 900px; height: 500px;"></div>
  </body>
</html>

使用此：

chart.draw(data, google.charts.Bar.convertOptions(options));

取而代之的是：

chart.draw(data, options);

发件人https://developers.google.com/chart/interactive/docs/gallery/barchart:

材料图表处于测试阶段。外观和交互性基本上是最终的，但经典图表中的许多选项它们中尚未提供。你可以找到一个选项列表但在这个问题上得到了支持。

此外，声明选项的方式尚未最终确定，因此您必须通过替换以下行转换您的选项：

chart.draw（数据，选项）；

这个：

chart.draw（数据，googlecharts.Bar.convertOptions（选项））；

相关文章：