1 | define(["dojo/_base/lang", "dojo/_base/array", "dojo/_base/declare", "dojo/has", "./CartesianBase", "./_PlotEvents", "./common", |
---|
2 | "dojox/lang/functional", "dojox/lang/functional/reversed", "dojox/lang/utils", "dojox/gfx/fx", "dojox/gfx/gradutils"], |
---|
3 | function(lang, arr, declare, has, CartesianBase, _PlotEvents, dc, df, dfr, du, fx, gradutils){ |
---|
4 | |
---|
5 | var purgeGroup = dfr.lambda("item.purgeGroup()"); |
---|
6 | |
---|
7 | return declare("dojox.charting.plot2d.Scatter", [CartesianBase, _PlotEvents], { |
---|
8 | // summary: |
---|
9 | // A plot object representing a typical scatter chart. |
---|
10 | defaultParams: { |
---|
11 | shadows: null, // draw shadows |
---|
12 | animate: null // animate chart to place |
---|
13 | }, |
---|
14 | optionalParams: { |
---|
15 | // theme component |
---|
16 | markerStroke: {}, |
---|
17 | markerOutline: {}, |
---|
18 | markerShadow: {}, |
---|
19 | markerFill: {}, |
---|
20 | markerFont: "", |
---|
21 | markerFontColor: "", |
---|
22 | styleFunc: null |
---|
23 | }, |
---|
24 | |
---|
25 | constructor: function(chart, kwArgs){ |
---|
26 | // summary: |
---|
27 | // Create the scatter plot. |
---|
28 | // chart: dojox/charting/Chart |
---|
29 | // The chart this plot belongs to. |
---|
30 | // kwArgs: dojox.charting.plot2d.__DefaultCtorArgs? |
---|
31 | // An optional keyword arguments object to help define this plot's parameters. |
---|
32 | this.opt = lang.clone(lang.mixin(this.opt, this.defaultParams)); |
---|
33 | du.updateWithObject(this.opt, kwArgs); |
---|
34 | du.updateWithPattern(this.opt, kwArgs, this.optionalParams); |
---|
35 | this.animate = this.opt.animate; |
---|
36 | }, |
---|
37 | |
---|
38 | render: function(dim, offsets){ |
---|
39 | // summary: |
---|
40 | // Run the calculations for any axes for this plot. |
---|
41 | // dim: Object |
---|
42 | // An object in the form of { width, height } |
---|
43 | // offsets: Object |
---|
44 | // An object of the form { l, r, t, b}. |
---|
45 | // returns: dojox/charting/plot2d/Scatter |
---|
46 | // A reference to this plot for functional chaining. |
---|
47 | if(this.zoom && !this.isDataDirty()){ |
---|
48 | return this.performZoom(dim, offsets); |
---|
49 | } |
---|
50 | this.resetEvents(); |
---|
51 | this.dirty = this.isDirty(); |
---|
52 | var s; |
---|
53 | if(this.dirty){ |
---|
54 | arr.forEach(this.series, purgeGroup); |
---|
55 | this._eventSeries = {}; |
---|
56 | this.cleanGroup(); |
---|
57 | s = this.getGroup(); |
---|
58 | df.forEachRev(this.series, function(item){ item.cleanGroup(s); }); |
---|
59 | } |
---|
60 | var t = this.chart.theme, events = this.events(); |
---|
61 | for(var i = this.series.length - 1; i >= 0; --i){ |
---|
62 | var run = this.series[i]; |
---|
63 | if(!this.dirty && !run.dirty){ |
---|
64 | t.skip(); |
---|
65 | this._reconnectEvents(run.name); |
---|
66 | continue; |
---|
67 | } |
---|
68 | run.cleanGroup(); |
---|
69 | if(!run.data.length){ |
---|
70 | run.dirty = false; |
---|
71 | t.skip(); |
---|
72 | continue; |
---|
73 | } |
---|
74 | |
---|
75 | var theme = t.next("marker", [this.opt, run]), lpoly, |
---|
76 | ht = this._hScaler.scaler.getTransformerFromModel(this._hScaler), |
---|
77 | vt = this._vScaler.scaler.getTransformerFromModel(this._vScaler); |
---|
78 | s = run.group; |
---|
79 | if(typeof run.data[0] == "number"){ |
---|
80 | lpoly = arr.map(run.data, function(v, i){ |
---|
81 | return { |
---|
82 | x: ht(i + 1) + offsets.l, |
---|
83 | y: dim.height - offsets.b - vt(v) |
---|
84 | }; |
---|
85 | }, this); |
---|
86 | }else{ |
---|
87 | lpoly = arr.map(run.data, function(v, i){ |
---|
88 | return { |
---|
89 | x: ht(v.x) + offsets.l, |
---|
90 | y: dim.height - offsets.b - vt(v.y) |
---|
91 | }; |
---|
92 | }, this); |
---|
93 | } |
---|
94 | |
---|
95 | var shadowMarkers = new Array(lpoly.length), |
---|
96 | frontMarkers = new Array(lpoly.length), |
---|
97 | outlineMarkers = new Array(lpoly.length); |
---|
98 | |
---|
99 | arr.forEach(lpoly, function(c, i){ |
---|
100 | var value = run.data[i], finalTheme; |
---|
101 | if(this.opt.styleFunc || typeof value != "number"){ |
---|
102 | var tMixin = typeof value != "number" ? [value] : []; |
---|
103 | if(this.opt.styleFunc){ |
---|
104 | tMixin.push(this.opt.styleFunc(value)); |
---|
105 | } |
---|
106 | finalTheme = t.addMixin(theme, "marker", tMixin, true); |
---|
107 | }else{ |
---|
108 | finalTheme = t.post(theme, "marker"); |
---|
109 | } |
---|
110 | var path = "M" + c.x + " " + c.y + " " + finalTheme.symbol; |
---|
111 | if(finalTheme.marker.shadow){ |
---|
112 | shadowMarkers[i] = s.createPath("M" + (c.x + finalTheme.marker.shadow.dx) + " " + |
---|
113 | (c.y + finalTheme.marker.shadow.dy) + " " + finalTheme.symbol). |
---|
114 | setStroke(finalTheme.marker.shadow).setFill(finalTheme.marker.shadow.color); |
---|
115 | if(this.animate){ |
---|
116 | this._animateScatter(shadowMarkers[i], dim.height - offsets.b); |
---|
117 | } |
---|
118 | } |
---|
119 | if(finalTheme.marker.outline){ |
---|
120 | var outline = dc.makeStroke(finalTheme.marker.outline); |
---|
121 | outline.width = 2 * outline.width + finalTheme.marker.stroke.width; |
---|
122 | outlineMarkers[i] = s.createPath(path).setStroke(outline); |
---|
123 | if(this.animate){ |
---|
124 | this._animateScatter(outlineMarkers[i], dim.height - offsets.b); |
---|
125 | } |
---|
126 | } |
---|
127 | var stroke = dc.makeStroke(finalTheme.marker.stroke), |
---|
128 | fill = this._plotFill(finalTheme.marker.fill, dim, offsets); |
---|
129 | if(fill && (fill.type === "linear" || fill.type == "radial")){ |
---|
130 | var color = gradutils.getColor(fill, {x: c.x, y: c.y}); |
---|
131 | if(stroke){ |
---|
132 | stroke.color = color; |
---|
133 | } |
---|
134 | frontMarkers[i] = s.createPath(path).setStroke(stroke).setFill(color); |
---|
135 | }else{ |
---|
136 | frontMarkers[i] = s.createPath(path).setStroke(stroke).setFill(fill); |
---|
137 | } |
---|
138 | if(this.opt.labels){ |
---|
139 | var markerBox = frontMarkers[i].getBoundingBox(); |
---|
140 | this.createLabel(s, value, markerBox, finalTheme); |
---|
141 | } |
---|
142 | if(this.animate){ |
---|
143 | this._animateScatter(frontMarkers[i], dim.height - offsets.b); |
---|
144 | } |
---|
145 | }, this); |
---|
146 | if(frontMarkers.length){ |
---|
147 | run.dyn.marker = theme.symbol; |
---|
148 | run.dyn.markerStroke = frontMarkers[frontMarkers.length - 1].getStroke(); |
---|
149 | run.dyn.markerFill = frontMarkers[frontMarkers.length - 1].getFill(); |
---|
150 | } |
---|
151 | |
---|
152 | if(events){ |
---|
153 | var eventSeries = new Array(frontMarkers.length); |
---|
154 | arr.forEach(frontMarkers, function(s, i){ |
---|
155 | var o = { |
---|
156 | element: "marker", |
---|
157 | index: i, |
---|
158 | run: run, |
---|
159 | shape: s, |
---|
160 | outline: outlineMarkers && outlineMarkers[i] || null, |
---|
161 | shadow: shadowMarkers && shadowMarkers[i] || null, |
---|
162 | cx: lpoly[i].x, |
---|
163 | cy: lpoly[i].y |
---|
164 | }; |
---|
165 | if(typeof run.data[0] == "number"){ |
---|
166 | o.x = i + 1; |
---|
167 | o.y = run.data[i]; |
---|
168 | }else{ |
---|
169 | o.x = run.data[i].x; |
---|
170 | o.y = run.data[i].y; |
---|
171 | } |
---|
172 | this._connectEvents(o); |
---|
173 | eventSeries[i] = o; |
---|
174 | }, this); |
---|
175 | this._eventSeries[run.name] = eventSeries; |
---|
176 | }else{ |
---|
177 | delete this._eventSeries[run.name]; |
---|
178 | } |
---|
179 | run.dirty = false; |
---|
180 | } |
---|
181 | this.dirty = false; |
---|
182 | // chart mirroring starts |
---|
183 | if(has("dojo-bidi")){ |
---|
184 | this._checkOrientation(this.group, dim, offsets); |
---|
185 | } |
---|
186 | // chart mirroring ends |
---|
187 | return this; // dojox/charting/plot2d/Scatter |
---|
188 | }, |
---|
189 | _animateScatter: function(shape, offset){ |
---|
190 | fx.animateTransform(lang.delegate({ |
---|
191 | shape: shape, |
---|
192 | duration: 1200, |
---|
193 | transform: [ |
---|
194 | {name: "translate", start: [0, offset], end: [0, 0]}, |
---|
195 | {name: "scale", start: [0, 0], end: [1, 1]}, |
---|
196 | {name: "original"} |
---|
197 | ] |
---|
198 | }, this.animate)).play(); |
---|
199 | } |
---|
200 | }); |
---|
201 | }); |
---|