3 This file is part of Ext JS 4
5 Copyright (c) 2011 Sencha Inc
7 Contact: http://www.sencha.com/contact
9 GNU General Public License Usage
10 This file may be used under the terms of the GNU General Public License version 3.0 as published by the Free Software Foundation and appearing in the file LICENSE included in the packaging of this file. Please review the following information to ensure the GNU General Public License version 3.0 requirements will be met: http://www.gnu.org/copyleft/gpl.html.
12 If you are unsure which license is appropriate for your use, please contact the sales department at http://www.sencha.com/contact.
16 * @class Ext.chart.axis.Gauge
17 * @extends Ext.chart.axis.Abstract
19 * Gauge Axis is the axis to be used with a Gauge series. The Gauge axis
20 * displays numeric data from an interval defined by the `minimum`, `maximum` and
21 * `step` configuration properties. The placement of the numeric data can be changed
22 * by altering the `margin` option that is set to `10` by default.
24 * A possible configuration for this axis would look like:
35 Ext.define('Ext.chart.axis.Gauge', {
37 /* Begin Definitions */
39 extend: 'Ext.chart.axis.Abstract',
44 * @cfg {Number} minimum (required)
45 * The minimum value of the interval to be displayed in the axis.
49 * @cfg {Number} maximum (required)
50 * The maximum value of the interval to be displayed in the axis.
54 * @cfg {Number} steps (required)
55 * The number of steps and tick marks to add to the interval.
59 * @cfg {Number} [margin=10]
60 * The offset positioning of the tick marks and labels in pixels.
65 * The title for the Axis.
72 drawAxis: function(init) {
73 var chart = this.chart,
74 surface = chart.surface,
75 bbox = chart.chartBBox,
76 centerX = bbox.x + (bbox.width / 2),
77 centerY = bbox.y + bbox.height,
78 margin = this.margin || 10,
79 rho = Math.min(bbox.width, 2 * bbox.height) /2 + margin,
86 if (this.sprites && !chart.resizing) {
91 if (this.margin >= 0) {
94 for (i = 0; i <= steps; i++) {
95 sprite = surface.add({
97 path: ['M', centerX + (rho - margin) * cos(i / steps * pi - pi),
98 centerY + (rho - margin) * sin(i / steps * pi - pi),
99 'L', centerX + rho * cos(i / steps * pi - pi),
100 centerY + rho * sin(i / steps * pi - pi), 'Z'],
103 sprite.setAttributes({
106 sprites.push(sprite);
109 sprites = this.sprites;
111 for (i = 0; i <= steps; i++) {
112 sprites[i].setAttributes({
113 path: ['M', centerX + (rho - margin) * cos(i / steps * pi - pi),
114 centerY + (rho - margin) * sin(i / steps * pi - pi),
115 'L', centerX + rho * cos(i / steps * pi - pi),
116 centerY + rho * sin(i / steps * pi - pi), 'Z'],
122 this.sprites = sprites;
129 drawTitle: function() {
132 surface = chart.surface,
133 bbox = chart.chartBBox,
134 labelSprite = me.titleSprite,
138 me.titleSprite = labelSprite = surface.add({
143 labelSprite.setAttributes(Ext.apply({
145 }, me.label || {}), true);
146 labelBBox = labelSprite.getBBox();
147 labelSprite.setAttributes({
148 x: bbox.x + (bbox.width / 2) - (labelBBox.width / 2),
149 y: bbox.y + bbox.height - (labelBBox.height / 2) - 4
154 * Updates the {@link #title} of this axis.
155 * @param {String} title
157 setTitle: function(title) {
162 drawLabel: function() {
163 var chart = this.chart,
164 surface = chart.surface,
165 bbox = chart.chartBBox,
166 centerX = bbox.x + (bbox.width / 2),
167 centerY = bbox.y + bbox.height,
168 margin = this.margin || 10,
169 rho = Math.min(bbox.width, 2 * bbox.height) /2 + 2 * margin,
171 labelArray = [], label,
172 maxValue = this.maximum || 0,
173 steps = this.steps, i = 0,
178 labelConf = this.label,
179 renderer = labelConf.renderer || function(v) { return v; };
181 if (!this.labelArray) {
183 for (i = 0; i <= steps; i++) {
184 // TODO Adjust for height of text / 2 instead
185 adjY = (i === 0 || i === steps) ? 7 : 0;
186 label = surface.add({
188 text: renderer(round(i / steps * maxValue)),
189 x: centerX + rho * cos(i / steps * pi - pi),
190 y: centerY + rho * sin(i / steps * pi - pi) - adjY,
191 'text-anchor': 'middle',
196 label.setAttributes({
199 labelArray.push(label);
203 labelArray = this.labelArray;
205 for (i = 0; i <= steps; i++) {
206 // TODO Adjust for height of text / 2 instead
207 adjY = (i === 0 || i === steps) ? 7 : 0;
208 labelArray[i].setAttributes({
209 text: renderer(round(i / steps * maxValue)),
210 x: centerX + rho * cos(i / steps * pi - pi),
211 y: centerY + rho * sin(i / steps * pi - pi) - adjY
215 this.labelArray = labelArray;