source: Dev/branches/rest-dojo-ui/client/dojox/charting/plot2d/Columns.js @ 256

Last change on this file since 256 was 256, checked in by hendrikvanantwerpen, 13 years ago

Reworked project structure based on REST interaction and Dojo library. As
soon as this is stable, the old jQueryUI branch can be removed (it's
kept for reference).

File size: 5.7 KB
Line 
1define(["dojo/_base/lang", "dojo/_base/array", "dojo/_base/declare", "./Base", "./common",
2                "dojox/lang/functional", "dojox/lang/functional/reversed", "dojox/lang/utils", "dojox/gfx/fx"],
3        function(lang, arr, declare, Base, dc, df, dfr, du, fx){
4
5        var purgeGroup = dfr.lambda("item.purgeGroup()");
6/*=====
7var Base = dojox.charting.plot2d.Base;
8=====*/
9
10        return declare("dojox.charting.plot2d.Columns", Base, {
11                //      summary:
12                //              The plot object representing a column chart (vertical bars).
13                defaultParams: {
14                        hAxis: "x",             // use a horizontal axis named "x"
15                        vAxis: "y",             // use a vertical axis named "y"
16                        gap:    0,              // gap between columns in pixels
17                        animate: null,  // animate bars into place
18                        enableCache: false
19                },
20                optionalParams: {
21                        minBarSize:     1,      // minimal column width in pixels
22                        maxBarSize:     1,      // maximal column width in pixels
23                        // theme component
24                        stroke:         {},
25                        outline:        {},
26                        shadow:         {},
27                        fill:           {},
28                        font:           "",
29                        fontColor:      ""
30                },
31
32                constructor: function(chart, kwArgs){
33                        //      summary:
34                        //              The constructor for a columns chart.
35                        //      chart: dojox.charting.Chart
36                        //              The chart this plot belongs to.
37                        //      kwArgs: dojox.charting.plot2d.__BarCtorArgs?
38                        //              An optional keyword arguments object to help define the plot.
39                        this.opt = lang.clone(this.defaultParams);
40                        du.updateWithObject(this.opt, kwArgs);
41                        du.updateWithPattern(this.opt, kwArgs, this.optionalParams);
42                        this.series = [];
43                        this.hAxis = this.opt.hAxis;
44                        this.vAxis = this.opt.vAxis;
45                        this.animate = this.opt.animate;
46                },
47
48                getSeriesStats: function(){
49                        //      summary:
50                        //              Calculate the min/max on all attached series in both directions.
51                        //      returns: Object
52                        //              {hmin, hmax, vmin, vmax} min/max in both directions.
53                        var stats = dc.collectSimpleStats(this.series);
54                        stats.hmin -= 0.5;
55                        stats.hmax += 0.5;
56                        return stats;
57                },
58               
59                createRect: function(run, creator, params){
60                        var rect;
61                        if(this.opt.enableCache && run._rectFreePool.length > 0){
62                                rect = run._rectFreePool.pop();
63                                rect.setShape(params);
64                                // was cleared, add it back
65                                creator.add(rect);
66                        }else{
67                                rect = creator.createRect(params);
68                        }
69                        if(this.opt.enableCache){
70                                run._rectUsePool.push(rect);
71                        }
72                        return rect;
73                },
74
75                render: function(dim, offsets){
76                        //      summary:
77                        //              Run the calculations for any axes for this plot.
78                        //      dim: Object
79                        //              An object in the form of { width, height }
80                        //      offsets: Object
81                        //              An object of the form { l, r, t, b}.
82                        //      returns: dojox.charting.plot2d.Columns
83                        //              A reference to this plot for functional chaining.
84                        if(this.zoom && !this.isDataDirty()){
85                                return this.performZoom(dim, offsets);
86                        }
87                        var t = this.getSeriesStats();
88                        this.resetEvents();
89                        this.dirty = this.isDirty();
90                        if(this.dirty){
91                                arr.forEach(this.series, purgeGroup);
92                                this._eventSeries = {};
93                                this.cleanGroup();
94                                var s = this.group;
95                                df.forEachRev(this.series, function(item){ item.cleanGroup(s); });
96                        }
97                        var t = this.chart.theme, f, gap, width,
98                                ht = this._hScaler.scaler.getTransformerFromModel(this._hScaler),
99                                vt = this._vScaler.scaler.getTransformerFromModel(this._vScaler),
100                                baseline = Math.max(0, this._vScaler.bounds.lower),
101                                baselineHeight = vt(baseline),
102                                min = Math.max(0, Math.floor(this._hScaler.bounds.from - 1)), max = Math.ceil(this._hScaler.bounds.to),
103                                events = this.events();
104                        f = dc.calculateBarSize(this._hScaler.bounds.scale, this.opt);
105                        gap = f.gap;
106                        width = f.size;
107                        for(var i = this.series.length - 1; i >= 0; --i){
108                                var run = this.series[i];
109                                if(!this.dirty && !run.dirty){
110                                        t.skip();
111                                        this._reconnectEvents(run.name);
112                                        continue;
113                                }
114                                run.cleanGroup();
115                                if(this.opt.enableCache){
116                                        run._rectFreePool = (run._rectFreePool?run._rectFreePool:[]).concat(run._rectUsePool?run._rectUsePool:[]);
117                                        run._rectUsePool = [];
118                                }
119                                var theme = t.next("column", [this.opt, run]), s = run.group,
120                                        eventSeries = new Array(run.data.length);
121                                var l = Math.min(run.data.length, max);
122                                for(var j = min; j < l; ++j){
123                                        var value = run.data[j];
124                                        if(value !== null){
125                                                var v = typeof value == "number" ? value : value.y,
126                                                        vv = vt(v),
127                                                        height = vv - baselineHeight,
128                                                        h = Math.abs(height),
129                                                        finalTheme = typeof value != "number" ?
130                                                                t.addMixin(theme, "column", value, true) :
131                                                                t.post(theme, "column");
132                                                if(width >= 1 && h >= 0){
133                                                        var rect = {
134                                                                x: offsets.l + ht(j + 0.5) + gap,
135                                                                y: dim.height - offsets.b - (v > baseline ? vv : baselineHeight),
136                                                                width: width, height: h
137                                                        };
138                                                        var specialFill = this._plotFill(finalTheme.series.fill, dim, offsets);
139                                                        specialFill = this._shapeFill(specialFill, rect);
140                                                        var shape = this.createRect(run, s, rect).setFill(specialFill).setStroke(finalTheme.series.stroke);
141                                                        run.dyn.fill   = shape.getFill();
142                                                        run.dyn.stroke = shape.getStroke();
143                                                        if(events){
144                                                                var o = {
145                                                                        element: "column",
146                                                                        index:   j,
147                                                                        run:     run,
148                                                                        shape:   shape,
149                                                                        x:       j + 0.5,
150                                                                        y:       v
151                                                                };
152                                                                this._connectEvents(o);
153                                                                eventSeries[j] = o;
154                                                        }
155                                                        if(this.animate){
156                                                                this._animateColumn(shape, dim.height - offsets.b - baselineHeight, h);
157                                                        }
158                                                }
159                                        }
160                                }
161                                this._eventSeries[run.name] = eventSeries;
162                                run.dirty = false;
163                        }
164                        this.dirty = false;
165                        return this;    //      dojox.charting.plot2d.Columns
166                },
167                _animateColumn: function(shape, voffset, vsize){
168                        fx.animateTransform(lang.delegate({
169                                shape: shape,
170                                duration: 1200,
171                                transform: [
172                                        {name: "translate", start: [0, voffset - (voffset/vsize)], end: [0, 0]},
173                                        {name: "scale", start: [1, 1/vsize], end: [1, 1]},
174                                        {name: "original"}
175                                ]
176                        }, this.animate)).play();
177                }
178        });
179});
Note: See TracBrowser for help on using the repository browser.