Question

我正在使用Knockout.js对OTRS REST api生成图表 Highcharts，但有一些奇怪的原因，我正在添加到Highcharts系列似乎成倍增加。

这是我的Knockout.js模型：

function OTRSViewModel() {
    var self = this;
    self.api_url = 'https://localhost/otrs/nph-genericinterface.pl/Webservice/REST-API';
    self.username = 'api_user';
    self.password = '';

    self.priorities = [
        'WHITE',
        'GREEN',
        'AMBER',
        'ORANGE',
        'RED'
    ];


    self.queues = [
        ‘Queue1’,
        ‘Queue2’,
        'Queue3'
    ];

    self.selectedQueues = ko.observableArray();
    self.selectedPriorities = ko.observableArray();

    self.statsByQueueAndPriority = function() {
        var endpoint = '/Ticket/Search';
        chart.xAxis[0].setCategories(self.selectedQueues());

        // iterate over every queue
        async.each(self.selectedPriorities(), function(priority){
            var tmp = {};
            tmp.name = priority;
            tmp.data = [];

            // iterate over each priority
            async.each(self.selectedQueues(), function(queue){
                // otrs search parameters
                var api_data = {
                    'UserLogin': self.username,
                    'Password': self.password,
                    'Queues': queue,
                    'Limit': 10000,
                    'Priority': priority
                };

                 // do otrs request
                 $.ajax({
                    'url': self.api_url + endpoint,
                    'type': 'POST',
                    'dataType': 'json',
                    'data': JSON.stringify(api_data)
                })
                    .success(function(data) {
                        tmp.data.push(data.TicketID.length);
                        chart.addSeries(tmp);
                    });
            });
        });
    };
};

这是我的HTML代码：

<div id="graph-input" class="top-container">
    <form class="form-inline">
        <div class="form-group">
            <h4>Queue</h4>
            <select class="form-control" data-bind="options: queues, selectedOptions: selectedQueues" size="5" multiple="true">               </select>
        </div>
        <div class="form-group">
            <h4>Priority</h4>
            <select class="form-control" data-bind="options: priorities, selectedOptions: selectedPriorities" size="5" multiple="true"></select>
        </div>
        <button class="btn btn-primary" data-bind="enable: selectedQueues, click: statsByQueueAndPriority">Generate Statistics</button>
    </form>
</div>
<hr/>

<div id="graph" style="min-width: 310px; height: 800px; margin: 0 auto"></div>
<script type="text/javascript">
    var chart;
    var highchart_options = {
        chart: {
            renderTo: 'graph',
            type: 'bar'
    },
        title: {
            text: 'Queues - Priority'
        },
    };
    chart = new Highcharts.Chart(highchart_options);

    ko.applyBindings(new OTRSViewModel(), $('graph-input')[0]);

</script>

这导致以下图表：

正如你所看到的那样，这个系列似乎在倍增，有谁知道如何解决这个问题？

Highcharts图系列倍增

0 个答案: