Highcharts不能正确加载我的数据

时间:2017-01-20 14:01:21

标签: highcharts

我尝试了几种类型的输出。我已经拥有的是:

JSON输出:

["[Date.UTC(2015,6,13,16,41,05), 3]","[Date.UTC(2015,7,15,16,41,05), 1]","[Date.UTC(2015,8,18,16,41,05), 4]","[Date.UTC(2015,9,28,16,41,05), 3]","[Date.UTC(2015,10,20,16,41,05), 1]","[Date.UTC(2015,10,28,16,41,05), 5]","[Date.UTC(2015,11,13,16,41,05), 1]","[Date.UTC(2015,11,21,16,41,05), 2]","[Date.UTC(2015,11,24,16,41,05), 1]","[Date.UTC(2015,11,25,16,41,05), 2]","[Date.UTC(2015,11,28,16,41,05), 1]","[Date.UTC(2016,0,03,16,41,05), 2]","[Date.UTC(2016,0,09,16,41,05), 4]","[Date.UTC(2016,0,14,16,41,05), 6]","[Date.UTC(2016,0,17,16,41,05), 3]","[Date.UTC(2016,0,18,16,41,05), 3]","[Date.UTC(2016,0,20,16,41,05), 2]","[Date.UTC(2016,0,21,16,41,05), 2]","[Date.UTC(2016,0,22,16,41,05), 2]","[Date.UTC(2016,0,23,16,41,05), 1]","[Date.UTC(2016,0,24,16,41,05), 5]","[Date.UTC(2016,0,25,13,41,05), 1]","[Date.UTC(2016,0,25,16,41,00), 1]","[Date.UTC(2016,0,25,16,41,05), 1]","[Date.UTC(2016,0,27,16,41,05), 1]","[Date.UTC(2016,0,28,16,41,05), 1]","[Date.UTC(2016,0,29,16,41,05), 1]","[Date.UTC(2016,1,09,16,41,05), 1]","[Date.UTC(2016,1,10,16,41,05), 2]","[Date.UTC(2016,1,11,16,41,05), 3]","[Date.UTC(2016,1,15,16,41,05), 2]","[Date.UTC(2016,1,18,16,41,05), 1]","[Date.UTC(2016,1,21,16,41,05), 1]","[Date.UTC(2016,1,23,16,41,05), 1]","[Date.UTC(2016,1,24,16,41,05), 1]","[Date.UTC(2016,1,25,16,41,05), 1]","[Date.UTC(2016,1,26,16,41,05), 1]","[Date.UTC(2016,1,28,16,41,05), 1]","[Date.UTC(2016,2,01,16,41,05), 1]","[Date.UTC(2016,2,02,16,41,05), 1]","[Date.UTC(2016,2,05,16,41,05), 1]","[Date.UTC(2016,2,12,16,41,05), 1]","[Date.UTC(2016,2,21,16,41,05), 1]","[Date.UTC(2016,3,25,16,41,05), 1]","[Date.UTC(2016,4,05,16,41,05), 2]","[Date.UTC(2016,4,11,16,41,05), 1]","[Date.UTC(2016,4,12,16,41,05), 1]","[Date.UTC(2016,4,24,16,41,05), 1]","[Date.UTC(2016,4,25,16,41,05), 1]","[Date.UTC(2016,5,01,16,41,05), 1]","[Date.UTC(2016,5,12,16,41,05), 1]","[Date.UTC(2016,5,25,10,41,05), 1]","[Date.UTC(2016,5,25,16,41,05), 1]","[Date.UTC(2016,6,01,10,41,05), 1]","[Date.UTC(2016,6,01,16,41,05), 1]","[Date.UTC(2016,6,02,16,41,05), 1]","[Date.UTC(2016,6,25,16,21,05), 1]","[Date.UTC(2016,6,25,16,41,05), 1]","[Date.UTC(2016,7,13,16,41,05), 1]","[Date.UTC(2016,7,28,16,41,05), 1]","[Date.UTC(2016,8,20,16,41,05), 3]","[Date.UTC(2016,8,29,16,41,05), 2]","[Date.UTC(2016,9,01,14,20,18), 1]","[Date.UTC(2016,9,09,14,20,18), 1]","[Date.UTC(2016,9,10,14,20,18), 1]","[Date.UTC(2016,9,28,14,20,18), 2]","[Date.UTC(2016,9,30,14,20,18), 2]","[Date.UTC(2016,10,01,13,44,29), 1]","[Date.UTC(2016,10,06,08,26,18), 2]","[Date.UTC(2016,10,10,13,44,29), 1]","[Date.UTC(2016,10,13,13,44,29), 2]","[Date.UTC(2016,10,14,19,13,42), 4]","[Date.UTC(2016,10,15,23,27,39), 3]","[Date.UTC(2016,11,06,19,04,06), 3]","[Date.UTC(2016,11,08,10,49,28), 3]","[Date.UTC(2016,11,10,23,01,44), 1]","[Date.UTC(2016,11,14,21,27,44), 1]","[Date.UTC(2016,11,15,23,27,44), 2]","[Date.UTC(2016,11,15,23,27,53), 3]","[Date.UTC(2016,11,18,18,06,28), 1]","[Date.UTC(2016,11,21,20,06,28), 3]","[Date.UTC(2016,11,23,20,06,20), 5]","[Date.UTC(2016,11,29,20,18,18), 3]","[Date.UTC(2017,0,03,20,06,32), 3]"]

