javascript - 出现 Google 饼图的标题，但该图表未出现在浏览器中

Question

我编写了代码，使用谷歌饼图从 mySQL 数据库中动态表示一家公司一周的费用。我的代码没有任何错误。图表的标题正在显示，但图表未显示在浏览器中。如果你们能提供帮助，我会很高兴。

用于从数据库中SELECT数据的PHP代码如下:

<?php

$host='localhost';
$user='root';
$pass='xxxx';
$db='petrol_bunk';

$con=mysqli_connect($host,$user,$pass) or die("Not Connected");
mysqli_select_db($con,$db) or die("DB Not Found");  

$query ="SELECT SUM(`auditing`), SUM(`assests`), SUM(`advertisements`),SUM(`bank_charges`), SUM(`driver_bata`), SUM(`electricity`), SUM(`food`), SUM(`maintenance`), SUM(`printing`), SUM(`salary`), SUM(`office_supplies`), SUM(`taxes`), SUM(`tele_internet`),SUM(`generator`)*AVG(`hsd_price`), SUM(`others`) FROM `daily_expenses` WHERE `date` between date_sub(now(),INTERVAL 1 WEEK) and now();";

$resultPieWeek=mysqli_query($con,$query);?>

脚本代码部分如下:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

    <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>

    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>

    <script type="text/javascript" src="https://www.google.com/jsapi"></script>

    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

    <script type="text/javascript">

    $(function() {
          $( 'ul.nav li' ).on( 'click', function() {
                $( this ).parent().find( 'li.active' ).removeClass( 'active' );
                $( this ).addClass( 'active' );
          });

    });  
    google.charts.load('current', {'packages':['corechart','timeline','table']});


    function drawPieWeekChart(){


        var data = google.visualization.arrayToDataTable([ 
        ['Type of Expenditure', 'Amount'],

                    <?php 

                    $row=mysqli_fetch_array($resultPieWeek);

                    echo "['Auditing','".$row[0]."'],['Assests','".$row[1]."'], ['Advertisements', '".$row[2]."'],['Bank Charges', '".$row[3]."'], ['Driver Bata', '".$row[4]."'],['Electricity','".$row[5]."'],['Food','".$row[6]."'],['Maintenance','".$row[7]."'], ['Printing','".$row[8]."'],['Salary','".$row[9]."'], ['Office Supplies','".$row[10]."'],['Taxes','".$row[11]."'],['Telephone and Internet','".$row[12]."'],['Petrol for Generator','".$row[13]."'],['Others','".$row[14]."']";
                    ?>
                    ]);


        var options = {
            title: "THIS WEEK's EXPENDITURE"
        };

        var chart = new google.visualization.PieChart(document.getElementById('pieWeek'));

        chart.draw(data, options);

    }


    google.charts.setOnLoadCallback(drawPieWeekChart); 


</script>

我用来调用图表的 HTML 代码如下:

<div class="tab-content">

<div role="tabpanel" class="tab-pane active" id="weekly_exp">
      <div id="pieWeek"></div>
</div>

提前谢谢大家。我在这里吓坏了。

Answer 1

您需要从值中删除引号，它们应该是数字，而不是字符串...

echo "['Auditing',".$row[0]."],['Assests',".$row[1]."],...