How to create gauge chart?

[mhmda]

Hi,

 

How can I create a gauge chart?

 

1. If unigui doesn't support guage chart then how can I insert extjs code (for guage chart) to my application?

 

2. How can I attach an event (let's say button_click) to object I have created using extjs pure code?

 

 

 

I put this code into htmlframe:

 

<script language="js">
generateData = function(n, floor){
       var data = [],
           p = (Math.random() *  11) + 1,
           i;
           
       floor = (!floor && floor !== 0)? 20 : floor;
       
       for (i = 0; i < (n || 12); i++) {
           data.push({
               name: Ext.Date.monthNames[i % 12],
               data1: Math.floor(Math.max((Math.random() * 50), floor))
           });
       }
       return data;
   };
   
  

   store1 = Ext.create('Ext.data.JsonStore', {
       fields: ['name', 'data1'],
       data: generateData()
   });
   
  
store1.loadData(generateData(1)); 

var enroll = Ext.create('Ext.chart.Chart', {
       width: 400,        
       height: 140,
       renderTo: 'O20_id-body',
       store: store1,
       axes: [{
           type: 'gauge',
           position: 'gauge',
           minimum: 0,
           maximum: 50,
           steps: 15,
           margin: -10
       }], 
       series: [{
           type: 'gauge',
           donut: true,
           field: 'data1',
           colorSet: ['#FD02EB', '#ddd']
       }]
   });
   

</script>   

[mhmda]

I need help !