看起来不错! 我在PHP上所做的工作是:

header("Content-type: text/json");

    if($callback == 'cart-filling') {
        // Count cart rows
        $db = JFactory::getDbo();
        $query = $db->getQuery(true);
        $query
            ->select('*')
            ->from($db->quoteName('#__product_shoppingcart'))
            ->where($db->quoteName('date') . $scope);
        $db->setQuery($query);
        $results = $db->loadObjectList();
        $ret = array();
        foreach($results as $result) {
            //$x = date_format($date, 'Y-m-d H:i:s');

            $date = new DateTime($result->date);
            $month = date_format($date, 'm');
            $monthInt = (int) $month-1;
            $date_part1 = date_format($date, 'Y');
            $date_part2 = $monthInt;
            $date_part3 = date_format($date, 'd');
            $date_part4 = date_format($date, 'H');
            $date_part5 = date_format($date, 'i');
            $date_part6 = date_format($date, 's');
            $formatted_date = (int) $date_part1 . ',' . (int) $date_part2 . ',' . (int) $date_part3 . ',' . (int) $date_part4 . ',' . (int) $date_part5 . ',' . (int) $date_part6;
            /*
            $date = new DateTime($result->date);
            $x = date_format($date, "Y-m-d H:i:s");
            */
            $x = $formatted_date;
            $y = $result->qty;
            //array_push($ret, array($x, $y));

            //extract $row;
           //$x = 'Date.UTC(' . $x . ')'; // convert from Unix timestamp to JavaScript time
           $data[] = "[Date.UTC($x), $y]";
        }
    }
    // Returning JSON string regarding the given callback and dtae
    echo json_encode($data);

我的AJAX电话说:

