页面上的3个Google图表均不显示任何内容

时间:2019-07-16 11:09:40

标签: charts google-visualization

当前,我正在尝试在一个页面上显示3个Google图表,但是该页面为空白,它不显示任何图表。最初显示第一张图,然后它起作用了,但是自从我附上第二张图以来(即使我删除了它,所以只有第一张图会再次显示),我的页面完全空白,我也不知道为什么。

能请你帮我吗?

这是我的代码(我在页面顶部设置了$ conn和$ _SESSION变量):

编辑:这是有关我的浏览器中源代码的图片: [![sourcecode] [1]] [1]我不明白的是,它似乎希望data1和data2拥有其他值,这就是为什么图表不显示的原因...

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Dashboard</title>
    <link rel="stylesheet" href="styles.css">
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">

        // Load Charts and the corechart package.
        google.load('current', callback: drawCharts, {packages:['column', 'pie']});

        // Set a callback to run when the Google Visualization API is loaded.
        google.setOnLoadCallback(drawCharts);

        // Callback that creates and populates a data table, instantiates the pie chart, passes in the data and draws it.
        function drawCharts() {
            var data1 = google.visualization.arrayToDataTable([
            ['Classification', 'Number of assets'],
            <?php

                if ($_SESSION['user_type'] == 'admin') {
                    $sql = "SELECT Classification, count('Classification') as count FROM `assets` GROUP BY Classification ORDER BY FIELD(Classification, 'high', 'medium', 'low')";
                }else{
                    $sql = "SELECT Classification, count('Classification') as count FROM `assets` WHERE Responsible =".$_SESSION['name']." GROUP BY Classification ORDER BY FIELD(Classification, 'high', 'medium', 'low')";    
                }   
                $result = mysqli_query($conn,$sql);
                while ($result2=mysqli_fetch_array($result)) {
                echo "['".$result2['Classification']."',".$result2['count']."],";       
                }
            ?>
            ]);

            var data2 = google.visualization.arrayToDataTable([
            ['Risks', 'Percentage'],
            <?php

                if ($_SESSION['user_type'] == 'admin') {
                    $sql = "SELECT Compliant = (SELECT count('id') FROM `risks` WHERE targetrisk >= residualrisk), Non-compliant = (SELECT count('id') FROM `risks` WHERE targetrisk < residualrisk) FROM risks ";
                }else{
                    $sql = "SELECT Compliant = (SELECT count('id') FROM `risks` WHERE responsible =".$_SESSION['name']." AND targetrisk >= residualrisk), Non-compliant = (SELECT count('id') FROM `risks` WHERE ".$_SESSION['name']." AND targetrisk < residualrisk) FROM risks "; 
                }   
                $results = mysqli_query($conn,$sql);
                while ($result2=mysqli_fetch_array($results)) {
                echo "['".$result2['Compliant']."',".$result2['Non-compliant']."],";        
                }
            ?>
            ]);

            var data3 = google.visualization.arrayToDataTable([
            ['Assets', 'Percentage'],
            <?php

                if ($_SESSION['user_type'] == 'admin') {
                    $sql = "SELECT count('Asset_name') as Assets, count(`risks`.`assettag`) as Compliant assets FROM `assets`, `risks` JOIN `assettag` ON `assets`.`Tag` = `risks`.`assettag` ";
                }else{
                    $sql = "SELECT count('Asset_name') as Assets, count(`risks`.`assettag`) as Compliant assets FROM `assets`, `risks` JOIN `assettag` ON `assets`.`Tag` = `risks`.`assettag` AND responsible =".$_SESSION['name']."";  
                }   
                $results = mysqli_query($conn,$sql);
                while ($result2=mysqli_fetch_array($results)) {
                echo "['".$result2['Assets']."',".$result2['Compliant assets']."],";        
                }
            ?>
            ]);

            var options1 = {
            title: 'Asset classification',
            legend: { position: 'none' },
            width: 900,
            height: 500
            };

            var options2 = {
            title: 'Risk compliance',
            legend: { position: 'none' },
            width: 900,
            height: 500
            };

            var options3 = {
            title: 'Asset compliance',
            legend: { position: 'none' },
            width: 900,
            height: 500
            };

            var chart1 = new google.visualization.ColumnChart(document.getElementById("columnchart"));
            chart1.draw(data1, options1);

            var chart2 = new google.visualization.PieChart(document.getElementById("piechart"));
            chart2.draw(data2, options2);

            var chart3 = new google.visualization.PieChart(document.getElementById("piechart2"));
            chart3.draw(data3, options3);
        }
    </script>   
</head>
<body>
    <div id="columnchart"></div>
    <br>
    <div id="piechart" ></div>
    <br>
    <div id="piechart2" ></div>
</body>
</html> 


  [1]: https://i.stack.imgur.com/f2u3D.png

0 个答案:

没有答案