docs/source/Radial.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   5   <title>The source code</title>
   6   <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
   7   <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
   8   <style type="text/css">
   9     .highlight { display: block; background-color: #ddd; }
  10   </style>
  11   <script type="text/javascript">
  12     function highlight() {
  13       document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
  14     }
  15   </script>
  16 </head>
  17 <body onload="prettyPrint(); highlight();">
  18   <pre class="prettyprint lang-js"><span id='Ext-chart-axis-Radial'>/**
  19 </span> * @class Ext.chart.axis.Radial
  20  * @extends Ext.chart.axis.Abstract
  21  * @ignore
  22  */
  23 Ext.define('Ext.chart.axis.Radial', {
  24
  25     /* Begin Definitions */
  26
  27     extend: 'Ext.chart.axis.Abstract',
  28
  29     /* End Definitions */
  30
  31     position: 'radial',
  32
  33     alias: 'axis.radial',
  34
  35     drawAxis: function(init) {
  36         var chart = this.chart,
  37             surface = chart.surface,
  38             bbox = chart.chartBBox,
  39             store = chart.store,
  40             l = store.getCount(),
  41             centerX = bbox.x + (bbox.width / 2),
  42             centerY = bbox.y + (bbox.height / 2),
  43             rho = Math.min(bbox.width, bbox.height) /2,
  44             sprites = [], sprite,
  45             steps = this.steps,
  46             i, j, pi2 = Math.PI * 2,
  47             cos = Math.cos, sin = Math.sin;
  48
  49         if (this.sprites &amp;&amp; !chart.resizing) {
  50             this.drawLabel();
  51             return;
  52         }
  53
  54         if (!this.sprites) {
  55             //draw circles
  56             for (i = 1; i &lt;= steps; i++) {
  57                 sprite = surface.add({
  58                     type: 'circle',
  59                     x: centerX,
  60                     y: centerY,
  61                     radius: Math.max(rho * i / steps, 0),
  62                     stroke: '#ccc'
  63                 });
  64                 sprite.setAttributes({
  65                     hidden: false
  66                 }, true);
  67                 sprites.push(sprite);
  68             }
  69             //draw lines
  70             store.each(function(rec, i) {
  71                 sprite = surface.add({
  72                     type: 'path',
  73                     path: ['M', centerX, centerY, 'L', centerX + rho * cos(i / l * pi2), centerY + rho * sin(i / l * pi2), 'Z'],
  74                     stroke: '#ccc'
  75                 });
  76                 sprite.setAttributes({
  77                     hidden: false
  78                 }, true);
  79                 sprites.push(sprite);
  80             });
  81         } else {
  82             sprites = this.sprites;
  83             //draw circles
  84             for (i = 0; i &lt; steps; i++) {
  85                 sprites[i].setAttributes({
  86                     x: centerX,
  87                     y: centerY,
  88                     radius: Math.max(rho * (i + 1) / steps, 0),
  89                     stroke: '#ccc'
  90                 }, true);
  91             }
  92             //draw lines
  93             store.each(function(rec, j) {
  94                 sprites[i + j].setAttributes({
  95                     path: ['M', centerX, centerY, 'L', centerX + rho * cos(j / l * pi2), centerY + rho * sin(j / l * pi2), 'Z'],
  96                     stroke: '#ccc'
  97                 }, true);
  98             });
  99         }
 100         this.sprites = sprites;
 101
 102         this.drawLabel();
 103     },
 104
 105     drawLabel: function() {
 106         var chart = this.chart,
 107             surface = chart.surface,
 108             bbox = chart.chartBBox,
 109             store = chart.store,
 110             centerX = bbox.x + (bbox.width / 2),
 111             centerY = bbox.y + (bbox.height / 2),
 112             rho = Math.min(bbox.width, bbox.height) /2,
 113             max = Math.max, round = Math.round,
 114             labelArray = [], label,
 115             fields = [], nfields,
 116             categories = [], xField,
 117             aggregate = !this.maximum,
 118             maxValue = this.maximum || 0,
 119             steps = this.steps, i = 0, j, dx, dy,
 120             pi2 = Math.PI * 2,
 121             cos = Math.cos, sin = Math.sin,
 122             display = this.label.display,
 123             draw = display !== 'none',
 124             margin = 10;
 125
 126         if (!draw) {
 127             return;
 128         }
 129
 130         //get all rendered fields
 131         chart.series.each(function(series) {
 132             fields.push(series.yField);
 133             xField = series.xField;
 134         });
 135
 136         //get maxValue to interpolate
 137         store.each(function(record, i) {
 138             if (aggregate) {
 139                 for (i = 0, nfields = fields.length; i &lt; nfields; i++) {
 140                     maxValue = max(+record.get(fields[i]), maxValue);
 141                 }
 142             }
 143             categories.push(record.get(xField));
 144         });
 145         if (!this.labelArray) {
 146             if (display != 'categories') {
 147                 //draw scale
 148                 for (i = 1; i &lt;= steps; i++) {
 149                     label = surface.add({
 150                         type: 'text',
 151                         text: round(i / steps * maxValue),
 152                         x: centerX,
 153                         y: centerY - rho * i / steps,
 154                         'text-anchor': 'middle',
 155                         'stroke-width': 0.1,
 156                         stroke: '#333'
 157                     });
 158                     label.setAttributes({
 159                         hidden: false
 160                     }, true);
 161                     labelArray.push(label);
 162                 }
 163             }
 164             if (display != 'scale') {
 165                 //draw text
 166                 for (j = 0, steps = categories.length; j &lt; steps; j++) {
 167                     dx = cos(j / steps * pi2) * (rho + margin);
 168                     dy = sin(j / steps * pi2) * (rho + margin);
 169                     label = surface.add({
 170                         type: 'text',
 171                         text: categories[j],
 172                         x: centerX + dx,
 173                         y: centerY + dy,
 174                         'text-anchor': dx * dx &lt;= 0.001? 'middle' : (dx &lt; 0? 'end' : 'start')
 175                     });
 176                     label.setAttributes({
 177                         hidden: false
 178                     }, true);
 179                     labelArray.push(label);
 180                 }
 181             }
 182         }
 183         else {
 184             labelArray = this.labelArray;
 185             if (display != 'categories') {
 186                 //draw values
 187                 for (i = 0; i &lt; steps; i++) {
 188                     labelArray[i].setAttributes({
 189                         text: round((i + 1) / steps * maxValue),
 190                         x: centerX,
 191                         y: centerY - rho * (i + 1) / steps,
 192                         'text-anchor': 'middle',
 193                         'stroke-width': 0.1,
 194                         stroke: '#333'
 195                     }, true);
 196                 }
 197             }
 198             if (display != 'scale') {
 199                 //draw text
 200                 for (j = 0, steps = categories.length; j &lt; steps; j++) {
 201                     dx = cos(j / steps * pi2) * (rho + margin);
 202                     dy = sin(j / steps * pi2) * (rho + margin);
 203                     if (labelArray[i + j]) {
 204                         labelArray[i + j].setAttributes({
 205                             type: 'text',
 206                             text: categories[j],
 207                             x: centerX + dx,
 208                             y: centerY + dy,
 209                             'text-anchor': dx * dx &lt;= 0.001? 'middle' : (dx &lt; 0? 'end' : 'start')
 210                         }, true);
 211                     }
 212                 }
 213             }
 214         }
 215         this.labelArray = labelArray;
 216     }
 217 });</pre>
 218 </body>
 219 </html>