2

我希望有人可以在这里帮助我，我一直在看 highcharts 作为从我的 sql db 中绘制动态数据的一种方式....到目前为止我想出的是下面，这很奇怪，看起来正确，数据是正确的，但是，我无法让我的图表呈现，现在我尝试通过 Chrome 和 IE 查看图表但没有结果，任何人都可以看到我可能出错的地方，或者在哪里有一个错误...我的数据正在传递到 JS 数组中，因此渲染结束存在问题...任何帮助将不胜感激。我已经关闭了我的 html 标签，但由于某种原因，它没有显示在这篇文章中……如果有人有任何建议，我会很高兴听到他们的意见！

<html xmlns="http://www.w3.org/1999/xhtml">
<head>  
<script src='highcharts.js' type='text/javascript'> </script>       
    <script src='exporting.js' type='text/javascript'> </script>    
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"type="text/javascript"></script>    

    </head>

<body>

    <?php
    include "connect_db.php";

    $SQL1 =     "SELECT review.reviewForum AS reviewForum, 
                COUNT(CASE WHEN mom.result = 'Approved' THEN 'yes' ELSE NULL END) AS Approved, 
                COUNT(CASE WHEN mom.result = 'NOT Approved' THEN 'yes' ELSE NULL END) AS Not_Approved, 
                COUNT(CASE WHEN mom.result = 'Cancelled' THEN 'yes' ELSE NULL END) AS Cancelled 
                FROM review INNER JOIN mom ON mom.reviewId = review.reviewId GROUP BY review.reviewForum";

    $result1 = mysql_query($SQL1);
    $data1 = array();
    while ($row = mysql_fetch_array($result1)) {
       $data1[] = $row['reviewForum'];
    }

    $result2 = mysql_query($SQL1);
    $data2 = array();
    while ($row = mysql_fetch_array($result2)) {
       $data2[] = $row['Approved'];
    }

    $result3 = mysql_query($SQL1);
    $data3 = array();
    while ($row = mysql_fetch_array($result3)) {
       $data3[] = $row['Not_Approved'];
    }

    $result4= mysql_query($SQL1);
    $data4 = array();
    while ($row = mysql_fetch_array($result4)) {
       $data4[] = $row['Cancelled'];
    }
    ?>

    <script type="text/javascript">
    $(document).ready(function() {
        var chart = new Highcharts.Chart({
              chart: {
                 renderTo: 'container',
                 type: 'column'
              },

            title:  {
                        text: 'TC REVIEW RESULT STATS'
                    },

            xAxis:  {
                        categories: [<?php echo join($data1, ',') ?>],
                    },

            yAxis:  {
                        min:0
                    },

            legend: {
                        layout: 'vertical',
                        backgroundColor: '#FFFFFF',
                        align: 'left',
                        verticalAlign: 'top',
                        x: 50,
                        y: 35,
                        floating: true,
                        shadow: true
                    },

            plotOptions: {
                            column: {
                                        pointPadding: 0.2,
                                        borderWidth: 0
                                    }
                        },

            series: [   {
                            name: 'Approved',
                            data: [<?php echo join($data2, ',') ?>],
                            pointStart: 0
                            //pointInterval
                        },

                        {

                            name: 'Unapproved',
                            data: [<?php echo join($data3, ',') ?>],
                            pointStart: 0
                            //pointInterval
                        },

                        {
                            name: 'Cancelled',
                            data: [<?php echo join($data4, ',') ?>],
                            pointStart: 0
                            //pointInterval
                        },
                    ]
        });
});
    </script>

    <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>

</body>

4

3 回答 3

1

我建议您开始尝试在不生成代码的情况下渲染一个。如果这不起作用，您可能想在 jsfiddle 上分享它，我们可以看看 :-)。如果它确实有效，您应该将其与生成的代码进行比较。

    {
        name: 'Cancelled',
        data: [<?php echo join($data4, ',') ?>],
        pointStart: 0
        //pointInterval
    }, // This comma is a syntax error
]

你看到那个逗号了吗？您不要在“}”之前放置逗号，因为您在多个地方都有逗号。

于 2012-07-13T11:28:27.080 回答
0

去掉xAxis下的categories语句后面的逗号。

 xAxis:  {
     categories: [<?php echo join($data1, ',') ?>],
 },

应该

xAxis:  {
    categories: [<?php echo join($data1, ',') ?>]
},
于 2012-07-13T13:25:03.603 回答
0

我认为真正的原因在这里：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"type="text/javascript"></script>    
<script src='highcharts.js' type='text/javascript'> </script>       
<script src='exporting.js' type='text/javascript'> </script>

首先加载 jQuery，然后加载 Highcharts。

于 2013-02-27T12:36:00.930 回答