javascript - Highcharts graph series multiplies -
i'm using knockout.js towards otrs rest api generate graphs in highcharts, of odd reason series i'm adding highcharts seems multiplies itself.
this knockout.js model:
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 on every queue async.each(self.selectedpriorities(), function(priority){ var tmp = {}; tmp.name = priority; tmp.data = []; // iterate on 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 }; // 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); }); }); }); }; };
this html code:
<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>
this results in following graph:
as can see series seems multiplying themselves, know how can fix this?
Comments
Post a Comment