rgraph-rails 4.62 → 4.64

data/vendor/assets/javascripts/RGraph.svg.scatter.js

@@ -1,1262 +1,59 @@
-// version: 2017-05-08
-    /**
-    * o--------------------------------------------------------------------------------o
-    * | This file is part of the RGraph package - you can learn more at:               |
-    * |                                                                                |
-    * |                          http://www.rgraph.net                                 |
-    * |                                                                                |
-    * | RGraph is licensed under the Open Source MIT license. That means that it's     |
-    * | totally free to use!                                                           |
-    * o--------------------------------------------------------------------------------o
-    */
 
-    RGraph = window.RGraph || {isRGraph: true};
-    RGraph.SVG = RGraph.SVG || {};
-
-// Module pattern
-(function (win, doc, undefined)
-{
-    var RG  = RGraph,
-        ua  = navigator.userAgent,
-        ma  = Math,
-        win = window,
-        doc = document;
-
-
-
-    RG.SVG.Scatter = function (conf)
-    {
-        //
-        // A setter that the constructor uses (at the end)
-        // to set all of the properties
-        //
-        // @param string name  The name of the property to set
-        // @param string value The value to set the property to
-        //
-        this.set = function (name, value)
-        {
-            if (arguments.length === 1 && typeof name === 'object') {
-                for (i in arguments[0]) {
-                    if (typeof i === 'string') {
-                    
-                        var ret = RG.SVG.commonSetter({
-                            object: this,
-                            name:   i,
-                            value:  arguments[0][i]
-                        });
-                        
-                        name  = ret.name;
-                        value = ret.value;
-
-                        this.set(name, value);
-                    }
-                }
-            } else {
-
-                    
-                var ret = RG.SVG.commonSetter({
-                    object: this,
-                    name:   name,
-                    value:  value
-                });
-                
-                name  = ret.name;
-                value = ret.value;
-
-                this.properties[name] = value;
-            }
-
-            return this;
-        };
-
-
-
-
-
-
-        this.id               = conf.id;
-        this.uid              = RG.SVG.createUID();
-        this.container        = document.getElementById(this.id);
-        this.svg              = RG.SVG.createSVG({container: this.container});
-        this.isRGraph         = true;
-        this.width            = Number(this.svg.getAttribute('width'));
-        this.height           = Number(this.svg.getAttribute('height'));
-        this.data             = conf.data;
-        this.type             = 'scatter';
-        this.coords           = [];
-        this.colorsParsed     = false;
-        this.originalColors   = {};
-        this.gradientCounter  = 1;
-        this.sequential       = 0;
-
-        // Add this object to the ObjectRegistry
-        RG.SVG.OR.add(this);
-        
-        this.container.style.display = 'inline-block';
-
-        this.properties =
-        {
-            gutterLeft:   35,
-            gutterRight:  35,
-            gutterTop:    35,
-            gutterBottom: 35,
-           
-            backgroundColor:            null,
-            backgroundImage:            null,
-            backgroundImageAspect:      'none',
-            backgroundImageStretch:     true,
-            backgroundImageOpacity:     null,
-            backgroundImageX:           null,
-            backgroundImageY:           null,
-            backgroundImageW:           null,
-            backgroundImageH:           null,
-            backgroundGrid:             true,
-            backgroundGridColor:        '#ddd', 
-            backgroundGridLinewidth:    1,
-            backgroundGridHlines:       true,
-            backgroundGridHlinesCount:  null,
-            backgroundGridVlines:       true,
-            backgroundGridVlinesCount:  null,
-            backgroundGridBorder:       true,
-            
-            xmax:                 0,
-            tickmarksStyle:       'cross',
-            tickmarksSize:        7,
-            colors:               ['black'],
-            
-            line:                 false,
-            lineColors:           1,
-            lineLinewidth:        'black',
-
-            yaxis:                true,
-            yaxisTickmarks:       true,
-            yaxisTickmarksLength: 3,
-            yaxisColor:           'black',
-            yaxisScale:           true,
-            yaxisLabels:          null,
-            yaxisLabelsOffsetx:   0,
-            yaxisLabelsOffsety:   0,
-            yaxisLabelsCount:     5,
-            yaxisUnitsPre:        '',
-            yaxisUnitsPost:       '',
-            yaxisStrict:          false,
-            yaxisDecimals:        0,
-            yaxisPoint:           '.',
-            yaxisThousand:        ',',
-            yaxisRound:           false,
-            yaxisMax:             null,
-            yaxisMin:             0,
-            yaxisFormatter:       null,
-
-            xaxis:                true,
-            xaxisTickmarks:       true,
-            xaxisTickmarksLength: 5,
-            xaxisLabels:          null,
-            xaxisLabelsPosition:  'section',
-            xaxisLabelsPositionEdgeTickmarksCount: null,
-            xaxisColor:           'black',
-            xaxisLabelsOffsetx:   0,
-            xaxisLabelsOffsety:   0,
-            xaxisMin:             0,
-            xaxisMax:             null,
-            
-            textColor:            'black',
-            textFont:             'sans-serif',
-            textSize:             12,
-            textBold:             false,
-            textItalic:           false,
-
-            tooltipsOverride:     null,
-            tooltipsEffect:       'fade',
-            tooltipsCssClass:     'RGraph_tooltip',
-            tooltipsEvent:        'mousemove',
-
-            highlightStroke:      'rgba(0,0,0,0)',
-            highlightFill:        'rgba(255,255,255,0.7)',
-            highlightLinewidth:   1,
-            
-            title:                '',
-            titleSize:            16,
-            titleX:               null,
-            titleY:               null,
-            titleHalign:          'center',
-            titleValign:          null,
-            titleColor:           'black',
-            titleFont:            null,
-            titleBold:            false,
-            titleItalic:          false,
-            
-            titleSubtitle:        '',
-            titleSubtitleSize:    10,
-            titleSubtitleX:       null,
-            titleSubtitleY:       null,
-            titleSubtitleHalign:  'center',
-            titleSubtitleValign:  null,
-            titleSubtitleColor:   '#aaa',
-            titleSubtitleFont:    null,
-            titleSubtitleBold:    false,
-            titleSubtitleItalic:  false,
-
-            key:            null,
-            keyColors:      null,
-            keyOffsetx:     0,
-            keyOffsety:     0,
-            keyTextOffsetx: 0,
-            keyTextOffsety: -1,
-            keyTextSize:    null,
-            keyTextBold:    null,
-            keyTextItalic:  null,
-            
-            attribution:        true,
-            attributionX:       null,
-            attributionY:       null,
-            attributionHref:    null,// Default is set in RGraph.svg.common.core.js
-            attributionHalign:  'right',
-            attributionValign:  'bottom',
-            attributionSize:    7,
-            attributionColor:   'gray',
-            attributionFont:    'sans-serif',
-            attributionItalic:  false,
-            attributionBold:    false
-        };
-
-
-
-
-
-        //
-        // Set the options that the user has provided
-        //
-        for (i in conf.options) {
-            if (typeof i === 'string') {
-                this.set(i, conf.options[i]);
-            }
-        }
-
-
-
-
-
-        // Handles the data that was supplied to the object. If only one dataset
-        // was given, convert it into into a multiple dataset style array
-        if (this.data[0] && !RG.SVG.isArray(this.data[0])) {
-            this.data = [];
-            this.data[0] = conf.data;
-        }
-
-
-
-
-
-        /**
-        * "Decorate" the object with the generic effects if the effects library has been included
-        */
-        if (RG.SVG.FX && typeof RG.SVG.FX.decorate === 'function') {
-            RG.SVG.FX.decorate(this);
-        }
-
-
-
-
-        var prop = this.properties;
-        
-        
-        //
-        // Convert string X values to timestamps
-        //
-        if (typeof prop.xaxisMin === 'string') {
-            prop.xaxisMin = RG.SVG.parseDate(prop.xaxisMin);
-        }
-
-        if (typeof prop.xaxisMax === 'string') {
-            prop.xaxisMax = RG.SVG.parseDate(prop.xaxisMax);
-        }
-        
-        for (var i=0; i<this.data.length; ++i) {
-            for (var j=0; j<this.data[i].length; ++j) {
-                if (typeof this.data[i][j].x === 'string') {
-                    this.data[i][j].x = RG.SVG.parseDate(this.data[i][j].x);
-                }
-            }
-        }
-
-
-
-
-
-
-
-
-        //
-        // The draw method draws the Bar chart
-        //
-        this.draw = function ()
-        {
-            // Fire the beforedraw event
-            RG.SVG.fireCustomEvent(this, 'onbeforedraw');
-
-
-
-
-            // Create the defs tag if necessary
-            RG.SVG.createDefs(this);
-
-
-
-
-
-            this.graphWidth  = this.width - prop.gutterLeft - prop.gutterRight;
-            this.graphHeight = this.height - prop.gutterTop - prop.gutterBottom;
-
-
-
-
-            // Parse the colors for gradients
-            RG.SVG.resetColorsToOriginalValues({object:this});
-            this.parseColors();
-
-
-
-
-            // Work out the maximum value
-            for (var ds=0,max=0; ds<this.data.length; ++ds) { // Datasets
-                for (var dp=0; dp<this.data[ds].length; ++dp) { // Datapoints
-                    max = ma.max(max, this.data[ds][dp].y);
-                }
-            }
-
-
-
-
-
-
-            // A custom, user-specified maximum value
-            if (typeof prop.yaxisMax === 'number') {
-                max = prop.yaxisMax;
-            }
-            
-            // Set the ymin to zero if it's set mirror
-            if (prop.yaxisMin === 'mirror' || prop.yaxisMin === 'middle' || prop.yaxisMin === 'center') {
-                var mirrorScale = true;
-                prop.yaxisMin   = 0;
-            }
-
-
-            //
-            // Generate an appropiate scale
-            //
-            this.scale = RG.SVG.getScale({
-                object:    this,
-                numlabels: prop.yaxisLabelsCount,
-                unitsPre:  prop.yaxisUnitsPre,
-                unitsPost: prop.yaxisUnitsPost,
-                max:       max,
-                min:       prop.yaxisMin,
-                point:     prop.yaxisPoint,
-                round:     prop.yaxisRound,
-                thousand:  prop.yaxisThousand,
-                decimals:  prop.yaxisDecimals,
-                strict:    typeof prop.yaxisMax === 'number',
-                formatter: prop.yaxisFormatter
-            });
-                
-
-
-            //
-            // Get the scale a second time if the ymin should be mirored
-            //
-            // Set the ymin to zero if it's set mirror
-            if (mirrorScale) {
-                this.scale = RG.SVG.getScale({
-                    object: this,
-                    numlabels: prop.yaxisLabelsCount,
-                    unitsPre:  prop.yaxisUnitsPre,
-                    unitsPost: prop.yaxisUnitsPost,
-                    max:       this.scale.max,
-                    min:       this.scale.max * -1,
-                    point:     prop.yaxisPoint,
-                    round:     false,
-                    thousand:  prop.yaxisThousand,
-                    decimals:  prop.yaxisDecimals,
-                    strict:    typeof prop.yaxisMax === 'number',
-                    formatter: prop.yaxisFormatter
-                });
-            }
-
-            // Now the scale has been generated adopt its max value
-            this.max      = this.scale.max;
-            this.min      = this.scale.min;
-            prop.yaxisMax = this.scale.max;
-            prop.yaxisMin = this.scale.min;
-
-
-
-
-            // Draw the background first
-            RG.SVG.drawBackground(this);
-
-
-
-
-
-
-
-            // Draw the axes under the points
-            RG.SVG.drawXAxis(this);
-            RG.SVG.drawYAxis(this);
-
-
-
-
-
-
-            // Create a group for all of the datasets
-            var dataset_group = RGraph.SVG.create({
-                svg: this.svg,
-                type: 'g',
-                parent: this.svg.all,
-                attr: {
-                    className: 'scatter_datasets_' + this.uid
-                }
-            });
-
-            // Draw the points for all of the datasets
-            for (var i=0; i<this.data.length; ++i) {
-
-                this.drawPoints({
-                    index: i,
-                    data: this.data[i],
-                    group: dataset_group
-                });
-                
-                if (prop.line == true || (typeof prop.line === 'object' && prop.line[i] == true)) {
-                    this.drawLine({
-                         index: i,
-                        coords: this.coords[i]
-                    });
-                }
-            }
-
-
-
-            // Draw the key
-            if (typeof prop.key !== null && RG.SVG.drawKey) {
-                RG.SVG.drawKey(this);
-            } else if (!RGraph.SVG.isNull(prop.key)) {
-                alert('The drawKey() function does not exist - have you forgotten to include the key library?');
-            }
-
-
-            
-            
-            // Add the attribution link. If you're adding this elsewhere on your page/site
-            // and you don't want it displayed then there are options available to not
-            // show it.
-            RG.SVG.attribution(this);
-
-
-
-
-            // Add the event listener that clears the highlight rect if
-            // there is any. Must be MOUSEDOWN (ie before the click event)
-            //var obj = this;
-            //doc.body.addEventListener('mousedown', function (e)
-            //{
-                //RG.SVG.removeHighlight(obj);
-
-            //}, false);
-
-
-
-            // Fire the draw event
-            RG.SVG.fireCustomEvent(this, 'ondraw');
-
-
-
-
-            return this;
-        };
-
-
-
-
-
-
-
-
-        //
-        // Draws the Points
-        //
-        // @param opt object Options to the function which can consist of:
-        //                     o index:   The numerical index of the DATASET
-        //                     o dataset: The dataset.
-        //
-        this.drawPoints = function (opt)
-        {
-            var index = opt.index,
-                data  = opt.data,
-                group = opt.group;
-
-            // Initialise the array for coordinates
-            this.coords[index] = [];
-
-            //
-            // Create the <g> tag that the datapoints are added to
-            //
-            var group = RG.SVG.create({
-                svg: this.svg,
-                type: 'g',
-                parent: group,
-                attr: {
-                    className: 'scatter_dataset_' + index + '_' + this.uid
-                }
-            });
-
-            // Loop through the data
-            for (var i=0; i<data.length; ++i) {
-
-                var point = data[i];
-            
-                if (typeof point.x === 'number'&& typeof point.y === 'number') {
-                    var ret = this.drawSinglePoint({
-                        dataset:    data,
-                        datasetIdx: index,
-                        point:      point,
-                        index:      i,
-                        group:      group, // The SVG <g> tag the the points are added to
-                        sequential: this.sequential++
-                    });
-                    
-                    this.coords[index][i] = [ret.x, ret.y];
-                }
-
-
-
-
-
-
-
-
-
-
-
-
-
-                //
-                // Add tooltip highlight to the point
-                //
-                if ( (typeof data[i].tooltip === 'string' && data[i].tooltip) || (typeof data[i].tooltip === 'number') ) {
-
-                    // Convert the tooltip to a string
-                    data[i].tooltip = String(data[i].tooltip);
-
-                    // Make the tooltipsEvent default to click
-                    if (prop.tooltipsEvent !== 'mousemove') {
-                        prop.tooltipsEvent = 'click';
-                    }
-
-                    if (!group_tooltip_hotspots) {
-                        var group_tooltip_hotspots = RG.SVG.create({
-                            svg: this.svg,
-                            parent: this.svg.all,
-                            type: 'g',
-                            attr: {
-                                className: 'rgraph-scatter-tooltip-hotspots'
-                            }
-                        });
-                    }
-
-                    var rect = RG.SVG.create({
-                        svg:  this.svg,
-                        parent: this.svg.all,
-                        type: 'rect',
-                        parent: group_tooltip_hotspots,
-                        attr: {
-                            x: ret.x - (ret.size / 2),
-                            y: ret.y - (ret.size / 2),
-                            width: ret.size,
-                            height: ret.size,
-                            fill: 'transparent',
-                            stroke: 'transparent',
-                            'stroke-width': 0
-                        },
-                        style: {
-                            cursor: 'pointer'
-                        }
-                    });
-                    
-                    // Add the hotspot to the original tickmark
-                    ret.mark.hotspot = rect;
-
-                    (function (dataset, index, seq, obj)
-                    {
-                        rect.addEventListener(prop.tooltipsEvent, function (e)
-                        {
-                            var tooltip = RG.SVG.REG.get('tooltip');
-
-                            if (tooltip && tooltip.__dataset__ === dataset && tooltip.__index__ === index) {
-                                return;
-                            }
-                
-                            obj.removeHighlight();
-
-                            // Show the tooltip
-                            RG.SVG.tooltip({
-                                object: obj,
-                                dataset: dataset,
-                                index: index,
-                                sequentialIndex: seq,
-                                text: obj.data[dataset][index].tooltip,
-                                event: e
-                            });
-
-
-                            // Highlight the shape that has been clicked on
-                            if (RG.SVG.REG.get('tooltip')) {
-                                obj.highlight(this);
-                            }
-                            
-                        }, false);
-                
-                        // Install the event listener that changes the
-                        // cursor if necessary
-                        if (prop.tooltipsEvent === 'click') {
-                            rect.addEventListener('mousemove', function (e)
-                            {
-                                e.target.style.cursor = 'pointer';
-                            }, false);
-                        }
-                        
-                    }(index, i, this.sequential - 1, this));
-                }
-            }
-        };
-
-
-
-
-
-
-
-
-        //
-        // Draws a single point on the chart
-        //
-        this.drawSinglePoint = function (opt)
-        {
-            var dataset    = opt.dataset,
-                datasetIdx = opt.datasetIdx,
-                seq        = opt.sequential,
-                point      = opt.point,
-                index      = opt.index,
-                valueX     = opt.point.x,
-                valueY     = opt.point.y,
-                conf       = opt.point || {},
-                group      = opt.group,
-                coordX     = opt.coordx = this.getXCoord(valueX),
-                coordY     = opt.coordy = this.getYCoord(valueY);
-
-            
-            
-
-
-
-
-
-
-
-
-            // Allow shape to be synonym for type
-            if (typeof conf.type === 'undefined' && typeof conf.shape !== 'undefined') {
-                conf.type = conf.shape;
-            }
-
-
-
-
-
-
-            // set the type to the default if its not set
-            if (typeof conf.type === 'string') {
-                // nada
-            } else if (typeof prop.tickmarksStyle === 'string') {
-                conf.type = prop.tickmarksStyle;
-            } else if (typeof prop.tickmarksStyle === 'object' && typeof prop.tickmarksStyle[datasetIdx] === 'string') {
-                conf.type = prop.tickmarksStyle[datasetIdx];
-            }
-
-
-
-
-
-
-
-
-
-
-
-
-            // set the size to the default if its not set
-            if (typeof conf.size !== 'number' && typeof prop.tickmarksSize === 'number') {
-                conf.size = prop.tickmarksSize;
-            } else if (typeof conf.size !== 'number' && typeof prop.tickmarksSize === 'object' && typeof prop.tickmarksSize[datasetIdx] === 'number') {
-                conf.size = prop.tickmarksSize[datasetIdx];
-            }
-
-
-
-
-
-
-
-            // Set the color to the default if its not set and then blacck if thats not set either
-            if (typeof conf.color === 'string') {
-                // nada
-            } else if (typeof prop.colors[datasetIdx] === 'string') {
-                conf.color = prop.colors[datasetIdx];
-            } else {
-                conf.color = 'black';
-            }
-
-
-
-
-
-
-
-            // Set the opacity of this point
-            if (typeof conf.opacity === 'undefined') {
-                conf.opacity = 1;
-            } else if (typeof conf.opacity === 'number') {
-                // nada
-            }
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-            // Bubble charts are drawn by their own function
-            if (prop.bubble) {
-                return this.drawBubble(opt, conf);
-            }
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-            // Handle the various shapes for tickmarks here
-            switch (conf.type) {
-                case 'image:' + conf.type.substr(6):
-                
-                    var src = conf.type.substr(6);
-
-                    var img = new Image();
-                    img.src = src;
-                    
-                    var mark = RG.SVG.create({
-                        svg: this.svg,
-                        type: 'image',
-                        parent: group,
-                        attr: {
-                            preserveAspectRatio: 'xMidYMid meet',
-                            'xlink:href': src
-                        }
-                    });
-
-                    // Once the image has loaded the x/y/width/height can be set
-                    // (both the image and it's hotspot)
-                    img.onload = function ()
-                    {
-                        var x = coordX - (img.width / 2),
-                            y = coordY - (img.height / 2),
-                            w = img.width,
-                            h = img.height;
-
-                        mark.setAttribute('x', x);
-                        mark.setAttribute('y', y);
-                        mark.setAttribute('width', w);
-                        mark.setAttribute('height', h);
-
-                        if (mark && mark.hotspot) {
-                            mark.hotspot.setAttribute('x', x);
-                            mark.hotspot.setAttribute('y', y);
-                            mark.hotspot.setAttribute('width', w);
-                            mark.hotspot.setAttribute('height', h);
-                        }
-                    };
-
-                    break;
-
-                case 'triangle':
-                    var mark = RG.SVG.create({
-                        svg: this.svg,
-                        type: 'path',
-                        parent: group,
-                        attr: {
-                            d: 'M {1} {2} L {3} {4} L {5} {6}'.format(
-                                coordX - (conf.size / 2),
-                                coordY + (conf.size / 2),
-                                coordX,
-                                coordY - (conf.size / 2),
-                                coordX + (conf.size / 2),
-                                coordY + (conf.size / 2)
-                            ),
-                            fill: conf.color,
-                            'fill-opacity': conf.opacity
-                        }
-                    });
-                break;
-
-                case 'plus':
-                    var mark = RG.SVG.create({
-                        svg: this.svg,
-                        type: 'path',
-                        parent: group,
-                        attr: {
-                            d: 'M {1} {2} L {3} {4} M {5} {6} L {7} {8}'.format(
-                                coordX - (conf.size / 2),
-                                coordY,
-                                coordX +  (conf.size / 2),
-                                coordY,
-                                coordX,
-                                coordY - (conf.size / 2),
-                                coordX,
-                                coordY + (conf.size / 2)
-                            ),
-                            stroke: conf.color,
-                            'stroke-opacity': conf.opacity
-                        }
-                    });
-                break;
-
-                case 'square':
-                case 'rect':
-                    var mark = RG.SVG.create({
-                        svg: this.svg,
-                        type: 'rect',
-                        parent: group,
-                        attr: {
-                            x: coordX - (conf.size / 2),
-                            y: coordY - (conf.size / 2),
-                            width: conf.size,
-                            height: conf.size,
-                            fill: conf.color,
-                            'fill-opacity': conf.opacity
-                        }
-                    });
-                break;
-
-
-
-                case 'dot':
-                case 'circle':
-                    var mark = RG.SVG.create({
-                        svg: this.svg,
-                        type: 'circle',
-                        parent: group,
-                        attr: {
-                            cx: coordX,
-                            cy: coordY,
-                            r: conf.size / 2,
-                            fill: conf.color,
-                            'fill-opacity': conf.opacity
-                        }
-                    });
-                break;
-
-
-
-                case 'cross':
-                default:
-                    var mark = RG.SVG.create({
-                        svg: this.svg,
-                        type: 'path',
-                        parent: group,  
-                        attr: {
-                            d: 'M {1} {2} L {3} {4} M {5} {6} L {7} {8}'.format(
-                                coordX - (conf.size / 2), coordY - (conf.size / 2),
-                                coordX + (conf.size / 2), coordY + (conf.size / 2),
-                                coordX - (conf.size / 2), coordY + (conf.size / 2),
-                                coordX + (conf.size / 2), coordY - (conf.size / 2)
-                            ),
-                            stroke: conf.color,
-                            'stroke-opacity': conf.opacity
-                        }
-                    });
-                    break;
-            }
-
-            // Add some data attributes that save various values
-            mark.setAttribute('data-index', index);
-            mark.setAttribute('data-dataset', datasetIdx);
-            mark.setAttribute('data-original-opacity', conf.opacity);
-            mark.setAttribute('data-original-color', conf.color);
-            mark.setAttribute('data-original-coordx', coordX);
-            mark.setAttribute('data-original-coordy', coordY);
-            mark.setAttribute('data-size', conf.size);
-            mark.setAttribute('data-sequential', seq);
-            mark.setAttribute('data-type', conf.type);
-
-            return {
-                x: coordX,
-                y: coordY,
-                size: conf.type.substr(0,6) === 'image:' ? img.width : conf.size,
-                mark: mark,
-                type: conf.type
-            };
-        };
-
-
-
-
-
-
-
-        // Draw a bubble on a bubble chart
-        this.drawBubble = function (opt, conf)
-        {
-            var size = (conf.z / prop.bubbleMaxValue) * prop.bubbleMaxRadius;
-
-            var color = RG.SVG.parseColorRadial({
-                object: this,
-                color: prop.bubbleColorsSolid ? conf.color : 'Gradient(white:' + conf.color + ')',
-                cx: opt.coordx + (size / 4),
-                cy: opt.coordy - (size / 4),
-                fx: opt.coordx + (size / 4),
-                fy: opt.coordy - (size / 4),
-                r: size * 1.5
-            });
-
-            var circle = RG.SVG.create({
-                svg: this.svg,
-                type: 'circle',
-                attr: {
-                    cx: opt.coordx,
-                    cy: opt.coordy,
-                    r: size,
-                    fill: color,
-                    'fill-opacity': conf.opacity
-                }
-            });
-
-            // Add some data attributes that save various values
-            circle.setAttribute('data-index', opt.index);
-            circle.setAttribute('data-dataset', opt.datasetIdx);
-            circle.setAttribute('data-original-opacity', conf.opacity);
-            circle.setAttribute('data-original-color', conf.color);
-            circle.setAttribute('data-original-coordx', opt.coordx);
-            circle.setAttribute('data-original-coordy', opt.coordy);
-            circle.setAttribute('data-size', size);
-            circle.setAttribute('data-sequential', opt.sequential);
-            circle.setAttribute('data-type', 'bubble');
-
-            return {
-                x: opt.coordx,
-                y: opt.coordy,
-                z: opt.coordz
-            };
-        };
-
-
-
-
-
-
-
-
-        //
-        // This functions draws a line if required
-        //
-        this.drawLine = function (opt)
-        {
-            var linewidth = 1,
-                color     = 'black';
-
-
-
-            // Calculate the linewidth
-            if (typeof prop.lineLinewidth === 'object' && typeof prop.lineLinewidth[opt.index] === 'number') {
-                linewidth = prop.lineLinewidth[opt.index];
-            } else if (typeof prop.lineLinewidth === 'number') {
-                linewidth = prop.lineLinewidth;
-            } else {
-                linewidth = 1;
-            }
-
-
-
-
-
-
-            // Determine the color
-             if (typeof prop.lineColors === 'object' && prop.lineColors[opt.index]) {
-                color = prop.lineColors[opt.index];
-             } else if (prop.colors[opt.index] === 'string') {
-                color = prop.colors[opt.index];
-            } else {
-                color = 'black';
-            }
-
-
-
-
-
-            for (var i=0,path=''; i<this.coords[opt.index].length; ++i) {
-                path += '{1} {2} {3} '.format(
-                    i === 0 ? 'M' : 'L',
-                    this.coords[opt.index][i][0],
-                    this.coords[opt.index][i][1]
-                );
-            }
-            
-            RG.SVG.create({
-                svg: this.svg,
-                type: 'path',
-                parent: this.svg.all,
-                attr: {
-                    d: path,
-                    fill: 'transparent',
-                    stroke: color,
-                    'stroke-width': linewidth,
-                    'stroke-linecap': 'round',
-                    'stroke-linejoin': 'round'
-                }
-            });
-        };
-
-
-
-
-
-
-
-
-        /**
-        * This function can be used to retrieve the relevant X coordinate for a
-        * particular value.
-        * 
-        * @param int value The value to get the X coordinate for
-        */
-        this.getXCoord = function (value)
-        {
-            var x;
-
-            if (value > prop.xaxisMax) {
-                return null;
-            }
-
-            if (value < prop.xaxisMin) {
-                return null;
-            }
-
-            x  = ((value - prop.xaxisMin) / (prop.xaxisMax - prop.xaxisMin));
-            x *= (this.width - prop.gutterLeft - prop.gutterRight);
-
-            x = prop.gutterLeft + x;
-
-            return x;
-        };
-
-
-
-
-
-
-
-
-        /**
-        * This function can be used to retrieve the relevant Y coordinate for a
-        * particular value.
-        * 
-        * @param int value The value to get the Y coordinate for
-        */
-        this.getYCoord = function (value)
-        {
-            var prop = this.properties;
-
-            if (value > this.scale.max) {
-                return null;
-            }
-
-            var y, xaxispos = prop.xaxispos;
-
-            if (value < this.scale.min) {
-                return null;
-            }
-
-            y  = ((value - this.scale.min) / (this.scale.max - this.scale.min));
-            y *= (this.height - prop.gutterTop - prop.gutterBottom);
-
-            y = this.height - prop.gutterBottom - y;
-
-            return y;
-        };
-
-
-
-
-
-
-
-
-        /**
-        * This function can be used to highlight a bar on the chart
-        * 
-        * @param object rect The rectangle to highlight
-        */
-        this.highlight = function (rect)
-        {
-            rect.setAttribute('fill', prop.highlightFill);
-
-            // Store the highlight rect in the registry so
-            // it can be reset later
-            RG.SVG.REG.set('highlight', rect);
-        };
-
-
-
-
-
-
-
-
-        /**
-        * This allows for easy specification of gradients
-        */
-        this.parseColors = function () 
-        {
-
-// TODO Loop thru the data parsing the color for gradients too
-
-            // Save the original colors so that they can be restored when
-            // the canvas is cleared
-            if (!Object.keys(this.originalColors).length) {
-                this.originalColors = {
-                    colors:              RG.SVG.arrayClone(prop.colors),
-                    backgroundGridColor: RG.SVG.arrayClone(prop.backgroundGridColor),
-                    highlightFill:       RG.SVG.arrayClone(prop.highlightFill),
-                    backgroundColor:     RG.SVG.arrayClone(prop.backgroundColor)
-                }
-            }
-
-            
-            // colors
-            var colors = prop.colors;
-
-            // IMPORTANT: Bubble chart gradients are parse in the drawBubble()
-            //            function below
-            if (colors && !prop.bubble) {
-                for (var i=0; i<colors.length; ++i) {
-                    colors[i] = RG.SVG.parseColorLinear({
-                        object: this,
-                        color: colors[i]
-                    });
-                }
-            }
-
-            prop.backgroundGridColor = RG.SVG.parseColorLinear({object: this, color: prop.backgroundGridColor});
-            prop.highlightFill       = RG.SVG.parseColorLinear({object: this, color: prop.highlightFill});
-            prop.backgroundColor     = RG.SVG.parseColorLinear({object: this, color: prop.backgroundColor});
-        };
-
-
-
-
-
-
-
-
-        /**
-        * Using a function to add events makes it easier to facilitate method
-        * chaining
-        * 
-        * @param string   type The type of even to add
-        * @param function func 
-        */
-        this.on = function (type, func)
-        {
-            if (type.substr(0,2) !== 'on') {
-                type = 'on' + type;
-            }
-            
-            RG.SVG.addCustomEventListener(this, type, func);
-    
-            return this;
-        };
-
-
-
-
-
-
-
-
-        //
-        // Used in chaining. Runs a function there and then - not waiting for
-        // the events to fire (eg the onbeforedraw event)
-        // 
-        // @param function func The function to execute
-        //
-        this.exec = function (func)
-        {
-            func(this);
-            
-            return this;
-        };
-
-
-
-
-
-
-
-
-        //
-        // Remove highlight from the chart (tooltips)
-        //
-        this.removeHighlight = function ()
-        {
-            var highlight = RG.SVG.REG.get('highlight');
-            
-            if (highlight) {
-                highlight.setAttribute('fill', 'transparent');
-                RG.SVG.REG.set('highlight', null);
-            }
-        };
-
-    };
-            
-    return this;
-
-// End module pattern
-})(window, document);
+RGraph=window.RGraph||{isRGraph:true};RGraph.SVG=RGraph.SVG||{};(function(win,doc,undefined)
+{var RG=RGraph,ua=navigator.userAgent,ma=Math,win=window,doc=document;RG.SVG.Scatter=function(conf)
+{this.set=function(name,value)
+{if(arguments.length===1&&typeof name==='object'){for(i in arguments[0]){if(typeof i==='string'){var ret=RG.SVG.commonSetter({object:this,name:i,value:arguments[0][i]});name=ret.name;value=ret.value;this.set(name,value);}}}else{var ret=RG.SVG.commonSetter({object:this,name:name,value:value});name=ret.name;value=ret.value;this.properties[name]=value;if(name==='colors'){this.originalColors=RG.SVG.arrayClone(value);this.colorsParsed=false;}}
+return this;};this.id=conf.id;this.uid=RG.SVG.createUID();this.container=document.getElementById(this.id);this.layers={};this.svg=RG.SVG.createSVG({object:this,container:this.container});this.isRGraph=true;this.width=Number(this.svg.getAttribute('width'));this.height=Number(this.svg.getAttribute('height'));this.data=conf.data;this.type='scatter';this.coords=[];this.colorsParsed=false;this.originalColors={};this.gradientCounter=1;this.sequential=0;RG.SVG.OR.add(this);this.container.style.display='inline-block';this.properties={gutterLeft:35,gutterRight:35,gutterTop:35,gutterBottom:35,backgroundColor:null,backgroundImage:null,backgroundImageAspect:'none',backgroundImageStretch:true,backgroundImageOpacity:null,backgroundImageX:null,backgroundImageY:null,backgroundImageW:null,backgroundImageH:null,backgroundGrid:true,backgroundGridColor:'#ddd',backgroundGridLinewidth:1,backgroundGridHlines:true,backgroundGridHlinesCount:null,backgroundGridVlines:true,backgroundGridVlinesCount:null,backgroundGridBorder:true,backgroundGridDashed:false,backgroundGridDotted:false,backgroundGridDashArray:null,xmax:0,tickmarksStyle:'cross',tickmarksSize:7,colors:['black'],line:false,lineColors:1,lineLinewidth:'black',yaxis:true,yaxisTickmarks:true,yaxisTickmarksLength:3,yaxisColor:'black',yaxisScale:true,yaxisLabels:null,yaxisLabelsOffsetx:0,yaxisLabelsOffsety:0,yaxisLabelsCount:5,yaxisUnitsPre:'',yaxisUnitsPost:'',yaxisStrict:false,yaxisDecimals:0,yaxisPoint:'.',yaxisThousand:',',yaxisRound:false,yaxisMax:null,yaxisMin:0,yaxisFormatter:null,xaxis:true,xaxisTickmarks:true,xaxisTickmarksLength:5,xaxisLabels:null,xaxisLabelsPosition:'section',xaxisLabelsPositionEdgeTickmarksCount:null,xaxisColor:'black',xaxisLabelsOffsetx:0,xaxisLabelsOffsety:0,xaxisMin:0,xaxisMax:null,textColor:'black',textFont:'sans-serif',textSize:12,textBold:false,textItalic:false,labelsAboveFont:null,labelsAboveSize:null,labelsAboveBold:null,labelsAboveItalic:null,labelsAboveColor:null,labelsAboveBackground:'rgba(255,255,255,0.7)',labelsAboveBackgroundPadding:2,labelsAboveXUnitsPre:null,labelsAboveXUnitsPost:null,labelsAboveXPoint:null,labelsAboveXThousand:null,labelsAboveXFormatter:null,labelsAboveXDecimals:null,labelsAboveXDecimalsTrim:null,labelsAboveYUnitsPre:null,labelsAboveYUnitsPost:null,labelsAboveYPoint:null,labelsAboveYThousand:null,labelsAboveYFormatter:null,labelsAboveYDecimals:null,labelsAboveOffsetx:0,labelsAboveOffsety:-10,labelsAboveHalign:'center',labelsAboveValign:'bottom',labelsAboveSeperator:',',tooltipsOverride:null,tooltipsEffect:'fade',tooltipsCssClass:'RGraph_tooltip',tooltipsEvent:'mousemove',highlightStroke:'rgba(0,0,0,0)',highlightFill:'rgba(255,255,255,0.7)',highlightLinewidth:1,title:'',titleSize:16,titleX:null,titleY:null,titleHalign:'center',titleValign:null,titleColor:'black',titleFont:null,titleBold:false,titleItalic:false,titleSubtitle:'',titleSubtitleSize:10,titleSubtitleX:null,titleSubtitleY:null,titleSubtitleHalign:'center',titleSubtitleValign:null,titleSubtitleColor:'#aaa',titleSubtitleFont:null,titleSubtitleBold:false,titleSubtitleItalic:false,key:null,keyColors:null,keyOffsetx:0,keyOffsety:0,keyTextOffsetx:0,keyTextOffsety:-1,keyTextSize:null,keyTextBold:null,keyTextItalic:null};RG.SVG.getGlobals(this);for(i in conf.options){if(typeof i==='string'){this.set(i,conf.options[i]);}}
+if(this.data[0]&&!RG.SVG.isArray(this.data[0])){this.data=[];this.data[0]=conf.data;}
+if(RG.SVG.FX&&typeof RG.SVG.FX.decorate==='function'){RG.SVG.FX.decorate(this);}
+var prop=this.properties;if(typeof prop.xaxisMin==='string'){prop.xaxisMin=RG.SVG.parseDate(prop.xaxisMin);}
+if(typeof prop.xaxisMax==='string'){prop.xaxisMax=RG.SVG.parseDate(prop.xaxisMax);}
+for(var i=0;i<this.data.length;++i){for(var j=0;j<this.data[i].length;++j){if(typeof this.data[i][j].x==='string'){this.data[i][j].x=RG.SVG.parseDate(this.data[i][j].x);}}}
+this.draw=function()
+{RG.SVG.fireCustomEvent(this,'onbeforedraw');RG.SVG.createDefs(this);this.graphWidth=this.width-prop.gutterLeft-prop.gutterRight;this.graphHeight=this.height-prop.gutterTop-prop.gutterBottom;RG.SVG.resetColorsToOriginalValues({object:this});this.parseColors();for(var ds=0,max=0;ds<this.data.length;++ds){for(var dp=0;dp<this.data[ds].length;++dp){max=ma.max(max,this.data[ds][dp].y);}}
+if(typeof prop.yaxisMax==='number'){max=prop.yaxisMax;}
+if(prop.yaxisMin==='mirror'||prop.yaxisMin==='middle'||prop.yaxisMin==='center'){var mirrorScale=true;prop.yaxisMin=0;}
+this.scale=RG.SVG.getScale({object:this,numlabels:prop.yaxisLabelsCount,unitsPre:prop.yaxisUnitsPre,unitsPost:prop.yaxisUnitsPost,max:max,min:prop.yaxisMin,point:prop.yaxisPoint,round:prop.yaxisRound,thousand:prop.yaxisThousand,decimals:prop.yaxisDecimals,strict:typeof prop.yaxisMax==='number',formatter:prop.yaxisFormatter});if(mirrorScale){this.scale=RG.SVG.getScale({object:this,numlabels:prop.yaxisLabelsCount,unitsPre:prop.yaxisUnitsPre,unitsPost:prop.yaxisUnitsPost,max:this.scale.max,min:this.scale.max* -1,point:prop.yaxisPoint,round:false,thousand:prop.yaxisThousand,decimals:prop.yaxisDecimals,strict:typeof prop.yaxisMax==='number',formatter:prop.yaxisFormatter});}
+this.max=this.scale.max;this.min=this.scale.min;prop.yaxisMax=this.scale.max;prop.yaxisMin=this.scale.min;RG.SVG.drawBackground(this);RG.SVG.drawXAxis(this);RG.SVG.drawYAxis(this);var dataset_group=RGraph.SVG.create({svg:this.svg,type:'g',parent:this.svg.all,attr:{className:'scatter_datasets_'+this.uid}});for(var i=0;i<this.data.length;++i){this.drawPoints({index:i,data:this.data[i],group:dataset_group});if(prop.line==true||(typeof prop.line==='object'&&prop.line[i]==true)){this.drawLine({index:i,coords:this.coords[i]});}}
+if(typeof prop.key!==null&&RG.SVG.drawKey){RG.SVG.drawKey(this);}else if(!RGraph.SVG.isNull(prop.key)){alert('The drawKey() function does not exist - have you forgotten to include the key library?');}
+RG.SVG.fireCustomEvent(this,'ondraw');return this;};this.drawPoints=function(opt)
+{var index=opt.index,data=opt.data,group=opt.group;this.coords[index]=[];var group=RG.SVG.create({svg:this.svg,type:'g',parent:group,attr:{className:'scatter_dataset_'+index+'_'+this.uid}});for(var i=0;i<data.length;++i){var point=data[i];if(typeof point.x==='number'&&typeof point.y==='number'){var ret=this.drawSinglePoint({dataset:data,datasetIdx:index,point:point,index:i,group:group,sequential:this.sequential++});this.coords[index][i]=[ret.x,ret.y];}
+if((typeof data[i].tooltip==='string'&&data[i].tooltip)||(typeof data[i].tooltip==='number')){data[i].tooltip=String(data[i].tooltip);if(prop.tooltipsEvent!=='mousemove'){prop.tooltipsEvent='click';}
+if(!group_tooltip_hotspots){var group_tooltip_hotspots=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'g',attr:{className:'rgraph-scatter-tooltip-hotspots'}});}
+var rect=RG.SVG.create({svg:this.svg,parent:this.svg.all,type:'rect',parent:group_tooltip_hotspots,attr:{x:ret.x-(ret.size/2),y:ret.y-(ret.size/2),width:ret.size,height:ret.size,fill:'transparent',stroke:'transparent','stroke-width':0},style:{cursor:'pointer'}});ret.mark.hotspot=rect;(function(dataset,index,seq,obj)
+{rect.addEventListener(prop.tooltipsEvent,function(e)
+{var tooltip=RG.SVG.REG.get('tooltip');if(tooltip&&tooltip.__dataset__===dataset&&tooltip.__index__===index){return;}
+obj.removeHighlight();RG.SVG.tooltip({object:obj,dataset:dataset,index:index,sequentialIndex:seq,text:obj.data[dataset][index].tooltip,event:e});if(RG.SVG.REG.get('tooltip')){obj.highlight(this);}},false);if(prop.tooltipsEvent==='click'){rect.addEventListener('mousemove',function(e)
+{e.target.style.cursor='pointer';},false);}}(index,i,this.sequential-1,this));}}};this.drawSinglePoint=function(opt)
+{var dataset=opt.dataset,datasetIdx=opt.datasetIdx,seq=opt.sequential,point=opt.point,index=opt.index,valueX=opt.point.x,valueY=opt.point.y,conf=opt.point||{},group=opt.group,coordX=opt.coordx=this.getXCoord(valueX),coordY=opt.coordy=this.getYCoord(valueY);if(conf.labelsAbove){var above=true;}else if(conf.labelAbove){var above=true;}else if(conf.above){var above=true;}
+if(typeof conf.type==='undefined'&&typeof conf.shape!=='undefined'){conf.type=conf.shape;}
+if(typeof conf.type==='string'){}else if(typeof prop.tickmarksStyle==='string'){conf.type=prop.tickmarksStyle;}else if(typeof prop.tickmarksStyle==='object'&&typeof prop.tickmarksStyle[datasetIdx]==='string'){conf.type=prop.tickmarksStyle[datasetIdx];}
+if(typeof conf.size!=='number'&&typeof prop.tickmarksSize==='number'){conf.size=prop.tickmarksSize;}else if(typeof conf.size!=='number'&&typeof prop.tickmarksSize==='object'&&typeof prop.tickmarksSize[datasetIdx]==='number'){conf.size=prop.tickmarksSize[datasetIdx];}
+if(typeof conf.color==='string'){}else if(typeof prop.colors[datasetIdx]==='string'){conf.color=prop.colors[datasetIdx];}else{conf.color='black';}
+if(typeof conf.opacity==='undefined'){conf.opacity=1;}else if(typeof conf.opacity==='number'){}
+if(prop.bubble){return this.drawBubble(opt,conf);}
+switch(conf.type){case'image:'+conf.type.substr(6):var src=conf.type.substr(6);var img=new Image();img.src=src;var mark=RG.SVG.create({svg:this.svg,type:'image',parent:group,attr:{preserveAspectRatio:'xMidYMid meet','xlink:href':src}});img.onload=function()
+{var x=coordX-(img.width/2),y=coordY-(img.height/2),w=img.width,h=img.height;mark.setAttribute('x',x);mark.setAttribute('y',y);mark.setAttribute('width',w);mark.setAttribute('height',h);if(mark&&mark.hotspot){mark.hotspot.setAttribute('x',x);mark.hotspot.setAttribute('y',y);mark.hotspot.setAttribute('width',w);mark.hotspot.setAttribute('height',h);}};break;case'triangle':var mark=RG.SVG.create({svg:this.svg,type:'path',parent:group,attr:{d:'M {1} {2} L {3} {4} L {5} {6}'.format(coordX-(conf.size/2),coordY+(conf.size/2),coordX,coordY-(conf.size/2),coordX+(conf.size/2),coordY+(conf.size/2)),fill:conf.color,'fill-opacity':conf.opacity}});break;case'plus':var mark=RG.SVG.create({svg:this.svg,type:'path',parent:group,attr:{d:'M {1} {2} L {3} {4} M {5} {6} L {7} {8}'.format(coordX-(conf.size/2),coordY,coordX+(conf.size/2),coordY,coordX,coordY-(conf.size/2),coordX,coordY+(conf.size/2)),stroke:conf.color,'stroke-opacity':conf.opacity}});break;case'square':case'rect':var mark=RG.SVG.create({svg:this.svg,type:'rect',parent:group,attr:{x:coordX-(conf.size/2),y:coordY-(conf.size/2),width:conf.size,height:conf.size,fill:conf.color,'fill-opacity':conf.opacity}});break;case'dot':case'circle':var mark=RG.SVG.create({svg:this.svg,type:'circle',parent:group,attr:{cx:coordX,cy:coordY,r:conf.size/2,fill:conf.color,'fill-opacity':conf.opacity}});break;case'cross':default:var mark=RG.SVG.create({svg:this.svg,type:'path',parent:group,attr:{d:'M {1} {2} L {3} {4} M {5} {6} L {7} {8}'.format(coordX-(conf.size/2),coordY-(conf.size/2),coordX+(conf.size/2),coordY+(conf.size/2),coordX-(conf.size/2),coordY+(conf.size/2),coordX+(conf.size/2),coordY-(conf.size/2)),stroke:conf.color,'stroke-opacity':conf.opacity}});break;}
+if(typeof conf.above==='string'||(typeof conf.above!=='string'&&conf.above)){this.drawLabelsAbove({point:conf,coordX:coordX,coordY:coordY});}
+mark.setAttribute('data-index',index);mark.setAttribute('data-dataset',datasetIdx);mark.setAttribute('data-original-opacity',conf.opacity);mark.setAttribute('data-original-color',conf.color);mark.setAttribute('data-original-coordx',coordX);mark.setAttribute('data-original-coordy',coordY);mark.setAttribute('data-size',conf.size);mark.setAttribute('data-sequential',seq);mark.setAttribute('data-type',conf.type);return{x:coordX,y:coordY,size:conf.type.substr(0,6)==='image:'?img.width:conf.size,mark:mark,type:conf.type};};this.drawBubble=function(opt,conf)
+{var size=(conf.z/prop.bubbleMaxValue)*prop.bubbleMaxRadius;var color=RG.SVG.parseColorRadial({object:this,color:prop.bubbleColorsSolid?conf.color:'Gradient(white:'+conf.color+')',cx:opt.coordx+(size/4),cy:opt.coordy-(size/4),fx:opt.coordx+(size/4),fy:opt.coordy-(size/4),r:size*1.5});var circle=RG.SVG.create({svg:this.svg,type:'circle',attr:{cx:opt.coordx,cy:opt.coordy,r:size,fill:color,'fill-opacity':conf.opacity}});circle.setAttribute('data-index',opt.index);circle.setAttribute('data-dataset',opt.datasetIdx);circle.setAttribute('data-original-opacity',conf.opacity);circle.setAttribute('data-original-color',conf.color);circle.setAttribute('data-original-coordx',opt.coordx);circle.setAttribute('data-original-coordy',opt.coordy);circle.setAttribute('data-size',size);circle.setAttribute('data-sequential',opt.sequential);circle.setAttribute('data-type','bubble');return{x:opt.coordx,y:opt.coordy,z:opt.coordz};};this.drawLine=function(opt)
+{var linewidth=1,color='black';if(typeof prop.lineLinewidth==='object'&&typeof prop.lineLinewidth[opt.index]==='number'){linewidth=prop.lineLinewidth[opt.index];}else if(typeof prop.lineLinewidth==='number'){linewidth=prop.lineLinewidth;}else{linewidth=1;}
+if(typeof prop.lineColors==='object'&&prop.lineColors[opt.index]){color=prop.lineColors[opt.index];}else if(prop.colors[opt.index]==='string'){color=prop.colors[opt.index];}else{color='black';}
+for(var i=0,path='';i<this.coords[opt.index].length;++i){path+='{1} {2} {3} '.format(i===0?'M':'L',this.coords[opt.index][i][0],this.coords[opt.index][i][1]);}
+RG.SVG.create({svg:this.svg,type:'path',parent:this.svg.all,attr:{d:path,fill:'transparent',stroke:color,'stroke-width':linewidth,'stroke-linecap':'round','stroke-linejoin':'round'}});};this.getXCoord=function(value)
+{var x;if(value>prop.xaxisMax){return null;}
+if(value<prop.xaxisMin){return null;}
+x=((value-prop.xaxisMin)/(prop.xaxisMax-prop.xaxisMin));x*=(this.width-prop.gutterLeft-prop.gutterRight);x=prop.gutterLeft+x;return x;};this.getYCoord=function(value)
+{var prop=this.properties;if(value>this.scale.max){return null;}
+var y,xaxispos=prop.xaxispos;if(value<this.scale.min){return null;}
+y=((value-this.scale.min)/(this.scale.max-this.scale.min));y*=(this.height-prop.gutterTop-prop.gutterBottom);y=this.height-prop.gutterBottom-y;return y;};this.highlight=function(rect)
+{rect.setAttribute('fill',prop.highlightFill);RG.SVG.REG.set('highlight',rect);};this.drawLabelsAbove=function(opt)
+{var conf=opt.point,coordX=opt.coordX,coordY=opt.coordY;if(typeof conf.above==='string'){var str=conf.above;}else{conf.x=RG.SVG.numberFormat({object:this,num:conf.x.toFixed(prop.labelsAboveXDecimals),prepend:typeof prop.labelsAboveXUnitsPre==='string'?prop.labelsAboveXUnitsPre:null,append:typeof prop.labelsAboveXUnitsPost==='string'?prop.labelsAboveXUnitsPost:null,point:typeof prop.labelsAboveXPoint==='string'?prop.labelsAboveXPoint:null,thousand:typeof prop.labelsAboveXThousand==='string'?prop.labelsAboveXThousand:null,formatter:typeof prop.labelsAboveXFormatter==='function'?prop.labelsAboveXFormatter:null,decimals_trim:prop.labelsAboveXDecimalsTrim});conf.y=RG.SVG.numberFormat({object:this,num:conf.y.toFixed(prop.labelsAboveYDecimals),prepend:typeof prop.labelsAboveYUnitsPre==='string'?prop.labelsAboveYUnitsPre:null,append:typeof prop.labelsAboveYUnitsPost==='string'?prop.labelsAboveYUnitsPost:null,point:typeof prop.labelsAboveYPoint==='string'?prop.labelsAboveYPoint:null,thousand:typeof prop.labelsAboveYThousand==='string'?prop.labelsAboveYThousand:null,formatter:typeof prop.labelsAboveYFormatter==='function'?prop.labelsAboveYFormatter:null,decimals_trim:prop.labelsAboveYDecimalsTrim});var str='{1}{2}{3}'.format(conf.x,prop.labelsAboveSeperator,conf.y);}
+RG.SVG.text({object:this,parent:this.svg.all,text:str,x:parseFloat(coordX)+prop.labelsAboveOffsetx,y:parseFloat(coordY)+prop.labelsAboveOffsety,halign:prop.labelsAboveHalign,valign:prop.labelsAboveValign,font:prop.labelsAboveFont||prop.textFont,size:prop.labelsAboveSize||prop.textSize,bold:prop.labelsAboveBold||prop.textBold,italic:prop.labelsAboveItalic||prop.textItalic,color:prop.labelsAboveColor||prop.textColor,background:prop.labelsAboveBackground||null,padding:prop.labelsAboveBackgroundPadding||0});};this.parseColors=function()
+{if(!Object.keys(this.originalColors).length){this.originalColors={colors:RG.SVG.arrayClone(prop.colors),backgroundGridColor:RG.SVG.arrayClone(prop.backgroundGridColor),highlightFill:RG.SVG.arrayClone(prop.highlightFill),backgroundColor:RG.SVG.arrayClone(prop.backgroundColor)}}
+var colors=prop.colors;if(colors&&!prop.bubble){for(var i=0;i<colors.length;++i){colors[i]=RG.SVG.parseColorLinear({object:this,color:colors[i]});}}
+prop.backgroundGridColor=RG.SVG.parseColorLinear({object:this,color:prop.backgroundGridColor});prop.highlightFill=RG.SVG.parseColorLinear({object:this,color:prop.highlightFill});prop.backgroundColor=RG.SVG.parseColorLinear({object:this,color:prop.backgroundColor});};this.on=function(type,func)
+{if(type.substr(0,2)!=='on'){type='on'+type;}
+RG.SVG.addCustomEventListener(this,type,func);return this;};this.exec=function(func)
+{func(this);return this;};this.removeHighlight=function()
+{var highlight=RG.SVG.REG.get('highlight');if(highlight){highlight.setAttribute('fill','transparent');RG.SVG.REG.set('highlight',null);}};};return this;})(window,document);