function cartFilling() {
        var url = 'components/com_product/views/reports/callback.php?callback=cart-filling&date='+date_scope;
        jQuery.getJSON(url, function (data) {
            Highcharts.chart('cartFilling', {
                chart: {
                    zoomType: 'x'
                },
                title: {
                    text: 'Shopping Cart Filling Actions'
                },
                subtitle: {
                    text: document.ontouchstart === undefined ?
                            'Click and drag in the plot area to zoom in' : 'Pinch the chart to zoom in'
                },
                xAxis: {
                    type: 'datetime'
                },
                yAxis: {
                    title: {
                        text: 'Carts Filled'
                    },
                    type: 'number'
                },
                legend: {
                    enabled: false
                },
                plotOptions: {
                    area: {
                        fillColor: {
                            linearGradient: {
                                x1: 0,
                                y1: 0,
                                x2: 0,
                                y2: 1
                            },
                            stops: [
                                [0, Highcharts.getOptions().colors[0]],
                                [1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
                            ]
                        },
                        marker: {
                            radius: 2
                        },
                        lineWidth: 1,
                        states: {
                            hover: {
                                lineWidth: 1
                            }
                        },
                        threshold: null
                    }
                },

                series: [{
                    type: 'area',
                    name: 'Cart Filling',
                    data: data
                }]
            });
        });
    }

所以,“数据”已经是:

[Date.UTC(2015,6,13,16,41,5), 3],[Date.UTC(2015,7,15,16,41,5), 1],[Date.UTC(2015,8,18,16,41,5), 4],[Date.UTC(2015,9,28,16,41,5), 3],[Date.UTC(2015,10,20,16,41,5), 1],[Date.UTC(2015,10,28,16,41,5), 5],[Date.UTC(2015,11,13,16,41,5), 1],[Date.UTC(2015,11,21,16,41,5), 2],[Date.UTC(2015,11,24,16,41,5), 1],[Date.UTC(2015,11,25,16,41,5), 2],[Date.UTC(2015,11,28,16,41,5), 1],[Date.UTC(2016,0,3,16,41,5), 2],[Date.UTC(2016,0,9,16,41,5), 4],[Date.UTC(2016,0,14,16,41,5), 6],[Date.UTC(2016,0,17,16,41,5), 3],[Date.UTC(2016,0,18,16,41,5), 3],[Date.UTC(2016,0,20,16,41,5), 2],[Date.UTC(2016,0,21,16,41,5), 2],[Date.UTC(2016,0,22,16,41,5), 2],[Date.UTC(2016,0,23,16,41,5), 1],[Date.UTC(2016,0,24,16,41,5), 5],[Date.UTC(2016,0,25,13,41,5), 1],[Date.UTC(2016,0,25,16,41,0), 1],[Date.UTC(2016,0,25,16,41,5), 1],[Date.UTC(2016,0,27,16,41,5), 1],[Date.UTC(2016,0,28,16,41,5), 1],[Date.UTC(2016,0,29,16,41,5), 1],[Date.UTC(2016,1,9,16,41,5), 1],[Date.UTC(2016,1,10,16,41,5), 2],[Date.UTC(2016,1,11,16,41,5), 3],[Date.UTC(2016,1,15,16,41,5), 2],[Date.UTC(2016,1,18,16,41,5), 1],[Date.UTC(2016,1,21,16,41,5), 1],[Date.UTC(2016,1,23,16,41,5), 1],[Date.UTC(2016,1,24,16,41,5), 1],[Date.UTC(2016,1,25,16,41,5), 1],[Date.UTC(2016,1,26,16,41,5), 1],[Date.UTC(2016,1,28,16,41,5), 1],[Date.UTC(2016,2,1,16,41,5), 1],[Date.UTC(2016,2,2,16,41,5), 1],[Date.UTC(2016,2,5,16,41,5), 1],[Date.UTC(2016,2,12,16,41,5), 1],[Date.UTC(2016,2,21,16,41,5), 1],[Date.UTC(2016,3,25,16,41,5), 1],[Date.UTC(2016,4,5,16,41,5), 2],[Date.UTC(2016,4,11,16,41,5), 1],[Date.UTC(2016,4,12,16,41,5), 1],[Date.UTC(2016,4,24,16,41,5), 1],[Date.UTC(2016,4,25,16,41,5), 1],[Date.UTC(2016,5,1,16,41,5), 1],[Date.UTC(2016,5,12,16,41,5), 1],[Date.UTC(2016,5,25,10,41,5), 1],[Date.UTC(2016,5,25,16,41,5), 1],[Date.UTC(2016,6,1,10,41,5), 1],[Date.UTC(2016,6,1,16,41,5), 1],[Date.UTC(2016,6,2,16,41,5), 1],[Date.UTC(2016,6,25,16,21,5), 1],[Date.UTC(2016,6,25,16,41,5), 1],[Date.UTC(2016,7,13,16,41,5), 1],[Date.UTC(2016,7,28,16,41,5), 1],[Date.UTC(2016,8,20,16,41,5), 3],[Date.UTC(2016,8,29,16,41,5), 2],[Date.UTC(2016,9,1,14,20,18), 1],[Date.UTC(2016,9,9,14,20,18), 1],[Date.UTC(2016,9,10,14,20,18), 1],[Date.UTC(2016,9,28,14,20,18), 2],[Date.UTC(2016,9,30,14,20,18), 2],[Date.UTC(2016,10,1,13,44,29), 1],[Date.UTC(2016,10,6,8,26,18), 2],[Date.UTC(2016,10,10,13,44,29), 1],[Date.UTC(2016,10,13,13,44,29), 2],[Date.UTC(2016,10,14,19,13,42), 4],[Date.UTC(2016,10,15,23,27,39), 3],[Date.UTC(2016,11,6,19,4,6), 3],[Date.UTC(2016,11,8,10,49,28), 3],[Date.UTC(2016,11,10,23,1,44), 1],[Date.UTC(2016,11,14,21,27,44), 1],[Date.UTC(2016,11,15,23,27,44), 2],[Date.UTC(2016,11,15,23,27,53), 3],[Date.UTC(2016,11,18,18,6,28), 1],[Date.UTC(2016,11,21,20,6,28), 3],[Date.UTC(2016,11,23,20,6,20), 5],[Date.UTC(2016,11,29,20,18,18), 3],[Date.UTC(2017,0,3,20,6,32), 3]

此外, 我也尝试过序列化这些方法:

data: [data]

data: ([data])

最有趣的部分是,当我为“data:”手动插入生成的数据时,它可以工作。但是当我调用它的var时它什么也没做。我的四天浪费了! 跟我有什么关系?这里发生了什么?我已经厌倦了等待,提出错误的问题,得到错误的答案并收到我的问题的负面评价:(请Highcharts的某位专家做出反应,否则我会用这台笔记本电脑做坏事!

谢谢

0 个答案:

没有答案