Radial.html 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223
  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> * @private
  20. */
  21. Ext.define('Ext.chart.axis.Radial', {
  22. /* Begin Definitions */
  23. extend: 'Ext.chart.axis.Abstract',
  24. /* End Definitions */
  25. position: 'radial',
  26. alias: 'axis.radial',
  27. drawAxis: function(init) {
  28. var chart = this.chart,
  29. surface = chart.surface,
  30. bbox = chart.chartBBox,
  31. store = chart.store,
  32. l = store.getCount(),
  33. centerX = bbox.x + (bbox.width / 2),
  34. centerY = bbox.y + (bbox.height / 2),
  35. rho = Math.min(bbox.width, bbox.height) /2,
  36. sprites = [], sprite,
  37. steps = this.steps,
  38. i, j, pi2 = Math.PI * 2,
  39. cos = Math.cos, sin = Math.sin;
  40. if (this.sprites &amp;&amp; !chart.resizing) {
  41. this.drawLabel();
  42. return;
  43. }
  44. if (!this.sprites) {
  45. //draw circles
  46. for (i = 1; i &lt;= steps; i++) {
  47. sprite = surface.add({
  48. type: 'circle',
  49. x: centerX,
  50. y: centerY,
  51. radius: Math.max(rho * i / steps, 0),
  52. stroke: '#ccc'
  53. });
  54. sprite.setAttributes({
  55. hidden: false
  56. }, true);
  57. sprites.push(sprite);
  58. }
  59. //draw lines
  60. for (i = 0; i &lt; l; i++) {
  61. sprite = surface.add({
  62. type: 'path',
  63. path: ['M', centerX, centerY, 'L', centerX + rho * cos(i / l * pi2), centerY + rho * sin(i / l * pi2), 'Z'],
  64. stroke: '#ccc'
  65. });
  66. sprite.setAttributes({
  67. hidden: false
  68. }, true);
  69. sprites.push(sprite);
  70. }
  71. } else {
  72. sprites = this.sprites;
  73. //draw circles
  74. for (i = 0; i &lt; steps; i++) {
  75. sprites[i].setAttributes({
  76. x: centerX,
  77. y: centerY,
  78. radius: Math.max(rho * (i + 1) / steps, 0),
  79. stroke: '#ccc'
  80. }, true);
  81. }
  82. //draw lines
  83. for (j = 0; j &lt; l; j++) {
  84. sprites[i + j].setAttributes({
  85. path: ['M', centerX, centerY, 'L', centerX + rho * cos(j / l * pi2), centerY + rho * sin(j / l * pi2), 'Z'],
  86. stroke: '#ccc'
  87. }, true);
  88. }
  89. }
  90. this.sprites = sprites;
  91. this.drawLabel();
  92. },
  93. drawLabel: function() {
  94. var chart = this.chart,
  95. seriesItems = chart.series.items,
  96. series,
  97. surface = chart.surface,
  98. bbox = chart.chartBBox,
  99. store = chart.store,
  100. data = store.data.items,
  101. ln, record,
  102. centerX = bbox.x + (bbox.width / 2),
  103. centerY = bbox.y + (bbox.height / 2),
  104. rho = Math.min(bbox.width, bbox.height) /2,
  105. max = Math.max, round = Math.round,
  106. labelArray = [], label,
  107. fields = [], nfields,
  108. categories = [], xField,
  109. aggregate = !this.maximum,
  110. maxValue = this.maximum || 0,
  111. steps = this.steps, i = 0, j, dx, dy,
  112. pi2 = Math.PI * 2,
  113. cos = Math.cos, sin = Math.sin,
  114. display = this.label.display,
  115. draw = display !== 'none',
  116. margin = 10;
  117. if (!draw) {
  118. return;
  119. }
  120. //get all rendered fields
  121. for (i = 0, ln = seriesItems.length; i &lt; ln; i++) {
  122. series = seriesItems[i];
  123. fields.push(series.yField);
  124. xField = series.xField;
  125. }
  126. //get maxValue to interpolate
  127. for (j = 0, ln = data.length; j &lt; ln; j++) {
  128. record = data[j];
  129. if (aggregate) {
  130. for (i = 0, nfields = fields.length; i &lt; nfields; i++) {
  131. maxValue = max(+record.get(fields[i]), maxValue);
  132. }
  133. }
  134. categories.push(record.get(xField));
  135. }
  136. if (!this.labelArray) {
  137. if (display != 'categories') {
  138. //draw scale
  139. for (i = 1; i &lt;= steps; i++) {
  140. label = surface.add({
  141. type: 'text',
  142. text: round(i / steps * maxValue),
  143. x: centerX,
  144. y: centerY - rho * i / steps,
  145. 'text-anchor': 'middle',
  146. 'stroke-width': 0.1,
  147. stroke: '#333'
  148. });
  149. label.setAttributes({
  150. hidden: false
  151. }, true);
  152. labelArray.push(label);
  153. }
  154. }
  155. if (display != 'scale') {
  156. //draw text
  157. for (j = 0, steps = categories.length; j &lt; steps; j++) {
  158. dx = cos(j / steps * pi2) * (rho + margin);
  159. dy = sin(j / steps * pi2) * (rho + margin);
  160. label = surface.add({
  161. type: 'text',
  162. text: categories[j],
  163. x: centerX + dx,
  164. y: centerY + dy,
  165. 'text-anchor': dx * dx &lt;= 0.001? 'middle' : (dx &lt; 0? 'end' : 'start')
  166. });
  167. label.setAttributes({
  168. hidden: false
  169. }, true);
  170. labelArray.push(label);
  171. }
  172. }
  173. }
  174. else {
  175. labelArray = this.labelArray;
  176. if (display != 'categories') {
  177. //draw values
  178. for (i = 0; i &lt; steps; i++) {
  179. labelArray[i].setAttributes({
  180. text: round((i + 1) / steps * maxValue),
  181. x: centerX,
  182. y: centerY - rho * (i + 1) / steps,
  183. 'text-anchor': 'middle',
  184. 'stroke-width': 0.1,
  185. stroke: '#333'
  186. }, true);
  187. }
  188. }
  189. if (display != 'scale') {
  190. //draw text
  191. for (j = 0, steps = categories.length; j &lt; steps; j++) {
  192. dx = cos(j / steps * pi2) * (rho + margin);
  193. dy = sin(j / steps * pi2) * (rho + margin);
  194. if (labelArray[i + j]) {
  195. labelArray[i + j].setAttributes({
  196. type: 'text',
  197. text: categories[j],
  198. x: centerX + dx,
  199. y: centerY + dy,
  200. 'text-anchor': dx * dx &lt;= 0.001? 'middle' : (dx &lt; 0? 'end' : 'start')
  201. }, true);
  202. }
  203. }
  204. }
  205. }
  206. this.labelArray = labelArray;
  207. }
  208. });</pre>
  209. </body>
  210. </html>