如何从Highcharts饼图切片的数据库名称中获取

时间:2014-08-21 14:04:44

标签: javascript php json charts highcharts

我设法在Highcharts上制作饼图,因为我想显示数据。

像这样:

  

data.php

<?php
$con = mysql_connect("localhost","user","psw");

if (!$con) {
  die('Could not connect: ' . mysql_error());
}

mysql_select_db("ftsosticket", $con);

$result = mysql_query("SELECT COUNT(ticket_id) FROM ost_ticket GROUP BY dept_id") or die ("Error in query: $query. ".mysql_error());

$rows = array();
while($r = mysql_fetch_array($result)) {
    $row[0] = $r[0];
    /*$row[1] = $r[1];*/
    array_push($rows,$row);
}

print json_encode($rows, JSON_NUMERIC_CHECK);

mysql_close($con);
?>

所以对于显示器,我使用了这个例子index.html

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Test Pie Graphics</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
        <script type="text/javascript">
        $(document).ready(function() {
            var options = {
                chart: {
                    renderTo: 'container',
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false
                },
                title: {
                    text: 'Facility Explotacion Sistema'
                },
                tooltip: {
                    formatter: function() {
                        return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %';
                    }
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            color: '#000000',
                            connectorColor: '#000000',
                            formatter: function() {
                                return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %';
                            }
                        }
                    }
                },
                series: [{
                    type: 'pie',
                    name: 'Browser share',
                    data: []
                }]
            }

            $.getJSON("data.php", function(json) {
                options.series[0].data = json;
                chart = new Highcharts.Chart(options);
            });



        });   
        </script>
        <script src="http://code.highcharts.com/highcharts.js"></script>
        <script src="http://code.highcharts.com/modules/exporting.js"></script>
    </head>
    <body>
        <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
    </body>
</html>

所以在最后的显示中我只获得了Slice和%作为结果

我使用此代码从数据库中获取数据,以便使用Slice名称而不是$ .getJSON默认值,但是,无效。

 $.ajax({
            url: 'data.php', 
            success: function(jsonData) {
                chart = new Highcharts.Chart({
                <snip>
                        series: [{
                          type: 'pie',
                          name: 'Content',
                          data: jsonData
                        }]
                <snip>
            },
            cache: false
        });

那么,问题是,如何直接从数据库中取名?我知道它会像(1,2,3,4等等),因为这是部门名称,但是,解决后,我可以将其覆盖到真正的部门名称。

提前致谢。

  

修改

我测试了查询,我发现只有每个id的票据,没有拿到相应的dept_id,所以我将句子改为:

"SELECT COUNT(ticket_id), dept_id FROM ost_ticket GROUP BY dept_id"

现在我从查询中得到了这个: COUNT(TICKET_ID):1,2,2。 dept_id为:18,2,11。

但我不知道如何将dept_id带到切片名称上。

0 个答案:

没有答案