Google 图表问题与图表上的值有关

Question

嘿，谁能帮我解决 google 图表的问题。

问题是数字未按比例缩放 1、2、3 ... 您可以在图表左侧的图像上看到。

JavaScript 和 PHP 代码

<script type="text/javascript">
    google.charts.load('current', {'packages':['bar']});
    google.charts.setOnLoadCallback(drawChart);

    function drawChart() {
      var data = google.visualization.arrayToDataTable([
        ['Data', 'Count' , 'Approved' , 'Drafted'],
        <?php
      $elements_text = ['Posts' , 'Categories', 'Users','Comments'];
      $element_count =[$post_count,$categories_count,$users_count,$comment_count];
      $element_published = [$published_posts,'0',$admins_count,$approved_comments_count];
      $element_drafted = [$drafted_posts,'0',$subscriber_count,$unapproved_comments_count];


      for($i =0; $i<4 ; $i++){
        echo "['{$elements_text[$i]}'" . "," . "'{$element_count[$i]}'" . "," . "'{$element_count[$i]}'" . "," . "'{$element_drafted[$i]}'],";
      }
         ?>


      ]);

      var options = {
        chart: {
          title: 'Admin data',
          subtitle: 'Charst panel',
        }
      };

      var chart = new google.charts.Bar(document.getElementById('columnchart_material'));

      chart.draw(data, google.charts.Bar.convertOptions(options));
    }
</script>

你可以看到 6 小于 0 :D

Answer 1

重要的是，这不是将数据从 PHP 传递到 JavaScript 的方法。在任何情况下都不要尝试建立自己的 JSON 或其他类似结构；它永远不会始终如一地工作。为此使用 json_encode()。除了正确地转义字符串外，它还确保正确传递整数。

<?php
$elements = [
    ["Data", "Count", "Approved", "Drafted"],
    ["Posts", $post_count, $published_posts, $drafted_posts],
    ["Categories", $categories_count, 0, 0],
    ["Users", $users_count, $admins_count, $subscriber_count],
    ["Comments", $comment_count, $approved_comments_count, $unapproved_comments_count],
];
?>
<script>
google.charts.load("current", {packages: ["bar"]});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
    const elements = <?= json_encode($elements) ?>;
    const data = google.visualization.arrayToDataTable(elements);
    const options = {chart: {title: "Admin data", subtitle: "Chart data"}};
    const chart = new google.charts.Bar(document.getElementById("columnchart_material"));
    chart.draw(data, google.charts.Bar.convertOptions(options));
}
</script>

如果您在修复此代码后问题仍然存在，我建议您查看您传递给图表的数据，因为它可能不是您所期望的。由于您的原始代码重复来自 $element_count[$i] 的数据，这可能是您的问题。

Google 图表问题与图表上的值有关

Google charts problem with values on charts

javascript

php

google-visualization