|
1 /* |
|
2 YUI 3.10.3 (build 2fb5187) |
|
3 Copyright 2013 Yahoo! Inc. All rights reserved. |
|
4 Licensed under the BSD License. |
|
5 http://yuilibrary.com/license/ |
|
6 */ |
|
7 |
|
8 YUI.add('series-bar', function (Y, NAME) { |
|
9 |
|
10 /** |
|
11 * Provides functionality for creating a bar series. |
|
12 * |
|
13 * @module charts |
|
14 * @submodule series-bar |
|
15 */ |
|
16 /** |
|
17 * The BarSeries class renders bars positioned vertically along a category or time axis. The bars' |
|
18 * lengths are proportional to the values they represent along a horizontal axis. |
|
19 * and the relevant data points. |
|
20 * |
|
21 * @class BarSeries |
|
22 * @extends MarkerSeries |
|
23 * @uses Histogram |
|
24 * @constructor |
|
25 * @param {Object} config (optional) Configuration parameters. |
|
26 * @submodule series-bar |
|
27 */ |
|
28 Y.BarSeries = Y.Base.create("barSeries", Y.MarkerSeries, [Y.Histogram], { |
|
29 /** |
|
30 * Helper method for calculating the size of markers. |
|
31 * |
|
32 * @method _getMarkerDimensions |
|
33 * @param {Number} xcoord The x-coordinate representing the data point for the marker. |
|
34 * @param {Number} ycoord The y-coordinate representing the data point for the marker. |
|
35 * @param {Number} calculatedSize The calculated size for the marker. For a `BarSeries` is it the width. For a `ColumnSeries` it is the height. |
|
36 * @param {Number} offset Distance of position offset dictated by other marker series in the same graph. |
|
37 * @return Object |
|
38 * @private |
|
39 */ |
|
40 _getMarkerDimensions: function(xcoord, ycoord, calculatedSize, offset) |
|
41 { |
|
42 var config = { |
|
43 top: ycoord + offset |
|
44 }; |
|
45 if(xcoord >= this._leftOrigin) |
|
46 { |
|
47 config.left = this._leftOrigin; |
|
48 config.calculatedSize = xcoord - config.left; |
|
49 } |
|
50 else |
|
51 { |
|
52 config.left = xcoord; |
|
53 config.calculatedSize = this._leftOrigin - xcoord; |
|
54 } |
|
55 return config; |
|
56 }, |
|
57 |
|
58 /** |
|
59 * Resizes and positions markers based on a mouse interaction. |
|
60 * |
|
61 * @method updateMarkerState |
|
62 * @param {String} type state of the marker |
|
63 * @param {Number} i index of the marker |
|
64 * @protected |
|
65 */ |
|
66 updateMarkerState: function(type, i) |
|
67 { |
|
68 if(this._markers && this._markers[i]) |
|
69 { |
|
70 var styles = Y.clone(this.get("styles").marker), |
|
71 markerStyles, |
|
72 state = this._getState(type), |
|
73 xcoords = this.get("xcoords"), |
|
74 ycoords = this.get("ycoords"), |
|
75 marker = this._markers[i], |
|
76 markers, |
|
77 seriesCollection = this.get("seriesTypeCollection"), |
|
78 seriesLen = seriesCollection.length, |
|
79 seriesStyles, |
|
80 seriesSize = 0, |
|
81 offset = 0, |
|
82 renderer, |
|
83 n = 0, |
|
84 ys = [], |
|
85 order = this.get("order"), |
|
86 config; |
|
87 markerStyles = state === "off" || !styles[state] ? styles : styles[state]; |
|
88 markerStyles.fill.color = this._getItemColor(markerStyles.fill.color, i); |
|
89 markerStyles.border.color = this._getItemColor(markerStyles.border.color, i); |
|
90 config = this._getMarkerDimensions(xcoords[i], ycoords[i], styles.height, offset); |
|
91 markerStyles.width = config.calculatedSize; |
|
92 markerStyles.height = Math.min(this._maxSize, markerStyles.height); |
|
93 marker.set(markerStyles); |
|
94 for(; n < seriesLen; ++n) |
|
95 { |
|
96 ys[n] = ycoords[i] + seriesSize; |
|
97 seriesStyles = seriesCollection[n].get("styles").marker; |
|
98 seriesSize += Math.min(this._maxSize, seriesStyles.height); |
|
99 if(order > n) |
|
100 { |
|
101 offset = seriesSize; |
|
102 } |
|
103 offset -= seriesSize/2; |
|
104 } |
|
105 for(n = 0; n < seriesLen; ++n) |
|
106 { |
|
107 markers = seriesCollection[n].get("markers"); |
|
108 if(markers) |
|
109 { |
|
110 renderer = markers[i]; |
|
111 if(renderer && renderer !== undefined) |
|
112 { |
|
113 renderer.set("y", (ys[n] - seriesSize/2)); |
|
114 } |
|
115 } |
|
116 } |
|
117 } |
|
118 } |
|
119 }, { |
|
120 ATTRS: { |
|
121 /** |
|
122 * Read-only attribute indicating the type of series. |
|
123 * |
|
124 * @attribute type |
|
125 * @type String |
|
126 * @default bar |
|
127 */ |
|
128 type: { |
|
129 value: "bar" |
|
130 }, |
|
131 |
|
132 /** |
|
133 * Indicates the direction of the category axis that the bars are plotted against. |
|
134 * |
|
135 * @attribute direction |
|
136 * @type String |
|
137 */ |
|
138 direction: { |
|
139 value: "vertical" |
|
140 } |
|
141 |
|
142 /** |
|
143 * Style properties used for drawing markers. This attribute is inherited from `MarkerSeries`. Below are the default values: |
|
144 * <dl> |
|
145 * <dt>fill</dt><dd>A hash containing the following values: |
|
146 * <dl> |
|
147 * <dt>color</dt><dd>Color of the fill. The default value is determined by the order of the series on the graph. The color |
|
148 * will be retrieved from the below array:<br/> |
|
149 * `["#66007f", "#a86f41", "#295454", "#996ab2", "#e8cdb7", "#90bdbd","#000000","#c3b8ca", "#968373", "#678585"]` |
|
150 * </dd> |
|
151 * <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the marker fill. The default value is 1.</dd> |
|
152 * </dl> |
|
153 * </dd> |
|
154 * <dt>border</dt><dd>A hash containing the following values: |
|
155 * <dl> |
|
156 * <dt>color</dt><dd>Color of the border. The default value is determined by the order of the series on the graph. The color |
|
157 * will be retrieved from the below array:<br/> |
|
158 * `["#205096", "#b38206", "#000000", "#94001e", "#9d6fa0", "#e55b00", "#5e85c9", "#adab9e", "#6ac291", "#006457"]` |
|
159 * <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the marker border. The default value is 1.</dd> |
|
160 * <dt>weight</dt><dd>Number indicating the width of the border. The default value is 1.</dd> |
|
161 * </dl> |
|
162 * </dd> |
|
163 * <dt>height</dt><dd>indicates the width of the marker. The default value is 12.</dd> |
|
164 * <dt>over</dt><dd>hash containing styles for markers when highlighted by a `mouseover` event. The default |
|
165 * values for each style is null. When an over style is not set, the non-over value will be used. For example, |
|
166 * the default value for `marker.over.fill.color` is equivalent to `marker.fill.color`.</dd> |
|
167 * </dl> |
|
168 * |
|
169 * @attribute styles |
|
170 * @type Object |
|
171 */ |
|
172 } |
|
173 }); |
|
174 |
|
175 |
|
176 }, '3.10.3', {"requires": ["series-marker", "series-histogram-base"]}); |