Question

我试图在Highcharts的帮助下创建一些不错的html5图表从OTRS API获取的数据。

我的index.html如下所示：

<!DOCTYPE html>
<head>
    <script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="https://code.highcharts.com/highcharts.js"></script>
    <script src="https://code.highcharts.com/modules/exporting.js"></script>
    <script src="/stats/otrs.js"></script>
</head>

<body>
    <div id="chart" style="min-width: 310px; height: 800px; margin: 0 auto"></div>
    <script type="text/javascript">
        var otrs_url = 'https://otrs-server/otrs/nph-genericinterface.pl';
        var otrs = new OTRS(otrs_url, 'api_user', 'password');

        $(function () {
            $('#chart').highcharts({
                chart: {
                    type: 'bar'
                },
                data: {
                    rows: otrs.statsByQueueAndPriority(['Queue1', 'Queue2'], ['PRI1', 'PRI2'])
                },
                title: {
                    text: 'Queues - Priority'
                }
            });
        });
    </script>
</body>

我的/stats/otrs.js看起来像这样：

var OTRS = function(api_url, username, password) {
this.api_url = api_url;
this.username = username;
this.password = password;
var self = this;

this.otrsRequest = function(api_endpoint, post_data) {
    var url = this.api_url + api_endpoint;
    console.log(url);

    post_data['UserLogin'] = this.username;
    post_data['Password'] = this.password;

    $.ajax({
        'url': url,
        'type': 'POST',
        'dataType': 'json',
        'data': JSON.stringify(post_data)
    })
};

this.statsByQueueAndPriority = function(queues, priorities) {
    var endpoint = '/Webservice/JSON/Ticket/Search';
    var results = [];
    var newQueues = queues.slice();
    newQueues.unshift(null);
    results.push(newQueues);

    priorities.forEach(function(priority){
        var tmp = [];
        tmp.push(priority);
        queues.forEach(function(queue){
            var api_data = {
                'UserLogin': self.username,
                'Password': self.password,
                'Queues': [queue],
                'Priority': priority
            };

            $.ajax({
                'url': self.api_url + endpoint,
                'type': 'POST',
                'dataType': 'json',
                'data': JSON.stringify(api_data)
            })
                .done(function(data) {
                    tmp.push(data.TicketID.length);
            });

        });
        results.push(tmp)
    });
    console.log(results);
    return results;
    // returns: [[null, 'Queue1', 'Queue2'], ['PRI1', 312, 404] ['PRI2', 102, 201]]
};};

Highcharts标题出现了，所以我想图表已创建，但没有数据如图所示。谁能指出我正确的方向并告诉我我，我做错了什么？

没有填充数据的Highcharts图表

0 个答案: