Question

这是我第一次在我使用的页面中使用highcharts： http://www.highcharts.com/demo/column-drilldown/sand-signika][1]

我通过php从我的数据库中获取数据并将其放入数组中。

PHP代码：

    $users = array();
    $i = 0; 
    $month = array();
    $query = mssql_query("SELECT count(startdate) as start,  month(startdate) as month, year(startdate) as year
                FROM tblUsers
                WHERE startdate >=  convert(varchar(20),'$startdate',121) AND startdate <= convert(varchar(20),'$endate',121) 
                GROUP BY  month(startdate), year(startdate) 
                ORDER BY  year(startdate) ASC, month(startdate) ASC ");

         //$startdate and $endate is from datepicker in my html page

while ($data = mssql_fetch_array($query))
                {
                    if ($data['year'] != $i)
                        {
                            $i = $data['year'];

                            $case[$data['year']] = array();
                            $month[$data['year']] = array();
                        }
                    array_push($case[$data['year']], $data['incept']);
                    array_push($month[$data['year']], $data['month']);



                }

例如，如果用户输入，开始日期：2011年7月1日和结束日期：2013年7月31日

结果：

users[] = Array ( 
[2011] => Array ( 
                    [0] => 166 
                    [1] => 144 
                    [2] => 158 
                    [3] => 211 
                    [4] => 160 
                    [5] => 124 
                ) 
[2012] => Array ( 
                    [0] => 142 
                    [1] => 154 
                    [2] => 158 
                    [3] => 150 
                    [4] => 177 
                    [5] => 187 
                    [6] => 191 
                    [7] => 185 
                    [8] => 175 
                    [9] => 185 
                    [10] => 145 
                    [11] => 148 
                ) 
[2013] => Array ( 
                    [0] => 156 
                    [1] => 141 
                    [2] => 178 
                    [3] => 165 
                    [4] => 170 
                    [5] => 196 
                    [6] => 182 
                ) 
    ) 

month[] = Array ( 
[2011] => Array ( 
                [0] => JUL 
                [1] => AUG 
                [2] => SEP 
                [3] => OCT 
                [4] => NOV 
                [5] => DEC 
                ) 
[2012] => Array ( 
                [0] => JAN 
                [1] => FEB 
                [2] => MAR 
                [3] => APR 
                [4] => MAY 
                [5] => JUN 
                [6] => JUL 
                [7] => AUG 
                [8] => SEP 
                [9] => OCT 
                [10] => NOV 
                [11] => DEC 
                ) 
[2013] => Array ( 
                [0] => JAN 
                [1] => FEB 
                [2] => MAR 
                [3] => APR 
                [4] => MAY 
                [5] => JUN 
                [6] => JUL 
                ) 
            )

我想要发生的是，如果图表加载，首先看到的是每年的总数据，然后当我点击它将按MONTH钻取的年份时。

有可能吗？。

Answer 1

你需要准备这样的东西。

<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/drilldown.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
$(function () {    

// Create the chart
$('#container').highcharts({
    chart: {
        type: 'column'
    },
    title: {
        text: 'Basic drilldown'
    },
    xAxis: {
        type: 'category'
    },

    legend: {
        enabled: false
    },

    plotOptions: {
        series: {
            borderWidth: 0,a
            dataLabels: {
                enabled: true,
            }
        }
    },

    series: [{
        name: 'Things',
        colorByPoint: true,
        data: [{
            name: 'Animals',
            y: 5,
            drilldown: 'animals'
        }, {
            name: 'Fruits',
            y: 2,
            drilldown: 'fruits'
        }, {
            name: 'Cars',
            y: 4,
            drilldown: 'cars'
        }]
    }],
    drilldown: {
        series: [{
            id: 'animals',
            data: [
                ['Cats', 4],
                ['Dogs', 2],
                ['Cows', 1],
                ['Sheep', 2],
                ['Pigs', 1]
            ]
        }, {
            id: 'fruits',
            data: [
                ['Apples', 4],
                ['Oranges', 2]
            ]
        }, {
            id: 'cars',
            data: [
                ['Toyota', 4],
                ['Opel', 2],
                ['Volkswagen', 2]
            ]
        }]
    }
})
 });

小提琴：http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/drilldown/basic/

包含来自sql数据库的数据的Highcharts

1 个答案: