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 78 });
79 79  
80 80  
81   -// **** GRAFICO DE PIZZA ****
  81 +// **** GRAFICO DE COLUNA ****
82 82  
83 83 var store = Ext.create('Ext.data.JsonStore', {
84 84 fields: ['name', 'data'],
85 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 97 var chart = Ext.create('Ext.chart.Chart', {
... ... @@ -97,43 +102,55 @@ var chart = Ext.create('Ext.chart.Chart', {
97 102 store: store,
98 103 theme: 'Base:gradients',
99 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 151 widget = Ext.create('Ext.panel.Panel', {
135 152 layout: 'fit',
136   - title: 'Widgets',
  153 + title: 'Grafico de dados',
137 154 width: '75%',
138 155 frame: true,
139 156 draggable: true,
... ...