javascript - Charts using Rally -
i developing custom rally app. pulling data using lookback api , graphing using charts. chart plotted before data retrieved. hence, have command button, trigger chart being reloaded or refreshed or removed , inserted again.
however unable figure out how reload/refresh button.
i have looked @
but not work in case.
any alternative method working welcome.
i have attached app.js used rally-app-sdk. please !
var year = 2013; var month = "07"; var date = 10; var hh = "17"; var mm = "08"; var ss = "00"; var dates = []; var array1 = []; var arrayswqa = []; //var a3= [1, 2, 3]; //console.log(a3.length); var chartconfig; var date1 = year + "-" + month + "-" + date + "t" + hh + ":" + mm + ":" + ss + "z"; console.log(date1); var date2 = year + "-" + month + "-" + (date + 10) + "t" + hh + ":" + mm + ":" + ss + "z"; console.log(date2); date1 = "2013-06-10t15:48:58z"; ext.define('customapp', { extend: 'rally.app.app', componentcls: 'app', id: 'appid', launch: function () { //write app code here console.log('hello world'); (date = 10; date < 21;) { date1 = year + "-" + month + "-" + date + "t" + hh + ":" + mm + ":" + ss + "z"; var dispdate = month + "-" + date; dates.push(dispdate); date = date + 1; date2 = year + "-" + month + "-" + date + "t" + hh + ":" + mm + ":" + ss + "z"; console.log(date1); //date1 = "2013-07-16t12:00:58z"; //date2 = "2013-07-17t12:00:58z"; //getting defect count parent project ie. inclusive of swqa orbis //------------------------------------------------------------------------------------------------- //pasted in last 1 var snapshotstore = ext.create('rally.data.lookback.snapshotstore', { context: { workspace: '/workspace/3274954442' }, find: { //_projecthierarchy: 12280411247, //__at: "2013-07-22t17:10:00z", __validfrom: date1, __validto: date2, //formattedid : 'de12612', //__validfrom: {$lte: "current"}, //__validto:{$gt: "current"}, //__at:date1, __typehierarchy: 'defect' }, listeners: { load: function (store, data, success) { //process data var x = snapshotstore.getcount(); console.log(x); //settimeout(_loadchart(), 3000) } }, fetch: ['name', 'state', 'formattedid', 'openeddate'], order: 'openeddate desc', hydrate: ['state', 'formattedid'], filters: [ { property: '_typehierarchy', operator: '=', value: 'defect' }, { property: '_projecthierarchy', operator: '=', value: 10883100246 //orbis 12280416678 // regicam que 9114502819: regicam exdg }, { property: 'openeddate', operator: '>', value: date1 }, { property: 'openeddate', operator: '<=', value: date2 } ] }); snapshotstore.load({ callback: function (records, operation) { if (operation.wassuccessful()) { //process records var listofdefects = []; (var = 0; < records.length; i++) { //console.log(records[i].data.objectid); var found = listofdefects.indexof(records[i].data.objectid); if (found == -1) { listofdefects.push(records[i].data.objectid); } } console.log("date = " + date1 + "original: " + records.length + " unique" + listofdefects.length); array1.push(listofdefects.length); console.log("list: " + listofdefects); console.log("all orbis:" + array1); } } }); //getting defect count parent project ie. swqa orbis var snapshotstoreswqa = ext.create('rally.data.lookback.snapshotstore', { context: { workspace: '/workspace/3274954442' }, find: { //_projecthierarchy: 12280411247, //__at: "2013-07-22t17:10:00z", __validfrom: date1, __validto: date2, //formattedid : 'de12612', //__validfrom: {$lte: "current"}, //__validto:{$gt: "current"}, //__at:date1, __typehierarchy: 'defect' }, listeners: { load: function (store, data, success) { //process data var x = snapshotstoreswqa.getcount(); console.log(x); //settimeout(_loadchart(), 3000) } }, fetch: ['name', 'state', 'formattedid', 'openeddate'], order: 'openeddate desc', hydrate: ['state', 'formattedid'], filters: [ { property: '_typehierarchy', operator: '=', value: 'defect' }, { property: '_projecthierarchy', operator: 'in', value: [12226454553, 12829981291, 12226458054, 12280417123, 12226539592] // 10883100246 //orbis 12280416678 // regicam que 9114502819: regicam exdg }, { property: 'openeddate', operator: '>', value: date1 }, { property: 'openeddate', operator: '<=', value: date2 } ] }); snapshotstoreswqa.load({ callback: function (records, operation) { if (operation.wassuccessful()) { //process records var listofdefects = []; (var = 0; < records.length; i++) { //console.log(records[i].data.objectid); var found = listofdefects.indexof(records[i].data.objectid); if (found == -1) { listofdefects.push(records[i].data.objectid); } } console.log("date = " + date1 + "original: " + records.length + " unique" + listofdefects.length); arrayswqa.push(listofdefects.length); console.log("list: " + listofdefects); console.log("swqa:" + arrayswqa); } } }); } //endfor this._loadchart(); this.redrawchart(); }, redrawchart: function() { this.remove('chart'); console.log('redrawing'); this.add(chart); }, _loadchart: function () { chartconfig = { chart: { type: 'column' }, title: { text: 'defect kill rate' }, subtitle: { text: 'from date1 date2' }, xaxis: { categories: dates }, yaxis: { min: 0, title: { text: 'defect count (no)' } }, tooltip: { headerformat: '<span style="font-size:10px">{point.key}</span><table>', pointformat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' + '<td style="padding:0"><b>{point.y:.1f} mm</b></td></tr>', footerformat: '</table>', shared: true, usehtml: true }, plotoptions: { column: { pointpadding: 0.2, borderwidth: 0 } }, series: [{ name: 'swqa defects', data: arrayswqa }, { name: 'orbis defects', data: array1 }] }; chart = { xtype: 'rallychart', height: 300, width: 400, id: 'chart1', chartconfig: chartconfig }; button = { xtype: 'rallybutton', text: 'click me', handler: function () { //ext.msg.alert('button', 'you clicked me'); console.clear(); console.log("swqa:" + arrayswqa); console.log("orbis rest:" + array1); var = ext.getcmp('appid'); //a.remove(chart); //a.add(chart); //a.redrawchart(); console.log('callback'); ext.create('rally.ui.chart.chart', { chartconfig: { chart: { zoomtype: "xy" }, xaxis: { title: { text: "date" } }, yaxis: [ { title: { text: "points" } } ], plotoptions: { line: { color: "#000" }, column: { stacking: null, color: "#6ab17d", linecolor: "#666666", linewidth: 1, marker: { linewidth: 1, linecolor: "#666666" }, shadow: false } }, series: [{ name: 'swqa defects', data: arrayswqa }, { name: 'orbis defects', data: array1 }] } //remaining configuration omitted brevity }); }, callback: function(){ } }; this.add(button); this.add(chart); } });
you may see full code example app chart updated new data based on selection in release dropdown here. in code check if chart exists, , remove if before recreating it:
if (this.down('#mychart')) { this.remove('mychart'); } this.add( { xtype: 'rallychart', height: 400, itemid: 'mychart', chartconfig: { //.... }, chartdata: { categories: schedulestategroups, series: [ { //... } ] } } ); this.down('#mychart')._unmask(); //otherwise loading mask not go away
Comments
Post a Comment