Commit c47e24dc77b51018c07fb3075643201e45c9e957

Authored by Helder
1 parent 45f19b1d
Exists in master

Tela relatorios

Showing 1 changed file with 53 additions and 36 deletions   Show diff stats
wscacicneo/static/relatorio.js
@@ -78,15 +78,20 @@ Ext.onReady(function(){ @@ -78,15 +78,20 @@ Ext.onReady(function(){
78 }); 78 });
79 79
80 80
81 -// **** GRAFICO DE PIZZA **** 81 +// **** GRAFICO DE COLUNA ****
82 82
83 var store = Ext.create('Ext.data.JsonStore', { 83 var store = Ext.create('Ext.data.JsonStore', {
84 fields: ['name', 'data'], 84 fields: ['name', 'data'],
85 data: [ 85 data: [
86 - { 'name': 'dado1', 'data': 2 },  
87 - { 'name': 'dado2', 'data': 2 },  
88 - { 'name': 'dado3', 'data': 4 },  
89 - { 'name': 'dado4', 'data': 10 } 86 + { 'name': 'dado1', 'data': 200 },
  87 + { 'name': 'dado2', 'data': 20 },
  88 + { 'name': 'dado3', 'data': 500 },
  89 + { 'name': 'dado4', 'data': 600 },
  90 + { 'name': 'dado5', 'data': 700 },
  91 + { 'name': 'dado6', 'data': 1000 },
  92 + { 'name': 'dado7', 'data': 50 },
  93 + { 'name': 'dado8', 'data': 200 },
  94 + { 'name': 'dado9', 'data': 400 },
90 ]}); 95 ]});
91 96
92 var chart = Ext.create('Ext.chart.Chart', { 97 var chart = Ext.create('Ext.chart.Chart', {
@@ -97,43 +102,55 @@ var chart = Ext.create('Ext.chart.Chart', { @@ -97,43 +102,55 @@ var chart = Ext.create('Ext.chart.Chart', {
97 store: store, 102 store: store,
98 theme: 'Base:gradients', 103 theme: 'Base:gradients',
99 shadow: true, 104 shadow: true,
100 - legend: {  
101 - position: 'right'  
102 - },  
103 - series: [{  
104 - type: 'pie',  
105 - angleField: 'data',  
106 - showInLegend: true,  
107 - tips: {  
108 - trackMouse: true,  
109 - width: 140,  
110 - height: 28,  
111 - renderer: function(storeItem, item) {  
112 - // calculate and display percentage on hover  
113 - var total = 0;  
114 - store.each(function(rec) {  
115 - total += rec.get('data');  
116 - });  
117 - this.setTitle(storeItem.get('name') + ': ' + Math.round(storeItem.get('data') / total * 100) + '%');  
118 - }  
119 - },  
120 - highlight: {  
121 - segment: {  
122 - margin: 20  
123 - } 105 + axes: [
  106 + {
  107 + type: 'Numeric',
  108 + position: 'left',
  109 + fields: ['data'],
  110 + label: {
  111 + renderer: Ext.util.Format.numberRenderer('0,0')
  112 + },
  113 + title: 'Eixo X',
  114 + grid: true,
  115 + minimum: 0
124 }, 116 },
125 - label: {  
126 - field: 'name',  
127 - display: 'rotate',  
128 - contrast: true,  
129 - font: '18px Arial' 117 + {
  118 + type: 'Category',
  119 + position: 'bottom',
  120 + fields: ['name'],
  121 + title: 'Eixo Y'
130 } 122 }
131 - }] 123 + ],
  124 + series: [
  125 + {
  126 + type: 'column',
  127 + axis: 'left',
  128 + highlight: true,
  129 + tips: {
  130 + trackMouse: true,
  131 + width: 140,
  132 + height: 28,
  133 + renderer: function(storeItem, item) {
  134 + this.setTitle(storeItem.get('name') + ': ' + storeItem.get('data'));
  135 + }
  136 + },
  137 + label: {
  138 + display: 'insideEnd',
  139 + 'text-anchor': 'middle',
  140 + field: 'data',
  141 + renderer: Ext.util.Format.numberRenderer('0'),
  142 + orientation: 'vertical',
  143 + color: '#333'
  144 + },
  145 + xField: 'name',
  146 + yField: 'data'
  147 + }
  148 + ]
132 }); 149 });
133 150
134 widget = Ext.create('Ext.panel.Panel', { 151 widget = Ext.create('Ext.panel.Panel', {
135 layout: 'fit', 152 layout: 'fit',
136 - title: 'Widgets', 153 + title: 'Grafico de dados',
137 width: '75%', 154 width: '75%',
138 frame: true, 155 frame: true,
139 draggable: true, 156 draggable: true,