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

define(["dojo/_base/lang", "dojo/_base/declare", "dojo/_base/array", 
                "./Base", "./common", "dojox/lang/functional", "dojox/lang/functional/reversed", 
                "dojox/lang/utils", "dojox/gfx/fx"], 
        function(lang, declare, arr, Base, dc, df, dfr, du, fx){
/*=====
var Base = dojox.charting.plot2d.Base;
=====*/

        var purgeGroup = dfr.lambda("item.purgeGroup()");

        return declare("dojox.charting.plot2d.Bubble", Base, {
                //      summary:
                //              A plot representing bubbles.  Note that data for Bubbles requires 3 parameters,
                //              in the form of:  { x, y, size }, where size determines the size of the bubble.
                defaultParams: {
                        hAxis: "x",             // use a horizontal axis named "x"
                        vAxis: "y",             // use a vertical axis named "y"
                        animate: null   // animate bars into place
                },
                optionalParams: {
                        // theme component
                        stroke:         {},
                        outline:        {},
                        shadow:         {},
                        fill:           {},
                        font:           "",
                        fontColor:      ""
                },

                constructor: function(chart, kwArgs){
                        //      summary:
                        //              Create a plot of bubbles.
                        //      chart: dojox.charting.Chart
                        //              The chart this plot belongs to.
                        //      kwArgs: dojox.charting.plot2d.__DefaultCtorArgs?
                        //              Optional keyword arguments object to help define plot parameters.
                        this.opt = lang.clone(this.defaultParams);
            du.updateWithObject(this.opt, kwArgs);
            du.updateWithPattern(this.opt, kwArgs, this.optionalParams);
            this.series = [];
                        this.hAxis = this.opt.hAxis;
                        this.vAxis = this.opt.vAxis;
                        this.animate = this.opt.animate;
                },

                //      override the render so that we are plotting only circles.
                render: function(dim, offsets){
                        //      summary:
                        //              Run the calculations for any axes for this plot.
                        //      dim: Object
                        //              An object in the form of { width, height }
                        //      offsets: Object
                        //              An object of the form { l, r, t, b}.
                        //      returns: dojox.charting.plot2d.Bubble
                        //              A reference to this plot for functional chaining.
                        if(this.zoom && !this.isDataDirty()){
                                return this.performZoom(dim, offsets);
                        }
                        this.resetEvents();
                        this.dirty = this.isDirty();
                        if(this.dirty){
                                arr.forEach(this.series, purgeGroup);
                                this._eventSeries = {};
                                this.cleanGroup();
                                var s = this.group;
                                df.forEachRev(this.series, function(item){ item.cleanGroup(s); });
                        }

                        var t = this.chart.theme,
                                ht = this._hScaler.scaler.getTransformerFromModel(this._hScaler),
                                vt = this._vScaler.scaler.getTransformerFromModel(this._vScaler),
                                events = this.events();

                        for(var i = this.series.length - 1; i >= 0; --i){
                                var run = this.series[i];
                                if(!this.dirty && !run.dirty){
                                        t.skip();
                                        this._reconnectEvents(run.name);
                                        continue;
                                }
                                run.cleanGroup();
                                if(!run.data.length){
                                        run.dirty = false;
                                        t.skip();
                                        continue;
                                }

                                if(typeof run.data[0] == "number"){
                                        console.warn("dojox.charting.plot2d.Bubble: the data in the following series cannot be rendered as a bubble chart; ", run);
                                        continue;
                                }

                                var theme = t.next("circle", [this.opt, run]), s = run.group,
                                        points = arr.map(run.data, function(v, i){
                                                return v ? {
                                                        x: ht(v.x) + offsets.l,
                                                        y: dim.height - offsets.b - vt(v.y),
                                                        radius: this._vScaler.bounds.scale * (v.size / 2)
                                                } : null;
                                        }, this);

                                var frontCircles = null, outlineCircles = null, shadowCircles = null;

                                // make shadows if needed
                                if(theme.series.shadow){
                                        shadowCircles = arr.map(points, function(item){
                                                if(item !== null){
                                                        var finalTheme = t.addMixin(theme, "circle", item, true),
                                                                shadow = finalTheme.series.shadow;
                                                        var shape = s.createCircle({
                                                                cx: item.x + shadow.dx, cy: item.y + shadow.dy, r: item.radius
                                                        }).setStroke(shadow).setFill(shadow.color);
                                                        if(this.animate){
                                                                this._animateBubble(shape, dim.height - offsets.b, item.radius);
                                                        }
                                                        return shape;
                                                }
                                                return null;
                                        }, this);
                                        if(shadowCircles.length){
                                                run.dyn.shadow = shadowCircles[shadowCircles.length - 1].getStroke();
                                        }
                                }

                                // make outlines if needed
                                if(theme.series.outline){
                                        outlineCircles = arr.map(points, function(item){
                                                if(item !== null){
                                                        var finalTheme = t.addMixin(theme, "circle", item, true),
                                                                outline = dc.makeStroke(finalTheme.series.outline);
                                                        outline.width = 2 * outline.width + theme.series.stroke.width;
                                                        var shape = s.createCircle({
                                                                cx: item.x, cy: item.y, r: item.radius
                                                        }).setStroke(outline);
                                                        if(this.animate){
                                                                this._animateBubble(shape, dim.height - offsets.b, item.radius);
                                                        }
                                                        return shape;
                                                }
                                                return null;
                                        }, this);
                                        if(outlineCircles.length){
                                                run.dyn.outline = outlineCircles[outlineCircles.length - 1].getStroke();
                                        }
                                }

                                //      run through the data and add the circles.
                                frontCircles = arr.map(points, function(item){
                                        if(item !== null){
                                                var finalTheme = t.addMixin(theme, "circle", item, true),
                                                        rect = {
                                                                x: item.x - item.radius,
                                                                y: item.y - item.radius,
                                                                width:  2 * item.radius,
                                                                height: 2 * item.radius
                                                        };
                                                var specialFill = this._plotFill(finalTheme.series.fill, dim, offsets);
                                                specialFill = this._shapeFill(specialFill, rect);
                                                var shape = s.createCircle({
                                                        cx: item.x, cy: item.y, r: item.radius
                                                }).setFill(specialFill).setStroke(finalTheme.series.stroke);
                                                if(this.animate){
                                                        this._animateBubble(shape, dim.height - offsets.b, item.radius);
                                                }
                                                return shape;
                                        }
                                        return null;
                                }, this);
                                if(frontCircles.length){
                                        run.dyn.fill   = frontCircles[frontCircles.length - 1].getFill();
                                        run.dyn.stroke = frontCircles[frontCircles.length - 1].getStroke();
                                }

                                if(events){
                                        var eventSeries = new Array(frontCircles.length);
                                        arr.forEach(frontCircles, function(s, i){
                                                if(s !== null){
                                                        var o = {
                                                                element: "circle",
                                                                index:   i,
                                                                run:     run,
                                                                shape:   s,
                                                                outline: outlineCircles && outlineCircles[i] || null,
                                                                shadow:  shadowCircles && shadowCircles[i] || null,
                                                                x:       run.data[i].x,
                                                                y:       run.data[i].y,
                                                                r:       run.data[i].size / 2,
                                                                cx:      points[i].x,
                                                                cy:      points[i].y,
                                                                cr:      points[i].radius
                                                        };
                                                        this._connectEvents(o);
                                                        eventSeries[i] = o;
                                                }
                                        }, this);
                                        this._eventSeries[run.name] = eventSeries;
                                }else{
                                        delete this._eventSeries[run.name];
                                }

                                run.dirty = false;
                        }
                        this.dirty = false;
                        return this;    //      dojox.charting.plot2d.Bubble
                },
                _animateBubble: function(shape, offset, size){
                        fx.animateTransform(lang.delegate({
                                shape: shape,
                                duration: 1200,
                                transform: [
                                        {name: "translate", start: [0, offset], end: [0, 0]},
                                        {name: "scale", start: [0, 1/size], end: [1, 1]},
                                        {name: "original"}
                                ]
                        }, this.animate)).play();
                }
        });
});