charts.js revision 45e9277d270441687d19fe67fae252c90cc5e092
/**
* The Charts widget provides an api for displaying data
* graphically.
*
* @module charts
* @main charts
*/
/**
* The Renderer class is a base class for chart components that use the `styles`
* attribute.
*
* @module charts
* @class Renderer
* @constructor
*/
function Renderer(){}
/**
* Style properties for class
*
* @attribute styles
* @type Object
*/
{
getter: function()
{
return this._styles;
},
{
}
},
/**
* The graphic in which drawings will be rendered.
*
* @attribute graphic
* @type Graphic
*/
graphic: {}
};
/**
* Storage for `styles` attribute.
*
* @property _styles
* @type Object
* @private
*/
_styles: null,
/**
* Method used by `styles` setter.
*
* @method _setStyles
* @param {Object} newStyles Hash of properties to update.
* @return Object
* @protected
*/
_setStyles: function(newstyles)
{
},
/**
* Merges to object literals so that only specified properties are
* overwritten.
*
* @method _mergeStyles
* @param {Object} a Hash of new styles
* @param {Object} b Hash of original styles
* @return Object
* @protected
*/
_mergeStyles: function(a, b)
{
if(!b)
{
b = {};
}
{
{
}
else
{
}
}, this);
return newstyles;
},
/**
* Gets the default value for the `styles` attribute.
*
* @method _getDefaultStyles
* @return Object
* @protected
*/
_getDefaultStyles: function()
{
return {padding:{
top:0,
right: 0,
bottom: 0,
left: 0
}};
}
};
/**
* Algorithmic strategy for rendering a left axis.
*
* @module charts
* @class LeftAxisLayout
* @constructor
*/
LeftAxisLayout = function() {};
/**
* Default margins for text fields.
*
* @private
* @method _getDefaultMargins
* @return Object
*/
_getDefaultMargins: function()
{
return {
top: 0,
left: 0,
right: 4,
bottom: 0
};
},
/**
* Sets the length of the tick on either side of the axis line.
*
* @method setTickOffset
* @protected
*/
setTickOffsets: function()
{
var host = this,
switch(display)
{
case "inside" :
break;
case "outside" :
break;
case "cross":
break;
default:
break;
}
},
/**
* Draws a tick
*
* @method drawTick
* @param {Path} path reference to the path `Path` element in which to draw the tick.
* @param {Object} pt Point on the axis in which the tick will intersect.
* @param {Object} tickStyle Hash of properties to apply to the tick.
* @protected
*/
{
var host = this,
},
/**
* Calculates the coordinates for the first point on an axis.
*
* @method getLineStart
* @return {Object}
* @protected
*/
getLineStart: function()
{
if(display === "outside")
{
pt.x += tickLength;
}
else if(display === "cross")
{
}
return pt;
},
/**
* Calculates the point for a label.
*
* @method getLabelPoint
* @param {Object} point Point on the axis in which the tick will intersect.
* @return {Object}
* @protected
*/
getLabelPoint: function(point)
{
},
/**
* Updates the value for the `maxLabelSize` for use in calculating total size.
*
* @method updateMaxLabelSize
* @param {HTMLElement} label to measure
* @protected
*/
updateMaxLabelSize: function(label)
{
var host = this,
props = this._labelRotationProps,
max;
if(!DOCUMENT.createElementNS)
{
label.style.filter = 'progid:DXImageTransform.Microsoft.Matrix(M11=' + m11 + ' M12=' + m12 + ' M21=' + m21 + ' M22=' + m22 + ' sizingMethod="auto expand")';
}
else
{
if(rot === 0)
{
}
else if(absRot === 90)
{
}
else
{
}
}
},
/**
* Rotate and position title.
*
* @method positionTitle
* @param {HTMLElement} label to rotate position
* @protected
*/
positionTitle: function(label)
{
var host = this,
max,
x = 0,
leftOffset = 0,
topOffset = 0,
{
if(rot === 0)
{
max = labelWidth;
}
else if(absRot === 90)
{
max = labelHeight;
if(rot === 90)
{
}
else
{
}
}
else
{
if(rot > 0)
{
}
else
{
}
}
y += topOffset;
x += leftOffset;
}
else
{
if(rot === 0)
{
max = labelWidth;
}
else if(rot === 90)
{
max = labelHeight;
}
else if(rot === -90)
{
max = labelHeight;
}
else
{
}
y += topOffset;
x += leftOffset;
}
this._titleSize = max;
},
/**
* Rotate and position labels.
*
* @method positionLabel
* @param {HTMLElement} label to rotate position
* @param {Object} pt hash containing the x and y coordinates in which the label will be positioned
* against.
* @protected
*/
{
var host = this,
margin = 0,
props = this._labelRotationProps,
{
}
if(!DOCUMENT.createElementNS)
{
if(rot === 0)
{
}
else if(absRot === 90)
{
}
else if(rot > 0)
{
}
else
{
}
leftOffset += tickOffset;
return;
}
if(rot === 0)
{
leftOffset -= labelWidth;
}
else if(rot === 90)
{
}
else if(rot === -90)
{
}
else
{
if(rot < 0)
{
}
else
{
}
}
leftOffset -= margin;
},
/**
* Calculates the size and positions the content elements.
*
* @method setSizeAndPosition
* @protected
*/
setSizeAndPosition: function()
{
var host = this,
{
}
sz += this._titleSize;
},
/**
* Adjust the position of the Axis widget's content box for internal axes.
*
* @method offsetNodeForTick
* @param {Node} cb Content box of the Axis.
* @protected
*/
offsetNodeForTick: function(cb)
{
},
/**
* Sets the width of the axis based on its contents.
*
* @method setCalculatedSize
* @protected
*/
setCalculatedSize: function()
{
var host = this,
}
};
/**
* RightAxisLayout contains algorithms for rendering a right axis.
*
* @module charts
* @class RightAxisLayout
* @constructor
*/
RightAxisLayout = function(){};
/**
* Default margins for text fields.
*
* @private
* @method _getDefaultMargins
* @return Object
*/
_getDefaultMargins: function()
{
return {
top: 0,
left: 4,
right: 0,
bottom: 0
};
},
/**
* Sets the length of the tick on either side of the axis line.
*
* @method setTickOffset
* @protected
*/
setTickOffsets: function()
{
var host = this,
switch(display)
{
case "inside" :
break;
case "outside" :
break;
case "cross" :
break;
default:
break;
}
},
/**
* Draws a tick
*
* @method drawTick
* @param {Path} path reference to the path `Path` element in which to draw the tick.
* @param {Object} pt Point on the axis in which the tick will intersect.
* @param {Object) tickStyle Hash of properties to apply to the tick.
* @protected
*/
{
var host = this,
},
/**
* Calculates the coordinates for the first point on an axis.
*
* @method getLineStart
* @return {Object}
* @protected
*/
getLineStart: function()
{
var host = this,
if(display === "inside")
{
pt.x += tickLength;
}
else if(display === "cross")
{
}
return pt;
},
/**
* Calculates the point for a label.
*
* @method getLabelPoint
* @param {Object} point Point on the axis in which the tick will intersect.
* @return {Object}
* @protected
*/
getLabelPoint: function(point)
{
},
/**
* Updates the value for the `maxLabelSize` for use in calculating total size.
*
* @method updateMaxLabelSize
* @param {HTMLElement} label to measure
* @protected
*/
updateMaxLabelSize: function(label)
{
var host = this,
props = this._labelRotationProps,
max;
if(!DOCUMENT.createElementNS)
{
label.style.filter = 'progid:DXImageTransform.Microsoft.Matrix(M11=' + m11 + ' M12=' + m12 + ' M21=' + m21 + ' M22=' + m22 + ' sizingMethod="auto expand")';
}
else
{
if(rot === 0)
{
}
else if(absRot === 90)
{
}
else
{
}
}
},
/**
* Rotate and position title.
*
* @method positionTitle
* @param {HTMLElement} label to rotate position
* @protected
*/
positionTitle: function(label)
{
var host = this,
max,
x = 0,
leftOffset = this.get("maxLabelSize") + margin.left + this.get("rightTickOffset") + this.get("styles").label.margin.left,
topOffset = 0,
{
if(rot === 0)
{
max = labelWidth;
}
else if(absRot === 90)
{
max = labelHeight;
if(rot === 90)
{
}
else
{
}
}
else
{
if(rot > 0)
{
}
else
{
}
}
y += topOffset;
x += leftOffset;
}
else
{
if(rot === 0)
{
max = labelWidth;
}
else if(rot === 90)
{
max = labelHeight;
}
else if(rot === -90)
{
max = labelHeight;
}
else
{
}
y += topOffset;
x += leftOffset;
}
this._titleSize = max;
},
/**
* Rotate and position labels.
*
* @method positionLabel
* @param {HTMLElement} label to rotate position
* @param {Object} pt hash containing the x and y coordinates in which the label will be positioned
* against.
* @protected
*/
{
var host = this,
margin = 0,
leftOffset = pt.x,
props = this._labelRotationProps,
{
}
if(!DOCUMENT.createElementNS)
{
if(rot === 0)
{
}
else if(absRot === 90)
{
}
else if(rot > 0)
{
}
else
{
}
leftOffset += margin;
leftOffset += tickOffset;
return;
}
if(rot === 0)
{
}
else if(rot === 90)
{
}
else if(rot === -90)
{
}
else if(rot < 0)
{
}
else
{
}
leftOffset += margin;
leftOffset += tickOffset;
},
/**
* Calculates the size and positions the content elements.
*
* @method setSizeAndPosition
* @protected
*/
setSizeAndPosition: function()
{
var host = this,
{
}
sz += this._titleSize;
},
/**
* Adjusts position for inner ticks.
*
* @method offsetNodeForTick
* @param {Node} cb contentBox of the axis
* @protected
*/
offsetNodeForTick: function(cb)
{
var host = this,
},
/**
* Assigns a height based on the size of the contents.
*
* @method setCalculatedSize
* @protected
*/
setCalculatedSize: function()
{
var host = this,
ttl = Math.round(host.get("rightTickOffset") + host.get("maxLabelSize") + this._titleSize + host.get("styles").title.margin.left + style.margin.left);
}
};
/**
* Contains algorithms for rendering a bottom axis.
*
* @module charts
* @class BottomAxisLayout
* @Constructor
*/
BottomAxisLayout = function(){};
/**
* Default margins for text fields.
*
* @private
* @method _getDefaultMargins
* @return Object
*/
_getDefaultMargins: function()
{
return {
top: 4,
left: 0,
right: 0,
bottom: 0
};
},
/**
* Sets the length of the tick on either side of the axis line.
*
* @method setTickOffsets
* @protected
*/
setTickOffsets: function()
{
var host = this,
switch(display)
{
case "inside" :
break;
case "outside" :
break;
case "cross":
break;
default:
break;
}
},
/**
* Calculates the coordinates for the first point on an axis.
*
* @method getLineStart
* @protected
*/
getLineStart: function()
{
if(display === "inside")
{
pt.y += tickLength;
}
else if(display === "cross")
{
}
return pt;
},
/**
* Draws a tick
*
* @method drawTick
* @param {Path} path reference to the path `Path` element in which to draw the tick.
* @param {Object} pt hash containing x and y coordinates
* @param {Object} tickStyles hash of properties used to draw the tick
* @protected
*/
{
var host = this,
},
/**
* Calculates the point for a label.
*
* @method getLabelPoint
* @param {Object} pt Object containing x and y coordinates
* @return Object
* @protected
*/
getLabelPoint: function(point)
{
},
/**
* Updates the value for the `maxLabelSize` for use in calculating total size.
*
* @method updateMaxLabelSize
* @param {HTMLElement} label to measure
* @protected
*/
updateMaxLabelSize: function(label)
{
var host = this,
props = this._labelRotationProps,
max;
if(!DOCUMENT.createElementNS)
{
label.style.filter = 'progid:DXImageTransform.Microsoft.Matrix(M11=' + m11 + ' M12=' + m12 + ' M21=' + m21 + ' M22=' + m22 + ' sizingMethod="auto expand")';
}
else
{
if(rot === 0)
{
}
else if(absRot === 90)
{
}
else
{
}
}
},
/**
* Rotate and position title.
*
* @method positionTitle
* @param {HTMLElement} label to rotate position
* @protected
*/
positionTitle: function(label)
{
var host = this,
max,
y = this.get("maxLabelSize") + this.get("styles").label.margin.top + styles.margin.top + this.get("bottomTickOffset"),
leftOffset = 0,
topOffset = 0,
{
if(rot === 0)
{
max = labelHeight;
}
else if(absRot === 90)
{
max = labelWidth;
if(rot === -90)
{
topOffset += labelWidth;
}
}
else
{
if(rot > 0)
{
}
else
{
}
}
x += leftOffset;
y += topOffset;
}
else
{
if(rot === 0)
{
max = labelHeight;
}
else if(rot === 90)
{
max = labelWidth;
}
else if(rot === -90)
{
max = labelWidth;
}
else
{
}
x += leftOffset;
y += topOffset;
}
this._titleSize = max;
},
/**
* Rotate and position labels.
*
* @method positionLabel
* @param {HTMLElement} label to rotate position
* @param {Object} pt hash containing the x and y coordinates in which the label will be positioned
* against.
* @protected
*/
{
var host = this,
margin = 0,
props = this._labelRotationProps,
{
}
if(!DOCUMENT.createElementNS)
{
if(absRot === 90)
{
}
else if(rot < 0)
{
}
else if(rot > 0)
{
}
else
{
}
topOffset += tickOffset;
return;
}
if(rot === 0)
{
}
else if(absRot === 90)
{
if(rot === 90)
{
}
else
{
topOffset += labelWidth;
}
}
else
{
if(rot < 0)
{
}
else
{
}
}
topOffset += tickOffset;
props.x = leftOffset;
},
/**
* Calculates the size and positions the content elements.
*
* @method setSizeAndPosition
* @protected
*/
setSizeAndPosition: function()
{
var host = this,
{
}
},
/**
* Adjusts position for inner ticks.
*
* @method offsetNodeForTick
* @param {Node} cb contentBox of the axis
* @protected
*/
offsetNodeForTick: function(cb)
{
var host = this;
},
/**
* Assigns a height based on the size of the contents.
*
* @method setCalculatedSize
* @protected
*/
setCalculatedSize: function()
{
var host = this,
ttl = Math.round(host.get("bottomTickOffset") + host.get("maxLabelSize") + style.margin.top + this.get("styles").title.margin.top + this._titleSize);
}
};
/**
* Contains algorithms for rendering a top axis.
*
* @module charts
* @class TopAxisLayout
* @constructor
*/
TopAxisLayout = function(){};
/**
* Default margins for text fields.
*
* @private
* @method _getDefaultMargins
* @return Object
*/
_getDefaultMargins: function()
{
return {
top: 0,
left: 0,
right: 0,
bottom: 4
};
},
/**
* Sets the length of the tick on either side of the axis line.
*
* @method setTickOffsets
* @protected
*/
setTickOffsets: function()
{
var host = this,
switch(display)
{
case "inside" :
break;
case "outside" :
break;
case "cross" :
break;
default:
break;
}
},
/**
* Calculates the coordinates for the first point on an axis.
*
* @method getLineStart
* @protected
*/
getLineStart: function()
{
var host = this,
if(display === "outside")
{
pt.y += tickLength;
}
else if(display === "cross")
{
}
return pt;
},
/**
* Draws a tick
*
* @method drawTick
* @param {Path} path reference to the path `Path` element in which to draw the tick.
* @param {Object} pt hash containing x and y coordinates
* @param {Object} tickStyles hash of properties used to draw the tick
* @protected
*/
{
var host = this,
},
/**
* Calculates the point for a label.
*
* @method getLabelPoint
* @param {Object} pt hash containing x and y coordinates
* @return Object
* @protected
*/
getLabelPoint: function(pt)
{
},
/**
* Updates the value for the `maxLabelSize` for use in calculating total size.
*
* @method updateMaxLabelSize
* @param {HTMLElement} label to measure
* @protected
*/
updateMaxLabelSize: function(label)
{
var host = this,
props = this._labelRotationProps,
max;
if(!DOCUMENT.createElementNS)
{
label.style.filter = 'progid:DXImageTransform.Microsoft.Matrix(M11=' + m11 + ' M12=' + m12 + ' M21=' + m21 + ' M22=' + m22 + ' sizingMethod="auto expand")';
}
else
{
if(rot === 0)
{
}
else if(absRot === 90)
{
}
else
{
}
}
},
/**
* Rotate and position title.
*
* @method positionTitle
* @param {HTMLElement} label to rotate position
* @protected
*/
positionTitle: function(label)
{
var host = this,
max,
leftOffset = 0,
topOffset = 0,
{
if(rot === 0)
{
max = labelHeight;
}
else if(absRot === 90)
{
max = labelWidth;
if(rot === 90)
{
}
else
{
topOffset += labelWidth;
}
}
else
{
if(rot > 0)
{
}
else
{
}
}
x += leftOffset;
y += topOffset;
}
else
{
if(rot === 0)
{
max = labelHeight;
}
else if(rot === 90)
{
max = labelWidth;
}
else if(rot === -90)
{
max = labelWidth;
}
else
{
}
x += leftOffset;
y += topOffset;
}
this._titleSize = max;
},
/**
* Rotate and position labels.
*
* @method positionLabel
* @param {HTMLElement} label to rotate position
* @param {Object} pt hash containing the x and y coordinates in which the label will be positioned
* against.
* @protected
*/
{
var host = this,
totalTitleSize = this.get("title") ? this._titleSize + titleStyles.margin.top + titleStyles.margin.bottom : 0,
margin = 0,
leftOffset = pt.x,
props = this._labelRotationProps,
{
}
if(!DOCUMENT.createElementNS)
{
if(rot === 0)
{
}
else if(absRot === 90)
{
}
else if(rot > 0)
{
leftOffset -= (cosRadians * labelWidth) + Math.min((sinRadians * labelHeight), (rot/180 * labelHeight));
}
else
{
}
topOffset -= tickOffset;
return;
}
if(rot === 0)
{
topOffset -= labelHeight;
}
else if(rot === 90)
{
topOffset -= labelWidth;
}
else if(rot === -90)
{
topOffset -= 0;
}
else if(rot < 0)
{
}
else
{
}
},
/**
* Calculates the size and positions the content elements.
*
* @method setSizeAndPosition
* @protected
*/
setSizeAndPosition: function()
{
var host = this,
{
}
if(this.get("title"))
{
}
},
/**
* Adjusts position for inner ticks.
*
* @method offsetNodeForTick
* @param {Node} cb contentBox of the axis
* @protected
*/
offsetNodeForTick: function(cb)
{
},
/**
* Assigns a height based on the size of the contents.
*
* @method setCalculatedSize
* @protected
*/
setCalculatedSize: function()
{
var host = this,
}
};
/**
* The Axis class. Generates axes for a chart.
*
* @module charts
* @class Axis
* @extends Widget
* @uses Renderer
* @constructor
* @param {Object} config (optional) Configuration parameters for the Chart.
*/
/**
* Handles change to the dataProvider
*
* @method _dataChangeHandler
* @param {Object} e Event object
* @private
*/
_dataChangeHandler: function(e)
{
if(this.get("rendered"))
{
this._drawAxis();
}
},
/**
* Handles change to the position attribute
*
* @method _positionChangeHandler
* @param {Object} e Event object
* @private
*/
_positionChangeHandler: function(e)
{
this._updateGraphic(e.newVal);
this._updateHandler();
},
/**
* Updates the the Graphic instance
*
* @method _updateGraphic
* @param {String} position Position of axis
* @private
*/
_updateGraphic: function(position)
{
if(position == "none")
{
if(graphic)
{
}
}
else
{
if(!graphic)
{
this._setCanvas();
}
}
},
/**
* Handles changes to axis.
*
* @method _updateHandler
* @param {Object} e Event object
* @private
*/
_updateHandler: function(e)
{
if(this.get("rendered"))
{
this._drawAxis();
}
},
/**
* @method renderUI
* @private
*/
renderUI: function()
{
},
/**
* @method syncUI
* @private
*/
syncUI: function()
{
i;
if(layout)
{
//need to defaultMargins method to the layout classes.
for(i in defaultMargins)
{
if(defaultMargins.hasOwnProperty(i))
{
}
}
}
this._drawAxis();
},
/**
* Creates a graphic instance to be used for the axis line and ticks.
*
* @method _setCanvas
* @private
*/
_setCanvas: function()
{
p = this.get("position"),
pn = this._parentNode,
w = this.get("width"),
h = this.get("height");
if(p === "top" || p === "bottom")
{
}
else
{
}
},
/**
* Gets the default value for the `styles` attribute. Overrides
* base implementation.
*
* @method _getDefaultStyles
* @return Object
* @protected
*/
_getDefaultStyles: function()
{
var axisstyles = {
majorTicks: {
display:"inside",
length:4,
color:"#dad8c9",
weight:1,
alpha:1
},
minorTicks: {
display:"none",
length:2,
color:"#dad8c9",
weight:1
},
line: {
weight:1,
color:"#dad8c9",
alpha:1
},
majorUnit: {
determinant:"count",
count:11,
distance:75
},
top: "0px",
left: "0px",
width: "100px",
height: "100px",
label: {
color:"#808080",
alpha: 1,
fontSize:"85%",
rotation: 0,
margin: {
}
},
title: {
color:"#808080",
alpha: 1,
fontSize:"85%",
margin: {
}
},
hideOverlappingLabelTicks: false
};
},
/**
* Updates the axis when the size changes.
*
* @method _handleSizeChange
* @param {Object} e Event object.
* @private
*/
_handleSizeChange: function(e)
{
{
this._drawAxis();
}
},
/**
* Maps key values to classes containing layout algorithms
*
* @property _layoutClasses
* @type Object
* @private
*/
{
top : TopAxisLayout,
},
/**
* Draws a line segment between 2 points
*
* @method drawLine
* @param {Object} startPoint x and y coordinates for the start point of the line segment
* @param {Object} endPoint x and y coordinates for the for the end point of the line segment
* @param {Object} line styles (weight, color and alpha to be applied to the line segment)
* @private
*/
{
},
/**
* Generates the properties necessary for rotating and positioning a text field.
*
* @method _getTextRotationProps
* @param {Object} styles properties for the text field
* @return Object
* @private
*/
_getTextRotationProps: function(styles)
{
{
switch(this.get("position"))
{
case "left" :
break;
case "right" :
break;
default :
break;
}
}
m11 = cosRadians,
return {
};
},
/**
* Draws an axis.
*
* @method _drawAxis
* @private
*/
_drawAxis: function ()
{
if(this._drawing)
{
this._callLater = true;
return;
}
this._drawing = true;
this._callLater = false;
if(this._layout)
{
len,
i = 0,
});
layoutLength = this.getLength();
if(drawTicks)
{
});
}
if(len < 1)
{
this._clearLabelCache();
return;
}
this._createLabelCache();
this._tickPoints = [];
this._titleSize = 0;
for(; i < len; ++i)
{
if(drawTicks)
{
}
label.innerHTML = labelFunction.apply(labelFunctionScope, [this.getLabelByIndex(i, len), labelFormat]);
}
this._clearLabelCache();
this._updateTitle();
if(this.get("overlapGraph"))
{
}
for(i = 0; i < len; ++i)
{
}
}
this._drawing = false;
if(this._callLater)
{
this._drawAxis();
}
else
{
this._updatePathElement();
this.fire("axisRendered");
}
},
/**
* Updates path.
*
* @method _updatePathElement
* @private
*/
_updatePathElement: function()
{
redrawGraphic = false,
if(path)
{
redrawGraphic = true;
}
if(tickPath)
{
redrawGraphic = true;
}
if(redrawGraphic)
{
}
},
/**
* Updates the content and style properties for a title field.
*
* @method _updateTitle
* @private
*/
_updateTitle: function()
{
var i,
titleTextField = this._titleTextField,
{
customStyles = {
rotation: "rotation",
margin: "margin",
alpha: "alpha"
};
if(!titleTextField)
{
}
for(i in styles)
{
{
}
}
this._titleTextField = titleTextField;
}
else if(titleTextField)
{
if(parentNode)
{
}
this._titleTextField = null;
}
},
/**
* Creates or updates an axis label.
*
* @method getLabel
* @param {Object} pt x and y coordinates for the label
* @param {Object} styles styles applied to label
* @return HTMLElement
* @private
*/
{
var i,
customStyles = {
rotation: "rotation",
margin: "margin",
alpha: "alpha"
},
cache = this._labelCache;
{
}
else
{
}
for(i in styles)
{
{
}
}
return label;
},
/**
* Creates a cache of labels that can be re-used when the axis redraws.
*
* @method _createLabelCache
* @private
*/
_createLabelCache: function()
{
if(this._labels)
{
if(this._labelCache)
{
}
else
{
}
}
else
{
this._clearLabelCache();
}
this._labels = [];
},
/**
* Removes axis labels from the dom and clears the label cache.
*
* @method _clearLabelCache
* @private
*/
_clearLabelCache: function()
{
if(this._labelCache)
{
i = 0,
labelCache = this._labelCache;
for(; i < len; ++i)
{
label = labelCache[i];
}
}
this._labelCache = [];
},
/**
* Gets the end point of an axis.
*
* @method getLineEnd
* @return Object
* @private
*/
getLineEnd: function(pt)
{
var w = this.get("width"),
h = this.get("height"),
{
return {x:w, y:pt.y};
}
else
{
return {x:pt.x, y:h};
}
},
/**
* Calcuates the width or height of an axis depending on its direction.
*
* @method getLength
* @return Number
* @private
*/
getLength: function()
{
var l,
w = this.get("width"),
h = this.get("height"),
{
}
else
{
}
return l;
},
/**
* Gets the position of the first point on an axis.
*
* @method getFirstPoint
* @param {Object} pt Object containing x and y coordinates.
* @return Object
* @private
*/
getFirstPoint:function(pt)
{
{
}
else
{
}
return np;
},
/**
* Gets the position of the next point on an axis.
*
* @method getNextPoint
* @param {Object} point Object containing x and y coordinates.
* @param {Number} majorUnitDistance Distance in pixels between ticks.
* @return Object
* @private
*/
{
{
}
else
{
}
return point;
},
/**
* Calculates the placement of last tick on an axis.
*
* @method getLastPoint
* @return Object
* @private
*/
getLastPoint: function()
{
w = this.get("width"),
{
}
else
{
}
},
/**
* Calculates position on the axis.
*
* @method getPosition
* @param {Object} point contains x and y values
* @private
*/
getPosition: function(point)
{
var p,
h = this.get("height"),
{
//Numeric data on a vertical axis is displayed from bottom to top.
//Categorical and Timeline data is displayed from top to bottom.
if(dataType === "numeric")
{
}
else
{
}
}
else
{
}
return p;
},
/**
* Rotates and positions a text field.
*
* @method _rotate
* @param {HTMLElement} label text field to rotate and position
* @param {Object} props properties to be applied to the text field.
* @private
*/
{
x = props.x,
y = props.y,
m11,
m12,
m21,
m22,
{
}
else
{
{
filterString = "progid:DXImageTransform.Microsoft.Alpha(Opacity=" + Math.round(textAlpha * 100) + ")";
}
if(rot !== 0)
{
if(filterString)
{
filterString += " ";
}
else
{
filterString = "";
}
filterString += 'progid:DXImageTransform.Microsoft.Matrix(M11=' + m11 + ' M12=' + m12 + ' M21=' + m21 + ' M22=' + m22 + ' sizingMethod="auto expand")';
}
if(filterString)
{
}
}
}
}, {
{
/**
*
* @attribute edgeOffset
* @type Number
* @protected
*/
{
value: 0
},
/**
* The graphic in which the axis line and ticks will be rendered.
*
* @attribute graphic
* @type Graphic
*/
graphic: {},
/**
* @attribute path
* @type Shape
* @readOnly
* @private
*/
path: {
readOnly: true,
getter: function()
{
if(!this._path)
{
if(graphic)
{
}
}
return this._path;
}
},
/**
* @attribute tickPath
* @type Shape
* @readOnly
* @private
*/
tickPath: {
readOnly: true,
getter: function()
{
if(!this._tickPath)
{
if(graphic)
{
}
}
return this._tickPath;
}
},
/**
* Contains the contents of the axis.
*
* @attribute node
* @type HTMLElement
*/
node: {},
/**
* Direction of the axis.
*
* @attribute position
* @type String
*/
position: {
{
{
this._layout = new layoutClass();
}
return val;
}
},
/**
* Distance determined by the tick styles used to calculate the distance between the axis
* line in relation to the top of the axis.
*
* @attribute topTickOffset
* @type Number
*/
value: 0
},
/**
* Distance determined by the tick styles used to calculate the distance between the axis
* line in relation to the bottom of the axis.
*
* @attribute bottomTickOffset
* @type Number
*/
value: 0
},
/**
* Distance determined by the tick styles used to calculate the distance between the axis
* line in relation to the left of the axis.
*
* @attribute leftTickOffset
* @type Number
*/
value: 0
},
/**
* Distance determined by the tick styles used to calculate the distance between the axis
* line in relation to the right side of the axis.
*
* @attribute rightTickOffset
* @type Number
*/
value: 0
},
/**
* Collection of labels used to render the axis.
*
* @attribute labels
* @type Array
*/
labels: {
readOnly: true,
getter: function()
{
return this._labels;
}
},
/**
* Collection of points used for placement of labels and ticks along the axis.
*
* @attribute tickPoints
* @type Array
*/
tickPoints: {
readOnly: true,
getter: function()
{
{
}
return this._tickPoints;
}
},
/**
* Indicates whether the axis overlaps the graph. If an axis is the inner most axis on a given
* position and the tick position is inside or cross, the axis will need to overlap the graph.
*
* @attribute overlapGraph
* @type Boolean
*/
overlapGraph: {
value:true,
{
}
},
/**
* Object which should have by the labelFunction
*
* @attribute labelFunctionScope
* @type Object
*/
labelFunctionScope: {},
/**
* Length in pixels of largest text bounding box. Used to calculate the height of the axis.
*
* @attribute maxLabelSize
* @type Number
* @protected
*/
maxLabelSize: {
value: 0
},
/**
* Title for the axis. When specified, the title will display. The position of the title is determined by the axis position.
* <dl>
* <dt>top</dt><dd>Appears above the axis and it labels. The default rotation is 0.</dd>
* <dt>right</dt><dd>Appears to the right of the axis and its labels. The default rotation is 90.</dd>
* <dt>bottom</dt><dd>Appears below the axis and its labels. The default rotation is 0.</dd>
* <dt>left</dt><dd>Appears to the left of the axis and its labels. The default rotation is -90.</dd>
* </dl>
*
* @attribute title
* @type String
*/
title: {
{
}
},
/**
* Method used for formatting title. The method use would need to implement the arguments below and return a `String` or `HTML`. The default implementation
* of the method returns a `String`. The output of this method will be rendered to the DOM using `innerHTML`.
* <dl>
* <dt>val</dt><dd>Title to be formatted. (`String`)</dd>
* </dl>
*
* @attribute titleFunction
* @type Function
*/
{
return val;
}
},
/**
* Method used for formatting a label. This attribute allows for the default label formatting method to overridden. The method use would need
* to implement the arguments below and return a `String` or `HTML`. The default implementation of the method returns a `String`. The output of this method
* will be rendered to the DOM using `innerHTML`.
* <dl>
* <dt>val</dt><dd>Label to be formatted. (`String`)</dd>
* <dt>format</dt><dd>Template for formatting label. (optional)</dd>
* </dl>
*
* @attribute labelFunction
* @type Function
*/
{
return val;
}
}
/**
* Style properties used for drawing an axis. This attribute is inherited from `Renderer`. Below are the default values:
* <dl>
* <dt>majorTicks</dt><dd>Properties used for drawing ticks.
* <dl>
* <dt>display</dt><dd>Position of the tick. Possible values are `inside`, `outside`, `cross` and `none`. The
* default value is `inside`.</dd>
* <dt>length</dt><dd>The length (in pixels) of the tick. The default value is 4.</dd>
* <dt>color</dt><dd>The color of the tick. The default value is `#dad8c9`</dd>
* <dt>weight</dt><dd>Number indicating the width of the tick. The default value is 1.</dd>
* <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the tick. The default value is 1.</dd>
* </dl>
* </dd>
* <dt>line</dt><dd>Properties used for drawing the axis line.
* <dl>
* <dt>weight</dt><dd>Number indicating the width of the axis line. The default value is 1.</dd>
* <dt>color</dt><dd>The color of the axis line. The default value is `#dad8c9`.</dd>
* <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the tick. The default value is 1.</dd>
* </dl>
* </dd>
* <dt>majorUnit</dt><dd>Properties used to calculate the `majorUnit` for the axis.
* <dl>
* <dt>determinant</dt><dd>The algorithm used for calculating distance between ticks. The possible options are `count` and `distance`. If
* the `determinant` is `count`, the axis ticks will spaced so that a specified number of ticks appear on the axis. If the `determinant`
* is `distance`, the axis ticks will spaced out according to the specified distance. The default value is `count`.</dd>
* <dt>count</dt><dd>Number of ticks to appear on the axis when the `determinant` is `count`. The default value is 11.</dd>
* <dt>distance</dt><dd>The distance (in pixels) between ticks when the `determinant` is `distance`. The default value is 75.</dd>
* </dl>
* </dd>
* <dt>label</dt><dd>Properties and styles applied to the axis labels.
* <dl>
* <dt>color</dt><dd>The color of the labels. The default value is `#808080`.</dd>
* <dt>alpha</dt><dd>Number between 0 and 1 indicating the opacity of the labels. The default value is 1.</dd>
* <dt>fontSize</dt><dd>The font-size of the labels. The default value is 85%</dd>
* <dt>rotation</dt><dd>The rotation, in degrees (between -90 and 90) of the labels. The default value is 0.</dd>
* <dt>margin</dt><dd>The distance between the label and the axis/tick. Depending on the position of the `Axis`, only one of the properties used.
* <dl>
* <dt>top</dt><dd>Pixel value used for an axis with a `position` of `bottom`. The default value is 4.</dd>
* <dt>right</dt><dd>Pixel value used for an axis with a `position` of `left`. The default value is 4.</dd>
* <dt>bottom</dt><dd>Pixel value used for an axis with a `position` of `top`. The default value is 4.</dd>
* <dt>left</dt><dd>Pixel value used for an axis with a `position` of `right`. The default value is 4.</dd>
* </dl>
* </dd>
* </dl>
* </dd>
* </dl>
*
* @attribute styles
* @type Object
*/
}
});
/**
* AxisType is an abstract class that manages the data for an axis.
*
* @module charts
* @class AxisType
* @constructor
* @extends Axis
*/
/**
* @method initializer
* @private
*/
initializer: function()
{
},
/**
* @method bindUI
* @private
*/
bindUI: function()
{
},
/**
* Handles changes to `dataProvider`.
*
* @method _dataProviderChangeHandler
* @param {Object} e Event object.
* @private
*/
_dataProviderChangeHandler: function(e)
{
i;
if(keys)
{
for(i in keys)
{
if(keys.hasOwnProperty(i))
{
delete keys[i];
}
}
}
{
}
},
/**
* Constant used to generate unique id.
*
* @property GUID
* @type String
* @private
*/
GUID: "yuibaseaxis",
/**
* Type of data used in `Axis`.
*
* @property _type
* @type String
* @readOnly
* @private
*/
_type: null,
/**
* Storage for `setMaximum` attribute.
*
* @property _setMaximum
* @type Object
* @private
*/
_setMaximum: null,
/**
* Storage for `dataMaximum` attribute.
*
* @property _dataMaximum
* @type Object
* @private
*/
_dataMaximum: null,
/**
* Storage for `setMinimum` attribute.
*
* @property _setMinimum
* @type Object
* @private
*/
_setMinimum: null,
/**
* Reference to data array.
*
* @property _data
* @type Array
* @private
*/
_data: null,
/**
* Indicates whether the all data is up to date.
*
* @property _updateTotalDataFlag
* @type Boolean
* @private
*/
_updateTotalDataFlag: true,
/**
* Storage for `dataReady` attribute.
*
* @property _dataReady
* @type Boolean
* @readOnly
* @private
*/
_dataReady: false,
/**
* Adds an array to the key hash.
*
* @method addKey
* @param value Indicates what key to use in retrieving
* the array.
*/
{
},
/**
* Gets an array of values based on a key.
*
* @method _getKeyArray
* @param {String} key Value key associated with the data array.
* @param {Array} data Array in which the data resides.
* @return Array
* @private
*/
{
var i = 0,
obj,
keyArray = [],
for(; i < len; ++i)
{
}
return keyArray;
},
/**
* Sets data by key
*
* @method _setDataByKey
* @param {String} key Key value to use.
* @param {Array} data Array to use.
* @private
*/
{
var i,
obj,
arr = [],
for(i = 0; i < len; ++i)
{
}
this._updateTotalDataFlag = true;
},
/**
* Updates the total data array.
*
* @method _updateTotalData
* @private
*/
_updateTotalData: function()
{
i;
this._data = [];
for(i in keys)
{
if(keys.hasOwnProperty(i))
{
}
}
this._updateTotalDataFlag = false;
},
/**
* Removes an array from the key hash.
*
* @method removeKey
* @param {String} value Indicates what key to use in removing from
* the hash.
*/
{
{
this._keyChangeHandler();
}
},
/**
* Returns a value based of a key value and an index.
*
* @method getKeyValueAt
* @param {String} key value used to look up the correct array
* @param {Number} index within the array
* @return Number
*/
{
{
}
return parseFloat(value);
},
/**
* Returns an array of values based on an identifier key.
*
* @method getDataByKey
* @param {String} value value used to identify the array
* @return Object
*/
getDataByKey: function (value)
{
{
}
return null;
},
/**
* Calculates the maximum and minimum values for the `Axis`.
*
* @method _updateMinAndMax
* @private
*/
_updateMinAndMax: function()
{
max = 0,
min = 0,
len,
num,
i;
{
if(len > 1)
{
for(i = 1; i < len; i++)
{
{
continue;
}
}
}
}
this._dataMaximum = max;
this._dataMinimum = min;
},
/**
* Returns the total number of majorUnits that will appear on an axis.
*
* @method getTotalMajorUnits
* @return Number
*/
getTotalMajorUnits: function()
{
var units,
{
}
{
}
return units;
},
/**
* Returns the distance between major units on an axis.
*
* @method getMajorUnitDistance
* @param {Number} len Number of ticks
* @param {Number} uiLen Size of the axis.
* @param {Object} majorUnit Hash of properties used to determine the majorUnit
* @return Number
*/
{
var dist;
{
}
{
}
return dist;
},
/**
* Gets the distance that the first and last ticks are offset from there respective
* edges.
*
* @method getEdgeOffset
* @param {Number} ct Number of ticks on the axis.
* @param {Number} l Length (in pixels) of the axis.
* @return Number
*/
getEdgeOffset: function(ct, l)
{
return 0;
},
/**
* Calculates and returns a value based on the number of labels and the index of
* the current label.
*
* @method getLabelByIndex
* @param {Number} i Index of the label.
* @param {Number} l Total number of labels.
* @return String
*/
getLabelByIndex: function(i, l)
{
l -= 1;
return label;
},
/**
* Updates the `Axis` after a change in keys.
*
* @method _keyChangeHandler
* @param {Object} e Event object.
* @private
*/
_keyChangeHandler: function(e)
{
this._updateMinAndMax();
this.fire("dataUpdate");
},
/**
* Checks to see if data extends beyond the range of the axis. If so,
* that data will need to be hidden. This method is internal, temporary and subject
* to removal in the future.
*
* @method _hasDataOverflow
* @protected
* @return Boolean
*/
_hasDataOverflow: function()
{
{
return true;
}
return false;
}
}, {
ATTRS: {
/**
* Hash of array identifed by a string value.
*
* @attribute keys
* @type Object
*/
keys: {
value: {},
{
var keys = {},
i,
len,
{
for(i = 0; i < len; ++i)
{
}
}
{
}
else
{
for(i in val)
{
if(val.hasOwnProperty(i))
{
}
}
}
this._updateTotalDataFlag = true;
return keys;
}
},
/**
*Indicates how to round unit values.
* <dl>
* <dt>niceNumber</dt><dd>Units will be smoothed based on the number of ticks and data range.</dd>
* <dt>auto</dt><dd>If the range is greater than 1, the units will be rounded.</dd>
* <dt>numeric value</dt><dd>Units will be equal to the numeric value.</dd>
* <dt>null</dt><dd>No rounding will occur.</dd>
* </dl>
*
* @attribute roundingMethod
* @type String
* @default niceNumber
*/
value: "niceNumber"
},
/**
*Returns the type of axis data
* <dl>
* <dt>time</dt><dd>Manages time data</dd>
* <dt>stacked</dt><dd>Manages stacked numeric data</dd>
* <dt>numeric</dt><dd>Manages numeric data</dd>
* <dt>category</dt><dd>Manages categorical data</dd>
* </dl>
*
* @attribute type
* @type String
*/
type:
{
readOnly: true,
getter: function ()
{
return this._type;
}
},
/**
* Instance of `ChartDataProvider` that the class uses
* to build its own data.
*
* @attribute dataProvider
* @type Array
*/
{
return value;
}
},
/**
* The maximum value contained in the `data` array. Used for
* `maximum` when `autoMax` is true.
*
* @attribute dataMaximum
* @type Number
*/
dataMaximum: {
getter: function ()
{
if(!this._dataMaximum)
{
this._updateMinAndMax();
}
return this._dataMaximum;
}
},
/**
* The maximum value that will appear on an axis.
*
* @attribute maximum
* @type Number
*/
maximum: {
lazyAdd: false,
getter: function ()
{
//If all values are zero, force a range so that the Axis and related series
//will still render.
{
max = 10;
}
{
max = this._setMaximum;
}
return parseFloat(max);
},
{
return value;
}
},
/**
* The minimum value contained in the `data` array. Used for
* `minimum` when `autoMin` is true.
*
* @attribute dataMinimum
* @type Number
*/
dataMinimum: {
getter: function ()
{
if(!this._dataMinimum)
{
this._updateMinAndMax();
}
return this._dataMinimum;
}
},
/**
* The minimum value that will appear on an axis.
*
* @attribute minimum
* @type Number
*/
minimum: {
lazyAdd: false,
getter: function ()
{
{
min = this._setMinimum;
}
return parseFloat(min);
},
{
return val;
}
},
/**
* Determines whether the maximum is calculated or explicitly
* set by the user.
*
* @attribute setMax
* @type Boolean
*/
setMax: {
readOnly: true,
getter: function()
{
}
},
/**
* Determines whether the minimum is calculated or explicitly
* set by the user.
*
* @attribute setMin
* @type Boolean
*/
setMin: {
readOnly: true,
getter: function()
{
}
},
/**
* Array of axis data
*
* @attribute data
* @type Array
*/
data: {
getter: function ()
{
if(!this._data || this._updateTotalDataFlag)
{
this._updateTotalData();
}
return this._data;
}
},
/**
* Array containing all the keys in the axis.
* @attribute keyCollection
* @type Array
*/
getter: function()
{
i,
col = [];
for(i in keys)
{
if(keys.hasOwnProperty(i))
{
}
}
return col;
},
readOnly: true
}
}
});
/**
* NumericAxis manages numeric data on an axis.
*
* @module charts
* @class NumericAxis
* @constructor
* @param {Object} config (optional) Configuration parameters for the Chart.
* @extends AxisType
*/
function NumericAxis(config)
{
}
NumericAxis.ATTRS = {
/**
* Indicates whether 0 should always be displayed.
*
* @attribute alwaysShowZero
* @type Boolean
*/
value: true
},
/**
* Method used for formatting a label. This attribute allows for the default label formatting method to overridden. The method use would need
* to implement the arguments below and return a `String` or `HTML`. The default implementation of the method returns a `String`. The output of this method
* will be rendered to the DOM using `innerHTML`.
* <dl>
* <dt>val</dt><dd>Label to be formatted. (`String`)</dd>
* <dt>format</dt><dd>Object containing properties used to format the label. (optional)</dd>
* </dl>
*
* @attribute labelFunction
* @type Function
*/
{
if(format)
{
}
return val;
}
},
/**
* Object containing properties used by the `labelFunction` to format a
* label.
*
* @attribute labelFormat
* @type Object
*/
labelFormat: {
value: {
prefix: "",
thousandsSeparator: "",
decimalSeparator: "",
decimalPlaces: "0",
suffix: ""
}
}
};
{
/**
* Type of data used in `Axis`.
*
* @property _type
* @readOnly
* @private
*/
_type: "numeric",
/**
* Helper method for getting a `roundingUnit` when calculating the minimum and maximum values.
*
* @method _getMinimumUnit
* @param {Number} max Maximum number
* @param {Number} min Minimum number
* @param {Number} units Number of units on the axis
* @return Number
* @private
*/
{
},
/**
* Calculates a nice rounding unit based on the range.
*
* @method _getNiceNumber
* @param {Number} roundingUnit The calculated rounding unit.
* @return Number
* @private
*/
_getNiceNumber: function(roundingUnit)
{
var tempMajorUnit = roundingUnit,
{
}
else
{
}
if(!isNaN(tempMajorUnit))
{
return tempMajorUnit;
}
return roundingUnit;
},
/**
* Calculates the maximum and minimum values for the `Axis`.
*
* @method _updateMinAndMax
* @private
*/
_updateMinAndMax: function()
{
max,
min,
len,
num,
i = 0,
key,
{
{
for(; i < len; i++)
{
{
{
//hloc values
{
{
}
}
}
continue;
}
if(setMin)
{
min = this._setMinimum;
}
{
}
else
{
}
if(setMax)
{
max = this._setMaximum;
}
{
}
else
{
}
this._actualMaximum = max;
this._actualMinimum = min;
}
}
}
},
/**
* Rounds the mimimum and maximum values based on the `roundingUnit` attribute.
*
* @method _roundMinAndMax
* @param {Number} min Minimum value
* @param {Number} max Maximum value
* @private
*/
{
var roundingUnit,
if(roundingMethod)
{
if(roundingMethod == "niceNumber")
{
{
{
min = 0;
}
else
{
}
if(setMax)
{
if(!alwaysShowZero)
{
}
}
else if(setMin)
{
}
else
{
}
}
else if(maxGreaterThanZero && !minGreaterThanZero)
{
if(alwaysShowZero)
{
if(setMin)
{
{
botTicks--;
topTicks++;
}
//if there are any bottom ticks left calcualate the maximum by multiplying by the tempMin value
//if not, it's impossible to ensure that a zero is shown. skip it
if(botTicks > 0)
{
}
else
{
}
}
else if(setMax)
{
{
botTicks++;
topTicks--;
}
//if there are any top ticks left calcualate the minimum by multiplying by the tempMax value
//if not, it's impossible to ensure that a zero is shown. skip it
if(topTicks > 0)
{
}
else
{
}
}
else
{
}
}
else
{
if(setMax)
{
}
else if(setMin)
{
}
else
{
}
}
}
else
{
if(setMin)
{
if(alwaysShowZero)
{
max = 0;
}
else
{
}
}
else if(!setMax)
{
{
max = 0;
}
else
{
}
}
else
{
}
}
}
else if(roundingMethod == "auto")
{
{
{
min = 0;
}
if(useIntegers)
{
}
}
else if(maxGreaterThanZero && !minGreaterThanZero)
{
if(alwaysShowZero)
{
if(useIntegers)
{
}
else
{
}
}
else
{
if(useIntegers)
{
}
}
}
else
{
if(useIntegers)
{
}
{
max = 0;
if(useIntegers)
{
Math.ceil(roundingUnit);
}
}
else
{
}
}
}
{
if(setMax)
{
}
else if(setMin)
{
}
else if(minGreaterThanZero && maxGreaterThanZero)
{
{
min = 0;
}
else
{
}
}
else if(maxGreaterThanZero && !minGreaterThanZero)
{
}
else
{
{
max = 0;
}
else
{
}
}
}
}
this._dataMaximum = max;
this._dataMinimum = min;
},
/**
* Calculates and returns a value based on the number of labels and the index of
* the current label.
*
* @method getLabelByIndex
* @param {Number} i Index of the label.
* @param {Number} l Total number of labels.
* @return String
*/
getLabelByIndex: function(i, l)
{
l -= 1;
//respect the min and max. calculate all other labels.
if(i === 0)
{
}
else if(i === l)
{
}
else
{
{
}
}
return parseFloat(label);
},
/**
* Rounds a Number to the nearest multiple of an input. For example, by rounding
* 16 to the nearest 10, you will receive 20. Similar to the built-in function Math.round().
*
* @method _roundToNearest
* @param {Number} number Number to round
* @param {Number} nearest Multiple to round towards.
* @return Number
* @private
*/
{
if(nearest === 0)
{
return number;
}
},
/**
* Rounds a Number up to the nearest multiple of an input. For example, by rounding
* 16 up to the nearest 10, you will receive 20. Similar to the built-in function Math.ceil().
*
* @method _roundUpToNearest
* @param {Number} number Number to round
* @param {Number} nearest Multiple to round towards.
* @return Number
* @private
*/
{
if(nearest === 0)
{
return number;
}
},
/**
* Rounds a Number down to the nearest multiple of an input. For example, by rounding
* 16 down to the nearest 10, you will receive 10. Similar to the built-in function Math.floor().
*
* @method _roundDownToNearest
* @param {Number} number Number to round
* @param {Number} nearest Multiple to round towards.
* @return Number
* @private
*/
{
if(nearest === 0)
{
return number;
}
},
/**
* Rounds a number to a certain level of precision. Useful for limiting the number of
* decimal places on a fractional number.
*
* @method _roundToPrecision
* @param {Number} number Number to round
* @param {Number} precision Multiple to round towards.
* @return Number
* @private
*/
{
},
/**
* Checks to see if data extends beyond the range of the axis. If so,
* that data will need to be hidden. This method is internal, temporary and subject
* to removal in the future.
*
* @method _hasDataOverflow
* @protected
* @return Boolean
*/
_hasDataOverflow: function()
{
var roundingMethod,
min,
max;
{
return true;
}
min = this._actualMinimum;
max = this._actualMaximum;
if(Y_Lang.isNumber(roundingMethod) && ((Y_Lang.isNumber(max) && max > this._dataMaximum) || (Y_Lang.isNumber(min) && min < this._dataMinimum)))
{
return true;
}
return false;
}
});
Y.NumericAxis = NumericAxis;
/**
* StackedAxis manages stacked numeric data on an axis.
*
* @module charts
* @class StackedAxis
* @constructor
* @param {Object} config (optional) Configuration parameters for the Chart.
* @extends NumericAxis
*/
function StackedAxis(config)
{
}
{
/**
* Calculates the maximum and minimum values for the `Axis`.
*
* @method _updateMinAndMax
* @private
*/
_updateMinAndMax: function()
{
var max = 0,
min = 0,
pos = 0,
neg = 0,
len = 0,
i = 0,
key,
num,
{
{
}
}
for(; i < len; ++i)
{
pos = 0;
neg = 0;
{
{
{
continue;
}
if(num >= 0)
{
}
else
{
}
}
}
if(pos > 0)
{
}
else
{
}
if(neg < 0)
{
}
else
{
}
}
this._actualMaximum = max;
this._actualMinimum = min;
if(setMax)
{
max = this._setMaximum;
}
if(setMin)
{
min = this._setMinimum;
}
}
});
Y.StackedAxis = StackedAxis;
/**
* TimeAxis manages time data on an axis.
*
* @module charts
* @class TimeAxis
* @constructor
* @param {Object} config (optional) Configuration parameters for the Chart.
* @extends AxisType
*/
{
}
{
/**
* Indicates whether the maximum is calculated or explicitly set.
*
* @attribute setMax
* @readOnly
* @type Boolean
* @private
*/
setMax: {
readOnly: true,
getter: function()
{
}
},
/**
* Indicates whether the minimum is calculated or explicitly set.
*
* @attribute setMin
* @readOnly
* @type Boolean
* @private
*/
setMin: {
readOnly: true,
getter: function()
{
}
},
/**
* The maximum value that will appear on an axis. Unless explicitly set, this value is calculated by the `Axis`.
*
* @attribute maximum
* @type Number
*/
maximum: {
getter: function ()
{
{
}
return parseFloat(max);
},
{
return value;
}
},
/**
* The minimum value that will appear on an axis. Unless explicitly set, this value is calculated by the `Axis`.
*
* @attribute minimum
* @type Number
*/
minimum: {
getter: function ()
{
{
}
return parseFloat(min);
},
{
return value;
}
},
/**
* Method used for formatting a label. This attribute allows for the default label formatting method to overridden. The method use would need
* to implement the arguments below and return a `String` or `HTML`. The default implementation of the method returns a `String`. The output of this method
* will be rendered to the DOM using `innerHTML`.
* <dl>
* <dt>val</dt><dd>Label to be formatted. (`String`)</dd>
* <dt>format</dt><dd>STRFTime string used to format the label. (optional)</dd>
* </dl>
*
* @attribute labelFunction
* @type Function
*/
{
if(format)
{
}
}
},
/**
* Pattern used by the `labelFunction` to format a label.
*
* @attribute labelFormat
* @type String
*/
labelFormat: {
value: "%b %d, %y"
}
};
/**
* Constant used to generate unique id.
*
* @property GUID
* @type String
* @private
*/
GUID: "yuitimeaxis",
/**
* Type of data used in `Axis`.
*
* @property _dataType
* @readOnly
* @private
*/
_dataType: "time",
/**
* Calculates and returns a value based on the number of labels and the index of
* the current label.
*
* @method getLabelByIndex
* @param {Number} i Index of the label.
* @param {Number} l Total number of labels.
* @return String
*/
getLabelByIndex: function(i, l)
{
l -= 1;
{
}
else
{
}
return label;
},
/**
* Gets an array of values based on a key.
*
* @method _getKeyArray
* @param {String} key Value key associated with the data array.
* @param {Array} data Array in which the data resides.
* @return Array
* @private
*/
{
var obj,
keyArray = [],
i = 0,
val,
for(; i < len; ++i)
{
{
}
else
{
{
}
{
{
}
else
{
if(typeof obj != "string")
{
}
}
}
else
{
}
}
}
return keyArray;
},
/**
* Sets data by key
*
* @method _setDataByKey
* @param {String} key Key value to use.
* @param {Array} data Array to use.
* @private
*/
{
var obj,
arr = [],
i,
val,
for(i = 0; i < len; ++i)
{
{
}
else
{
{
}
{
{
}
else
{
if(typeof obj != "string")
{
}
}
}
else
{
}
}
}
this._updateTotalDataFlag = true;
},
/**
* Parses value into a number.
*
* @method _getNumber
* @param val {Object} Value to parse into a number
* @return Number
* @private
*/
_getNumber: function(val)
{
{
}
{
}
return val;
}
});
/**
* CategoryAxis manages category data on an axis.
*
* @module charts
* @class CategoryAxis
* @constructor
* @param {Object} config (optional) Configuration parameters for the Chart.
* @extends AxisType
*/
function CategoryAxis(config)
{
}
{
/**
* Object storing key data.
*
* @property _indices
* @private
*/
_indices: null,
/**
* Constant used to generate unique id.
*
* @property GUID
* @type String
* @private
*/
GUID: "yuicategoryaxis",
/**
* Type of data used in `Axis`.
*
* @property _dataType
* @readOnly
* @private
*/
_type: "category",
/**
* Calculates the maximum and minimum values for the `Axis`.
*
* @method _updateMinAndMax
* @private
*/
_updateMinAndMax: function()
{
this._dataMinimum = 0;
},
/**
* Gets an array of values based on a key.
*
* @method _getKeyArray
* @param {String} key Value key associated with the data array.
* @param {Array} data Array in which the data resides.
* @return Array
* @private
*/
{
var i = 0,
obj,
keyArr = [],
labels = [],
if(!this._indices)
{
this._indices = {};
}
for(; i < len; ++i)
{
keyArr[i] = i;
}
return labels;
},
/**
* Sets data by key
*
* @method _setDataByKey
* @param {String} key Key value to use.
* @param {Array} data Array to use.
* @private
*/
_setDataByKey: function(key)
{
var i,
obj,
arr = [],
labels = [],
if(!this._indices)
{
this._indices = {};
}
for(i = 0; i < len; ++i)
{
arr[i] = i;
}
this._updateTotalDataFlag = true;
},
/**
* Returns an array of values based on an identifier key.
*
* @method getDataByKey
* @param {String} value value used to identify the array
* @return Array
*/
getDataByKey: function (value)
{
if(!this._indices)
{
this.get("keys");
}
{
}
return null;
},
/**
* Returns the total number of majorUnits that will appear on an axis.
*
* @method getTotalMajorUnits
* @param {Object} majorUnit Object containing properties related to the majorUnit.
* @param {Number} len Length of the axis.
* @return Number
*/
{
},
/**
* Returns the distance between major units on an axis.
*
* @method getMajorUnitDistance
* @param {Number} len Number of ticks
* @param {Number} uiLen Size of the axis.
* @param {Object} majorUnit Hash of properties used to determine the majorUnit
* @return Number
*/
{
var dist;
{
}
{
}
return dist;
},
/**
* Gets the distance that the first and last ticks are offset from there respective
* edges.
*
* @method getEdgeOffset
* @param {Number} ct Number of ticks on the axis.
* @param {Number} l Length (in pixels) of the axis.
* @return Number
*/
getEdgeOffset: function(ct, l)
{
return l/ct;
},
/**
* Returns a value based of a key value and an index.
*
* @method getKeyValueAt
* @param {String} key value used to look up the correct array
* @param {Number} index within the array
* @return String
*/
{
{
}
},
/**
* Calculates and returns a value based on the number of labels and the index of
* the current label.
*
* @method getLabelByIndex
* @param {Number} i Index of the label.
* @param {Number} l Total number of labels.
* @return String
*/
getLabelByIndex: function(i, l)
{
var label,
{
}
else
{
}
}
});
Y.CategoryAxis = CategoryAxis;
/**
* Utility class used for calculating curve points.
*
* @module charts
* @class CurveUtil
* @constructor
*/
function CurveUtil()
{
}
/**
* Creates an array of start, end and control points for splines.
*
* @method getCurveControlPoints
* @param {Array} xcoords Collection of x-coordinates used for calculate the curves
* @param {Array} ycoords Collection of y-coordinates used for calculate the curves
* @return Object
* @protected
*/
{
var outpoints = [],
i = 1,
xvals = [],
yvals = [];
// Too few points, need at least two
if (l < 1)
{
return null;
}
outpoints[0] = {
};
// Special case, the Bezier should be a straight line
if (l === 1)
{
return outpoints;
}
for (; i < l; ++i)
{
outpoints.push({startx: Math.round(xcoords[i]), starty: Math.round(ycoords[i]), endx: Math.round(xcoords[i+1]), endy: Math.round(ycoords[i+1])});
}
for (i = 0; i < l; ++i)
{
if (i < l-1)
{
}
else
{
}
}
return outpoints;
},
/**
* Gets the control points for the curve.
*
* @method getControlPoints
* @param {Array} vals Collection of values coords used to generate control points.
* @return Array
* @private
*/
getControlPoints: function(vals)
{
x = [],
tmp = [],
b = 2.0,
i = 1;
for (; i < l; ++i)
{
tmp[i] = 1/b;
x[i] = (vals[i] - x[i-1]) / b;
}
for (i = 1; i < l; ++i)
{
x[l-i-1] -= tmp[l-i] * x[l-i];
}
return x;
}
};
/**
* Utility class used for creating stacked series.
*
* @module charts
* @class StackingUtil
* @constructor
*/
function StackingUtil(){}
/**
* @protected
*
* Adjusts coordinate values for stacked series.
*
* @method _stackCoordinates
*/
_stackCoordinates: function()
{
i = 0,
len,
if(order === 0)
{
return;
}
if(direction === "vertical")
{
for(; i < len; ++i)
{
{
xcoords[i] += prevXCoords[i];
}
}
}
else
{
for(; i < len; ++i)
{
{
}
}
}
}
};
Y.StackingUtil = StackingUtil;
/**
* Utility class used for drawing lines.
*
* @module charts
* @class Lines
* @constructor
*/
function Lines(){}
/**
* @property _lineDefaults
* @type Object
* @private
*/
_lineDefaults: null,
/**
* Creates a graphic in which to draw a series.
*
* @method _getGraphic
* @return Graphic
* @private
*/
_getGraphic: function()
{
if(!this._lineGraphic)
{
}
this._lineGraphic.clear();
return this._lineGraphic;
},
/**
* Toggles visibility
*
* @method _toggleVisible
* @param {Boolean} visible indicates visibilitye
* @private
*/
_toggleVisible: function(visible)
{
if(this._lineGraphic)
{
}
},
/**
* Draws lines for the series.
*
* @method drawLines
* @protected
*/
drawLines: function()
{
{
return;
}
noPointsRendered = true,
i,
path = this._getGraphic();
});
for(i = 0; i < len; i = ++i)
{
if(!pointValid)
{
continue;
}
if(noPointsRendered)
{
noPointsRendered = false;
}
else if(lastPointValid)
{
if(lineType != "dashed")
{
}
else
{
gapSpace);
}
}
else if(!connectDiscontinuousPoints)
{
}
else
{
if(discontinuousType != "solid")
{
}
else
{
}
}
lastValidX = nextX;
lastValidY = nextY;
lastPointValid = true;
}
},
/**
* Connects data points with a consistent curve for a series.
*
* @method drawSpline
* @protected
*/
drawSpline: function()
{
{
return;
}
cx1,
cx2,
cy1,
cy2,
x,
y,
i = 0,
path = this._getGraphic(),
});
for(; i < len; i = ++i)
{
x = curvecoords[i].endx;
y = curvecoords[i].endy;
}
},
/**
* Draws a dashed line between two points.
*
* @method drawDashedLine
* @param {Number} xStart The x position of the start of the line
* @param {Number} yStart The y position of the start of the line
* @param {Number} xEnd The x position of the end of the line
* @param {Number} yEnd The y position of the end of the line
* @param {Number} dashSize the size of dashes, in pixels
* @param {Number} gapSize the size of gaps between dashes, in pixels
* @private
*/
{
i,
path = this._getGraphic();
for(i = 0; i < segmentCount; ++i)
{
}
{
}
else if(delta > 0)
{
}
},
/**
* Default values for `styles` attribute.
*
* @method _getLineDefaults
* @return Object
* @protected
*/
_getLineDefaults: function()
{
return {
alpha: 1,
weight: 6,
lineType:"solid",
dashLength:10,
gapSpace:10,
discontinuousType:"solid",
};
}
};
/**
* Utility class used for drawing area fills.
*
* @module charts
* @class Fills
* @constructor
*/
{
var attrs = {
area: {
getter: function()
{
return this._defaults || this._getAreaDefaults();
},
{
}
}
};
this.get("styles");
}
/**
* Returns a path shape used for drawing fills.
*
* @method _getPath
* @return Path
* @private
*/
_getPath: function()
{
if(!path)
{
}
return path;
},
/**
* Toggles visibility
*
* @method _toggleVisible
* @param {Boolean} visible indicates visibilitye
* @private
*/
_toggleVisible: function(visible)
{
if(this._path)
{
}
},
/**
* Draws fill
*
* @method drawFill
* @param {Array} xcoords The x-coordinates for the series.
* @param {Array} ycoords The y-coordinates for the series.
* @protected
*/
{
{
return;
}
lastValidX = firstX,
lastValidY = firstY,
i = 1,
});
for(; i < len; i = ++i)
{
{
lastValidX = nextX;
lastValidY = nextY;
continue;
}
lastValidX = nextX;
lastValidY = nextY;
}
},
/**
* Draws a fill for a spline
*
* @method drawAreaSpline
* @protected
*/
drawAreaSpline: function()
{
{
return;
}
cx1,
cx2,
cy1,
cy2,
x,
y,
i = 0,
});
for(; i < len; i = ++i)
{
x = curvecoords[i].endx;
y = curvecoords[i].endy;
}
{
}
else
{
}
},
/**
* Draws a a stacked area spline
*
* @method drawStackedAreaSpline
* @protected
*/
drawStackedAreaSpline: function()
{
{
return;
}
len,
cx1,
cx2,
cy1,
cy2,
x,
y,
i = 0,
});
for(; i < len; i = ++i)
{
x = curvecoords[i].endx;
y = curvecoords[i].endy;
}
if(order > 0)
{
i = 0;
for(; i < len; i = ++i)
{
x = curvecoords[i].endx;
y = curvecoords[i].endy;
}
}
else
{
{
}
else
{
}
}
},
/**
* Storage for default area styles.
*
* @property _defaults
* @type Object
* @private
*/
_defaults: null,
/**
* Concatenates coordinate array with correct coordinates for closing an area fill.
*
* @method _getClosingPoints
* @return Array
* @protected
*/
_getClosingPoints: function()
{
{
}
else
{
}
},
/**
* Concatenates coordinate array with the correct coordinates for closing an area stack.
*
* @method _getStackedClosingPoints
* @return Array
* @protected
*/
_getStackedClosingPoints: function()
{
if(order > 0)
{
}
else
{
if(direction === "vertical")
{
}
else
{
}
}
return [allXCoords, allYCoords];
},
/**
* Returns default values for area styles.
*
* @method _getAreaDefaults
* @return Object
* @private
*/
_getAreaDefaults: function()
{
return {
};
}
};
/**
* Utility class used for drawing markers.
*
* @module charts
* @class Plots
* @constructor
*/
{
var attrs = {
markers: {
getter: function()
{
return this._markers;
}
}
};
}
/**
* Storage for default marker styles.
*
* @property _plotDefaults
* @type Object
* @private
*/
_plotDefaults: null,
/**
* Draws the markers
*
* @method drawPlots
* @protected
*/
drawPlots: function()
{
{
return;
}
i = 0,
left,
offsetWidth = w/2,
offsetHeight = h/2,
fillColors = null,
borderColors = null,
{
}
{
}
this._createMarkerCache();
for(; i < len; ++i)
{
{
continue;
}
if(fillColors)
{
}
if(borderColors)
{
}
}
this._clearMarkerCache();
},
/**
* Gets the default values for series that use the utility. This method is used by
* the class' `styles` attribute's getter to get build default values.
*
* @method _getPlotDefaults
* @return Object
* @protected
*/
_getPlotDefaults: function()
{
var defs = {
fill:{
type: "solid",
alpha: 1,
colors:null,
alphas: null,
ratios: null
},
border:{
weight: 1,
alpha: 1
},
width: 10,
height: 10,
shape: "circle"
};
return defs;
},
/**
* Collection of markers to be used in the series.
*
* @property _markers
* @type Array
* @private
*/
_markers: null,
/**
* Collection of markers to be re-used on a series redraw.
*
* @property _markerCache
* @type Array
* @private
*/
_markerCache: null,
/**
* Gets and styles a marker. If there is a marker in cache, it will use it. Otherwise
* it will create one.
*
* @method getMarker
* @param {Object} styles Hash of style properties.
* @param {Number} order Order of the series.
* @param {Number} index Index within the series associated with the marker.
* @return Shape
* @protected
*/
{
var marker,
//fix name differences between graphic layer
{
while(!marker)
{
{
break;
}
}
}
else
{
}
return marker;
},
/**
* Creates a shape to be used as a marker.
*
* @method _createMarker
* @param {Object} styles Hash of style properties.
* @param {Number} order Order of the series.
* @param {Number} index Index within the series associated with the marker.
* @return Shape
* @private
*/
{
return marker;
},
/**
* Creates a cache of markers for reuse.
*
* @method _createMarkerCache
* @private
*/
_createMarkerCache: function()
{
{
}
else
{
this._markerCache = [];
}
this._markers = [];
},
/**
* Toggles visibility
*
* @method _toggleVisible
* @param {Boolean} visible indicates visibilitye
* @private
*/
_toggleVisible: function(visible)
{
var marker,
i = 0,
len;
if(markers)
{
for(; i < len; ++i)
{
if(marker)
{
}
}
}
},
/**
* Removes unused markers from the marker cache
*
* @method _clearMarkerCache
* @private
*/
_clearMarkerCache: function()
{
var marker;
{
if(marker)
{
}
}
},
/**
* Resizes and positions markers based on a mouse interaction.
*
* @method updateMarkerState
* @param {String} type state of the marker
* @param {Number} i index of the marker
* @protected
*/
updateMarkerState: function(type, i)
{
if(this._markers[i])
{
var w,
h,
w = markerStyles.width;
h = markerStyles.height;
}
},
/**
* Parses a color from an array.
*
* @method _getItemColor
* @param {Array} val collection of colors
* @param {Number} i index of the item
* @return String
* @protected
*/
_getItemColor: function(val, i)
{
{
}
return val;
},
/**
* Method used by `styles` setter. Overrides base implementation.
*
* @method _setStyles
* @param {Object} newStyles Hash of properties to update.
* @return Object
* @protected
*/
_setStyles: function(val)
{
},
/**
* Combines new styles with existing styles.
*
* @method _parseMarkerStyles
* @param {Object} Object containing style properties for the marker.
* @return Object
* @private
*/
_parseMarkerStyles: function(val)
{
{
var defs = this._getPlotDefaults();
{
}
{
}
}
return val;
},
/**
* Returns marker state based on event type
*
* @method _getState
* @param {String} type event type
* @return String
* @protected
*/
{
var state;
switch(type)
{
case "mouseout" :
state = "off";
break;
case "mouseover" :
state = "over";
break;
case "mouseup" :
state = "over";
break;
case "mousedown" :
state = "down";
break;
}
return state;
},
/**
* @property _statSyles
* @type Object
* @private
*/
_stateSyles: null
};
/**
* Histogram is the base class for Column and Bar series.
*
* @module charts
* @class Histogram
* @constructor
*/
function Histogram(){}
/**
* Draws the series.
*
* @method drawSeries
* @protected
*/
drawSeries: function()
{
{
return;
}
i = 0,
seriesSize = 0,
totalSize = 0,
offset = 0,
left,
fillColors = null,
borderColors = null;
{
}
{
}
{
setSizeKey = "height";
calculatedSizeKey = "width";
}
else
{
setSizeKey = "width";
calculatedSizeKey = "height";
}
this._createMarkerCache();
for(; i < seriesLen; ++i)
{
renderer = seriesCollection[i];
if(order > i)
{
offset = seriesSize;
}
}
{
seriesSize *= ratio;
}
for(i = 0; i < len; ++i)
{
{
continue;
}
{
if(fillColors)
{
}
if(borderColors)
{
}
}
else
{
}
}
this._clearMarkerCache();
},
/**
* Collection of default colors used for marker fills in a series when not specified by user.
*
* @property _defaultFillColors
* @type Array
* @protected
*/
_defaultFillColors: ["#66007f", "#a86f41", "#295454", "#996ab2", "#e8cdb7", "#90bdbd","#000000","#c3b8ca", "#968373", "#678585"],
/**
* Gets the default style values for the markers.
*
* @method _getPlotDefaults
* @return Object
* @private
*/
_getPlotDefaults: function()
{
var defs = {
fill:{
type: "solid",
alpha: 1,
colors:null,
alphas: null,
ratios: null
},
border:{
weight: 0,
alpha: 1
},
width: 12,
height: 12,
shape: "rect",
padding:{
top: 0,
left: 0,
right: 0,
bottom: 0
}
};
return defs;
}
};
/**
* The CartesianSeries class creates a chart with horizontal and vertical axes.
*
* @module charts
* @class CartesianSeries
* @extends Base
* @uses Renderer
* @constructor
*/
/**
* Storage for `xDisplayName` attribute.
*
* @property _xDisplayName
* @type String
* @private
*/
_xDisplayName: null,
/**
* Storage for `yDisplayName` attribute.
*
* @property _yDisplayName
* @type String
* @private
*/
_yDisplayName: null,
/**
* Th x-coordinate for the left edge of the series.
*
* @property _leftOrigin
* @type String
* @private
*/
_leftOrigin: null,
/**
* The y-coordinate for the bottom edge of the series.
*
* @property _bottomOrigin
* @type String
* @private
*/
_bottomOrigin: null,
/**
* @method render
* @private
*/
render: function()
{
this._setCanvas();
this.addListeners();
this.set("rendered", true);
this.validate();
},
/**
* Adds event listeners.
*
* @method addListeners
* @private
*/
addListeners: function()
{
if(xAxis)
{
}
if(yAxis)
{
}
this.after("stylesChange", function(e) {
var axesReady = this._updateAxisData();
if(axesReady)
{
this.draw();
}
});
this.after("widthChange", function(e) {
var axesReady = this._updateAxisData();
if(axesReady)
{
this.draw();
}
});
this.after("heightChange", function(e) {
var axesReady = this._updateAxisData();
if(axesReady)
{
this.draw();
}
});
},
/**
* Event handler for the xAxisChange event.
*
* @method _xAxisChangeHandler
* @param {Object} e Event object.
* @private
*/
_xAxisChangeHandler: function(e)
{
},
/**
* Event handler the yAxisChange event.
*
* @method _yAxisChangeHandler
* @param {Object} e Event object.
* @private
*/
_yAxisChangeHandler: function(e)
{
},
/**
* Constant used to generate unique id.
*
* @property GUID
* @type String
* @private
*/
GUID: "yuicartesianseries",
/**
* Event handler for xDataChange event.
*
* @method _xDataChangeHandler
* @param {Object} event Event object.
* @private
*/
_xDataChangeHandler: function(event)
{
var axesReady = this._updateAxisData();
if(axesReady)
{
this.draw();
}
},
/**
* Event handler for yDataChange event.
*
* @method _yDataChangeHandler
* @param {Object} event Event object.
* @private
*/
_yDataChangeHandler: function(event)
{
var axesReady = this._updateAxisData();
if(axesReady)
{
this.draw();
}
},
/**
* Checks to ensure that both xAxis and yAxis data are available. If so, set the `xData` and `yData` attributes and return `true`. Otherwise, return `false`.
*
* @method _updateAxisData
* @return Boolean
* @private
*/
_updateAxisData: function()
{
{
return false;
}
{
return false;
}
return true;
},
/**
* Draws the series is the xAxis and yAxis data are both available.
*
* @method validate
* @private
*/
validate: function()
{
{
this.draw();
}
else
{
this.fire("drawingComplete");
}
},
/**
* Creates a `Graphic` instance.
*
* @method _setCanvas
* @protected
*/
_setCanvas: function()
{
},
/**
* Calculates the coordinates for the series.
*
* @method setAreaData
* @protected
*/
setAreaData: function()
{
xcoords = [],
ycoords = [],
i = 0,
xMarkerPlane = [],
yMarkerPlane = [],
xOffset *= 0.5;
yOffset *= 0.5;
if(direction === "vertical")
{
}
for (; i < dataLength; ++i)
{
{
}
else
{
}
{
}
else
{
}
}
},
/**
* Draws the series.
*
* @method draw
* @protected
*/
draw: function()
{
if(this.get("rendered"))
{
if((isFinite(w) && isFinite(h) && w > 0 && h > 0) && ((this.get("xData") && this.get("yData")) || this._updateAxisData()))
{
if(this._drawing)
{
this._callLater = true;
return;
}
this._drawing = true;
this._callLater = false;
this.setAreaData();
{
this.drawSeries();
}
this._drawing = false;
if(this._callLater)
{
this.draw();
}
else
{
this.fire("drawingComplete");
}
}
}
},
/**
* Default value for plane offsets when the parent chart's `interactiveType` is `planar`.
*
* @property _defaultPlaneOffset
* @type Number
* @private
*/
/**
* Gets the default value for the `styles` attribute. Overrides
* base implementation.
*
* @method _getDefaultStyles
* @return Object
* @protected
*/
_getDefaultStyles: function()
{
return {padding:{
top: 0,
left: 0,
right: 0,
bottom: 0
}};
},
/**
* Collection of default colors used for lines in a series when not specified by user.
*
* @property _defaultLineColors
* @type Array
* @protected
*/
_defaultLineColors:["#426ab3", "#d09b2c", "#000000", "#b82837", "#b384b5", "#ff7200", "#779de3", "#cbc8ba", "#7ed7a6", "#007a6c"],
/**
* Collection of default colors used for marker fills in a series when not specified by user.
*
* @property _defaultFillColors
* @type Array
* @protected
*/
_defaultFillColors:["#6084d0", "#eeb647", "#6c6b5f", "#d6484f", "#ce9ed1", "#ff9f3b", "#93b7ff", "#e0ddd0", "#94ecba", "#309687"],
/**
* Collection of default colors used for marker borders in a series when not specified by user.
*
* @property _defaultBorderColors
* @type Array
* @protected
*/
_defaultBorderColors:["#205096", "#b38206", "#000000", "#94001e", "#9d6fa0", "#e55b00", "#5e85c9", "#adab9e", "#6ac291", "#006457"],
/**
* Collection of default colors used for area fills, histogram fills and pie fills in a series when not specified by user.
*
* @property _defaultSliceColors
* @type Array
* @protected
*/
_defaultSliceColors: ["#66007f", "#a86f41", "#295454", "#996ab2", "#e8cdb7", "#90bdbd","#000000","#c3b8ca", "#968373", "#678585"],
/**
* Parses a color based on a series order and type.
*
* @method _getDefaultColor
* @param {Number} index Index indicating the series order.
* @param {String} type Indicates which type of object needs the color.
* @return String
* @protected
*/
{
var colors = {
line: this._defaultLineColors,
fill: this._defaultFillColors,
border: this._defaultBorderColors,
slice: this._defaultSliceColors
},
if(index >= l)
{
}
},
/**
*
* @method _handleVisibleChange
* @param {Object} e Event object.
* @protected
*/
_handleVisibleChange: function(e)
{
}
}, {
ATTRS: {
/**
* Name used for for displaying data related to the x-coordinate.
*
* @attribute xDisplayName
* @type String
*/
xDisplayName: {
getter: function()
{
},
{
return val;
}
},
/**
* Name used for for displaying data related to the y-coordinate.
*
* @attribute yDisplayName
* @type String
*/
yDisplayName: {
getter: function()
{
},
{
return val;
}
},
/**
* Name used for for displaying category data
*
* @attribute categoryDisplayName
* @type String
* @readOnly
*/
readOnly: true,
getter: function()
{
}
},
/**
* Name used for for displaying value data
*
* @attribute valueDisplayName
* @type String
* @readOnly
*/
readOnly: true,
getter: function()
{
}
},
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default cartesian
*/
type: {
value: "cartesian"
},
/**
* Order of this instance of this `type`.
*
* @attribute order
* @type Number
*/
order: {},
/**
* Order of the instance
*
* @attribute graphOrder
* @type Number
*/
graphOrder: {},
/**
* x coordinates for the series.
*
* @attribute xcoords
* @type Array
*/
xcoords: {},
/**
* y coordinates for the series
*
* @attribute ycoords
* @type Array
*/
ycoords: {},
/**
* Reference to the `Chart` application.
*
* @attribute chart
* @type ChartBase
* @readOnly
*/
chart: {
readOnly: true,
getter: function()
{
}
},
/**
* Reference to the `Graph` in which the series is drawn into.
*
* @attribute graph
* @type Graph
*/
graph: {},
/**
* Reference to the `Axis` instance used for assigning
* x-values to the graph.
*
* @attribute xAxis
* @type Axis
*/
xAxis: {},
/**
* Reference to the `Axis` instance used for assigning
* y-values to the graph.
*
* @attribute yAxis
* @type Axis
*/
yAxis: {},
/**
* Indicates which array to from the hash of value arrays in
* the x-axis `Axis` instance.
*
* @attribute xKey
* @type String
*/
xKey: {
{
}
},
/**
* Indicates which array to from the hash of value arrays in
* the y-axis `Axis` instance.
*
* @attribute yKey
* @type String
*/
yKey: {
{
}
},
/**
* Array of x values for the series.
*
* @attribute xData
* @type Array
*/
xData: {},
/**
* Array of y values for the series.
*
* @attribute yData
* @type Array
*/
yData: {},
/**
* Indicates whether the Series has been through its initial set up.
*
* @attribute rendered
* @type Boolean
*/
rendered: {
value: false
},
/*
* Returns the width of the parent graph
*
* @attribute width
* @type Number
*/
width: {
readOnly: true,
getter: function()
{
}
},
/**
* Returns the height of the parent graph
*
* @attribute height
* @type Number
*/
height: {
readOnly: true,
getter: function()
{
}
},
/**
* Indicates whether to show the series
*
* @attribute visible
* @type Boolean
* @default true
*/
visible: {
value: true
},
/**
* Collection of area maps along the xAxis. Used to determine mouseover for multiple
* series.
*
* @attribute xMarkerPlane
* @type Array
*/
xMarkerPlane: {},
/**
* Collection of area maps along the yAxis. Used to determine mouseover for multiple
* series.
*
* @attribute yMarkerPlane
* @type Array
*/
yMarkerPlane: {},
/**
*
* @attribute xMarkerPlaneOffset
* @type Number
*/
getter: function() {
{
}
return this._defaultPlaneOffset;
}
},
/**
*
* @attribute yMarkerPlaneOffset
* @type Number
*/
getter: function() {
{
}
return this._defaultPlaneOffset;
}
},
/**
* Direction of the series
*
* @attribute direction
* @type String
*/
direction: {
value: "horizontal"
}
}
});
/**
* The MarkerSeries class renders quantitative data by plotting relevant data points
* on a graph.
*
* @module charts
* @class MarkerSeries
* @extends CartesianSeries
* @uses Plots
* @constructor
*/
/**
* @protected
*
* Draws the series.
*
* @method drawSeries
*/
drawSeries: function()
{
this.drawPlots();
},
/**
* @protected
*
* Method used by `styles` setter. Overrides base implementation.
*
* @method _setStyles
* @param {Object} newStyles Hash of properties to update.
* @return Object
*/
_setStyles: function(val)
{
{
}
},
/**
* @protected
*
* Gets the default value for the `styles` attribute. Overrides
* base implementation.
*
* @method _getDefaultStyles
* @return Object
*/
_getDefaultStyles: function()
{
var styles = this._mergeStyles({marker:this._getPlotDefaults()}, Y.MarkerSeries.superclass._getDefaultStyles());
return styles;
}
},{
ATTRS : {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default marker
*/
type: {
value:"marker"
}
/**
* Style properties used for drawing markers. This attribute is inherited from `Renderer`. Below are the default values:
* <dl>
* <dt>fill</dt><dd>A hash containing the following values:
* <dl>
* <dt>color</dt><dd>Color of the fill. The default value is determined by the order of the series on the graph. The color
* will be retrieved from the below array:<br/>
* `["#6084d0", "#eeb647", "#6c6b5f", "#d6484f", "#ce9ed1", "#ff9f3b", "#93b7ff", "#e0ddd0", "#94ecba", "#309687"]`
* </dd>
* <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the marker fill. The default value is 1.</dd>
* </dl>
* </dd>
* <dt>border</dt><dd>A hash containing the following values:
* <dl>
* <dt>color</dt><dd>Color of the border. The default value is determined by the order of the series on the graph. The color
* will be retrieved from the below array:<br/>
* `["#205096", "#b38206", "#000000", "#94001e", "#9d6fa0", "#e55b00", "#5e85c9", "#adab9e", "#6ac291", "#006457"]`
* <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the marker border. The default value is 1.</dd>
* <dt>weight</dt><dd>Number indicating the width of the border. The default value is 1.</dd>
* </dl>
* </dd>
* <dt>width</dt><dd>indicates the width of the marker. The default value is 10.</dd>
* <dt>height</dt><dd>indicates the height of the marker The default value is 10.</dd>
* <dt>over</dt><dd>hash containing styles for markers when highlighted by a `mouseover` event. The default
* values for each style is null. When an over style is not set, the non-over value will be used. For example,
* the default value for `marker.over.fill.color` is equivalent to `marker.fill.color`.</dd>
* </dl>
*
* @attribute styles
* @type Object
*/
}
});
/**
* The LineSeries class renders quantitative data on a graph by connecting relevant data points.
*
* @module charts
* @class LineSeries
* @extends CartesianSeries
* @uses Lines
* @constructor
*/
/**
* @protected
*
* @method drawSeries
*/
drawSeries: function()
{
this.drawLines();
},
/**
* @protected
*
* Method used by `styles` setter. Overrides base implementation.
*
* @method _setStyles
* @param {Object} newStyles Hash of properties to update.
* @return Object
*/
_setStyles: function(val)
{
{
}
},
/**
* @protected
*
* Gets the default value for the `styles` attribute. Overrides
* base implementation.
*
* @method _getDefaultStyles
* @return Object
*/
_getDefaultStyles: function()
{
var styles = this._mergeStyles({line:this._getLineDefaults()}, Y.LineSeries.superclass._getDefaultStyles());
return styles;
}
},
{
ATTRS: {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default line
*/
type: {
value:"line"
}
/**
* Style properties used for drawing lines. This attribute is inherited from `Renderer`. Below are the default values:
* <dl>
* <dt>color</dt><dd>The color of the line. The default value is determined by the order of the series on the graph. The color will be
* retrieved from the following array:
* `["#426ab3", "#d09b2c", "#000000", "#b82837", "#b384b5", "#ff7200", "#779de3", "#cbc8ba", "#7ed7a6", "#007a6c"]`
* <dt>weight</dt><dd>Number that indicates the width of the line. The default value is 6.</dd>
* <dt>alpha</dt><dd>Number between 0 and 1 that indicates the opacity of the line. The default value is 1.</dd>
* <dt>lineType</dt><dd>Indicates whether the line is solid or dashed. The default value is solid.</dd>
* <dt>dashLength</dt><dd>When the `lineType` is dashed, indicates the length of the dash. The default value is 10.</dd>
* <dt>gapSpace</dt><dd>When the `lineType` is dashed, indicates the distance between dashes. The default value is 10.</dd>
* <dt>connectDiscontinuousPoints</dt><dd>Indicates whether or not to connect lines when there is a missing or null value between points. The default value is true.</dd>
* <dt>discontinuousType</dt><dd>Indicates whether the line between discontinuous points is solid or dashed. The default value is solid.</dd>
* <dt>discontinuousDashLength</dt><dd>When the `discontinuousType` is dashed, indicates the length of the dash. The default value is 10.</dd>
* <dt>discontinuousGapSpace</dt><dd>When the `discontinuousType` is dashed, indicates the distance between dashes. The default value is 10.</dd>
* </dl>
*
* @attribute styles
* @type Object
*/
}
});
/**
* SplineSeries renders a graph with data points connected by a curve.
*
* @module charts
* @class SplineSeries
* @constructor
* @extends CartesianSeries
* @uses CurveUtil
* @uses Lines
*/
/**
* @protected
*
* Draws the series.
*
* @method drawSeries
*/
drawSeries: function()
{
this.drawSpline();
}
}, {
ATTRS : {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default spline
*/
type : {
value:"spline"
}
/**
* Style properties used for drawing lines. This attribute is inherited from `Renderer`. Below are the default values:
* <dl>
* <dt>color</dt><dd>The color of the line. The default value is determined by the order of the series on the graph. The color will be
* retrieved from the following array:
* `["#426ab3", "#d09b2c", "#000000", "#b82837", "#b384b5", "#ff7200", "#779de3", "#cbc8ba", "#7ed7a6", "#007a6c"]`
* <dt>weight</dt><dd>Number that indicates the width of the line. The default value is 6.</dd>
* <dt>alpha</dt><dd>Number between 0 and 1 that indicates the opacity of the line. The default value is 1.</dd>
* <dt>lineType</dt><dd>Indicates whether the line is solid or dashed. The default value is solid.</dd>
* <dt>dashLength</dt><dd>When the `lineType` is dashed, indicates the length of the dash. The default value is 10.</dd>
* <dt>gapSpace</dt><dd>When the `lineType` is dashed, indicates the distance between dashes. The default value is 10.</dd>
* <dt>connectDiscontinuousPoints</dt><dd>Indicates whether or not to connect lines when there is a missing or null value between points. The default value is true.</dd>
* <dt>discontinuousType</dt><dd>Indicates whether the line between discontinuous points is solid or dashed. The default value is solid.</dd>
* <dt>discontinuousDashLength</dt><dd>When the `discontinuousType` is dashed, indicates the length of the dash. The default value is 10.</dd>
* <dt>discontinuousGapSpace</dt><dd>When the `discontinuousType` is dashed, indicates the distance between dashes. The default value is 10.</dd>
* </dl>
*
* @attribute styles
* @type Object
*/
}
});
/**
* AreaSplineSeries renders an area graph with data points connected by a curve.
*
* @module charts
* @class AreaSplineSeries
* @constructor
* @extends CartesianSeries
* @uses Fills
* @uses CurveUtil
*/
/**
* @protected
*
* Draws the series.
*
* @method drawSeries
*/
drawSeries: function()
{
this.drawAreaSpline();
}
}, {
ATTRS : {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default areaSpline
*/
type: {
value:"areaSpline"
}
/**
* Style properties used for drawing area fills. This attribute is inherited from `Renderer`. Below are the default values:
*
* <dl>
* <dt>color</dt><dd>The color of the fill. The default value is determined by the order of the series on the graph. The color will be
* retrieved from the following array:
* `["#66007f", "#a86f41", "#295454", "#996ab2", "#e8cdb7", "#90bdbd","#000000","#c3b8ca", "#968373", "#678585"]`
* </dd>
* <dt>alpha</dt><dd>Number between 0 and 1 that indicates the opacity of the fill. The default value is 1</dd>
* </dl>
*
* @attribute styles
* @type Object
*/
}
});
/**
* StackedSplineSeries creates spline graphs in which the different series are stacked along a value axis
* to indicate their contribution to a cumulative total.
*
* @module charts
* @class StackedSplineSeries
* @constructor
* @extends SplineSeries
* @extends StackingUtil
*/
/**
* @protected
*
* Calculates the coordinates for the series. Overrides base implementation.
*
* @method setAreaData
*/
setAreaData: function()
{
this._stackCoordinates.apply(this);
}
}, {
ATTRS: {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default stackedSpline
*/
type: {
value:"stackedSpline"
}
}
});
/**
* StackedMarkerSeries plots markers with different series stacked along the value axis to indicate each
* series' contribution to a cumulative total.
*
* @module charts
* @class StackedMarkerSeries
* @constructor
* @extends MarkerSeries
* @extends StackingUtil
*/
/**
* @protected
*
* Calculates the coordinates for the series. Overrides base implementation.
*
* @method setAreaData
*/
setAreaData: function()
{
this._stackCoordinates.apply(this);
}
}, {
ATTRS: {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default stackedMarker
*/
type: {
value:"stackedMarker"
}
}
});
/**
* The ColumnSeries class renders columns positioned horizontally along a category or time axis. The columns'
* lengths are proportional to the values they represent along a vertical axis.
* and the relevant data points.
*
* @module charts
* @class ColumnSeries
* @extends MarkerSeries
* @uses Histogram
* @constructor
*/
/**
* Helper method for calculating the size of markers.
*
* @method _getMarkerDimensions
* @param {Number} xcoord The x-coordinate representing the data point for the marker.
* @param {Number} ycoord The y-coordinate representing the data point for the marker.
* @param {Number} calculatedSize The calculated size for the marker. For a `BarSeries` is it the width. For a `ColumnSeries` it is the height.
* @param {Number} offset Distance of position offset dictated by other marker series in the same graph.
* @return Object
* @private
*/
{
var config = {
};
if(this._bottomOrigin >= ycoord)
{
}
else
{
}
return config;
},
/**
* Resizes and positions markers based on a mouse interaction.
*
* @method updateMarkerState
* @param {String} type state of the marker
* @param {Number} i index of the marker
* @protected
*/
updateMarkerState: function(type, i)
{
if(this._markers[i])
{
seriesSize = 0,
offset = 0,
n = 0,
xs = [],
for(; n < seriesLen; ++n)
{
if(order > n)
{
offset = seriesSize;
}
}
for(n = 0; n < seriesLen; ++n)
{
if(markers)
{
{
}
}
}
}
}
}, {
ATTRS: {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @readOnly
* @default column
*/
type: {
value: "column"
}
/**
* Style properties used for drawing markers. This attribute is inherited from `MarkerSeries`. Below are the default values:
* <dl>
* <dt>fill</dt><dd>A hash containing the following values:
* <dl>
* <dt>color</dt><dd>Color of the fill. The default value is determined by the order of the series on the graph. The color
* will be retrieved from the below array:<br/>
* `["#66007f", "#a86f41", "#295454", "#996ab2", "#e8cdb7", "#90bdbd","#000000","#c3b8ca", "#968373", "#678585"]`
* </dd>
* <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the marker fill. The default value is 1.</dd>
* </dl>
* </dd>
* <dt>border</dt><dd>A hash containing the following values:
* <dl>
* <dt>color</dt><dd>Color of the border. The default value is determined by the order of the series on the graph. The color
* will be retrieved from the below array:<br/>
* `["#205096", "#b38206", "#000000", "#94001e", "#9d6fa0", "#e55b00", "#5e85c9", "#adab9e", "#6ac291", "#006457"]`
* <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the marker border. The default value is 1.</dd>
* <dt>weight</dt><dd>Number indicating the width of the border. The default value is 1.</dd>
* </dl>
* </dd>
* <dt>width</dt><dd>indicates the width of the marker. The default value is 12.</dd>
* <dt>over</dt><dd>hash containing styles for markers when highlighted by a `mouseover` event. The default
* values for each style is null. When an over style is not set, the non-over value will be used. For example,
* the default value for `marker.over.fill.color` is equivalent to `marker.fill.color`.</dd>
* </dl>
*
* @attribute styles
* @type Object
*/
}
});
/**
* The BarSeries class renders bars positioned vertically along a category or time axis. The bars'
* lengths are proportional to the values they represent along a horizontal axis.
* and the relevant data points.
*
* @module charts
* @class BarSeries
* @extends MarkerSeries
* @uses Histogram
* @constructor
*/
/**
* Helper method for calculating the size of markers.
*
* @method _getMarkerDimensions
* @param {Number} xcoord The x-coordinate representing the data point for the marker.
* @param {Number} ycoord The y-coordinate representing the data point for the marker.
* @param {Number} calculatedSize The calculated size for the marker. For a `BarSeries` is it the width. For a `ColumnSeries` it is the height.
* @param {Number} offset Distance of position offset dictated by other marker series in the same graph.
* @return Object
* @private
*/
{
var config = {
};
if(xcoord >= this._leftOrigin)
{
}
else
{
}
return config;
},
/**
* Resizes and positions markers based on a mouse interaction.
*
* @method updateMarkerState
* @param {String} type state of the marker
* @param {Number} i index of the marker
* @protected
*/
updateMarkerState: function(type, i)
{
if(this._markers[i])
{
seriesSize = 0,
offset = 0,
n = 0,
ys = [],
for(; n < seriesLen; ++n)
{
if(order > n)
{
offset = seriesSize;
}
}
for(n = 0; n < seriesLen; ++n)
{
if(markers)
{
{
}
}
}
}
}
}, {
ATTRS: {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default bar
*/
type: {
value: "bar"
},
/**
* Indicates the direction of the category axis that the bars are plotted against.
*
* @attribute direction
* @type String
*/
direction: {
value: "vertical"
}
/**
* Style properties used for drawing markers. This attribute is inherited from `MarkerSeries`. Below are the default values:
* <dl>
* <dt>fill</dt><dd>A hash containing the following values:
* <dl>
* <dt>color</dt><dd>Color of the fill. The default value is determined by the order of the series on the graph. The color
* will be retrieved from the below array:<br/>
* `["#66007f", "#a86f41", "#295454", "#996ab2", "#e8cdb7", "#90bdbd","#000000","#c3b8ca", "#968373", "#678585"]`
* </dd>
* <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the marker fill. The default value is 1.</dd>
* </dl>
* </dd>
* <dt>border</dt><dd>A hash containing the following values:
* <dl>
* <dt>color</dt><dd>Color of the border. The default value is determined by the order of the series on the graph. The color
* will be retrieved from the below array:<br/>
* `["#205096", "#b38206", "#000000", "#94001e", "#9d6fa0", "#e55b00", "#5e85c9", "#adab9e", "#6ac291", "#006457"]`
* <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the marker border. The default value is 1.</dd>
* <dt>weight</dt><dd>Number indicating the width of the border. The default value is 1.</dd>
* </dl>
* </dd>
* <dt>height</dt><dd>indicates the width of the marker. The default value is 12.</dd>
* <dt>over</dt><dd>hash containing styles for markers when highlighted by a `mouseover` event. The default
* values for each style is null. When an over style is not set, the non-over value will be used. For example,
* the default value for `marker.over.fill.color` is equivalent to `marker.fill.color`.</dd>
* </dl>
*
* @attribute styles
* @type Object
*/
}
});
/**
* The AreaSeries class renders quantitative data on a graph by creating a fill between 0
* and the relevant data points.
*
* @module charts
* @class AreaSeries
* @extends CartesianSeries
* @uses Fills
* @constructor
*/
/**
* @protected
*
* Renders the series.
*
* @method drawSeries
*/
drawSeries: function()
{
},
/**
* @protected
*
* Method used by `styles` setter. Overrides base implementation.
*
* @method _setStyles
* @param {Object} newStyles Hash of properties to update.
* @return Object
*/
_setStyles: function(val)
{
{
}
},
/**
* @protected
*
* Gets the default value for the `styles` attribute. Overrides
* base implementation.
*
* @method _getDefaultStyles
* @return Object
*/
_getDefaultStyles: function()
{
var styles = this._mergeStyles({area:this._getAreaDefaults()}, Y.AreaSeries.superclass._getDefaultStyles());
return styles;
}
},
{
ATTRS: {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default area
*/
type: {
value:"area"
}
/**
* Style properties used for drawing area fills. This attribute is inherited from `Renderer`. Below are the default values:
*
* <dl>
* <dt>color</dt><dd>The color of the fill. The default value is determined by the order of the series on the graph. The color will be
* retrieved from the following array:
* `["#66007f", "#a86f41", "#295454", "#996ab2", "#e8cdb7", "#90bdbd","#000000","#c3b8ca", "#968373", "#678585"]`
* </dd>
* <dt>alpha</dt><dd>Number between 0 and 1 that indicates the opacity of the fill. The default value is 1</dd>
* </dl>
*
* @attribute styles
* @type Object
*/
}
});
/**
* StackedAreaSplineSeries creates a stacked area chart with points data points connected by a curve.
*
* @module charts
* @class StackedAreaSplineSeries
* @constructor
* @extends AreaSeries
* @uses CurveUtil
* @uses StackingUtil
*/
Y.StackedAreaSplineSeries = Y.Base.create("stackedAreaSplineSeries", Y.AreaSeries, [Y.CurveUtil, Y.StackingUtil], {
/**
* @protected
*
* Draws the series.
*
* @method drawSeries
*/
drawSeries: function()
{
this._stackCoordinates();
this.drawStackedAreaSpline();
}
}, {
ATTRS : {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default stackedAreaSpline
*/
type: {
value:"stackedAreaSpline"
}
}
});
/**
* The ComboSeries class renders a combination of lines, plots and area fills in a single series. Each
* series type has a corresponding boolean attribute indicating if it is rendered. By default, lines and plots
* are rendered and area is not.
*
* @module charts
* @class ComboSeries
* @extends CartesianSeries
* @uses Fills
* @uses Lines
* @uses Plots
* @constructor
*/
/**
* @protected
*
* Draws the series.
*
* @method drawSeries
*/
drawSeries: function()
{
if(this.get("showAreaFill"))
{
}
if(this.get("showLines"))
{
this.drawLines();
}
if(this.get("showMarkers"))
{
this.drawPlots();
}
},
/**
* Toggles visibility
*
* @method _toggleVisible
* @param {Boolean} visible indicates visibilitye
* @private
*/
_toggleVisible: function(visible)
{
var markers,
len,
i;
{
}
if(this.get("showLines"))
{
}
if(this.get("showMarkers"))
{
if(markers)
{
i = 0;
for(; i < len; ++i)
{
if(marker)
{
}
}
}
}
},
/**
* @protected
*
* Returns the default hash for the `styles` attribute.
*
* @method _getDefaultStyles
* @return Object
*/
_getDefaultStyles: function()
{
return styles;
}
},
{
ATTRS: {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default combo
*/
type: {
value:"combo"
},
/**
* Indicates whether a fill is displayed.
*
* @attribute showAreaFill
* @type Boolean
* @default false
*/
showAreaFill: {
value: false
},
/**
* Indicates whether lines are displayed.
*
* @attribute showLines
* @type Boolean
* @default true
*/
showLines: {
value: true
},
/**
* Indicates whether markers are displayed.
*
* @attribute showMarkers
* @type Boolean
* @default true
*/
showMarkers: {
value: true
},
/**
* Reference to the styles of the markers. These styles can also
* be accessed through the `styles` attribute. Below are default
* values:
* <dl>
* <dt>fill</dt><dd>A hash containing the following values:
* <dl>
* <dt>color</dt><dd>Color of the fill. The default value is determined by the order of the series on the graph. The color
* will be retrieved from the below array:<br/>
* `["#6084d0", "#eeb647", "#6c6b5f", "#d6484f", "#ce9ed1", "#ff9f3b", "#93b7ff", "#e0ddd0", "#94ecba", "#309687"]`
* </dd>
* <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the marker fill. The default value is 1.</dd>
* </dl>
* </dd>
* <dt>border</dt><dd>A hash containing the following values:
* <dl>
* <dt>color</dt><dd>Color of the border. The default value is determined by the order of the series on the graph. The color
* will be retrieved from the below array:<br/>
* `["#205096", "#b38206", "#000000", "#94001e", "#9d6fa0", "#e55b00", "#5e85c9", "#adab9e", "#6ac291", "#006457"]`
* <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the marker border. The default value is 1.</dd>
* <dt>weight</dt><dd>Number indicating the width of the border. The default value is 1.</dd>
* </dl>
* </dd>
* <dt>width</dt><dd>indicates the width of the marker. The default value is 10.</dd>
* <dt>height</dt><dd>indicates the height of the marker The default value is 10.</dd>
* <dt>over</dt><dd>hash containing styles for markers when highlighted by a `mouseover` event. The default
* values for each style is null. When an over style is not set, the non-over value will be used. For example,
* the default value for `marker.over.fill.color` is equivalent to `marker.fill.color`.</dd>
* </dl>
*
* @attribute marker
* @type Object
*/
marker: {
lazyAdd: false,
getter: function()
{
},
{
}
},
/**
* Reference to the styles of the lines. These styles can also be accessed through the `styles` attribute.
* Below are the default values:
* <dl>
* <dt>color</dt><dd>The color of the line. The default value is determined by the order of the series on the graph. The color will be
* retrieved from the following array:
* `["#426ab3", "#d09b2c", "#000000", "#b82837", "#b384b5", "#ff7200", "#779de3", "#cbc8ba", "#7ed7a6", "#007a6c"]`
* <dt>weight</dt><dd>Number that indicates the width of the line. The default value is 6.</dd>
* <dt>alpha</dt><dd>Number between 0 and 1 that indicates the opacity of the line. The default value is 1.</dd>
* <dt>lineType</dt><dd>Indicates whether the line is solid or dashed. The default value is solid.</dd>
* <dt>dashLength</dt><dd>When the `lineType` is dashed, indicates the length of the dash. The default value is 10.</dd>
* <dt>gapSpace</dt><dd>When the `lineType` is dashed, indicates the distance between dashes. The default value is 10.</dd>
* <dt>connectDiscontinuousPoints</dt><dd>Indicates whether or not to connect lines when there is a missing or null value between points. The default value is true.</dd>
* <dt>discontinuousType</dt><dd>Indicates whether the line between discontinuous points is solid or dashed. The default value is solid.</dd>
* <dt>discontinuousDashLength</dt><dd>When the `discontinuousType` is dashed, indicates the length of the dash. The default value is 10.</dd>
* <dt>discontinuousGapSpace</dt><dd>When the `discontinuousType` is dashed, indicates the distance between dashes. The default value is 10.</dd>
* </dl>
*
* @attribute line
* @type Object
*/
line: {
lazyAdd: false,
getter: function()
{
},
{
}
},
/**
* Reference to the styles of the area fills. These styles can also be accessed through the `styles` attribute.
* Below are the default values:
*
* <dl>
* <dt>color</dt><dd>The color of the fill. The default value is determined by the order of the series on the graph. The color will be
* retrieved from the following array:
* `["#66007f", "#a86f41", "#295454", "#996ab2", "#e8cdb7", "#90bdbd","#000000","#c3b8ca", "#968373", "#678585"]`
* </dd>
* <dt>alpha</dt><dd>Number between 0 and 1 that indicates the opacity of the fill. The default value is 1</dd>
* </dl>
*
* @attribute area
* @type Object
*/
area: {
lazyAdd: false,
getter: function()
{
},
{
}
}
/**
* Style properties for the series. Contains a key indexed hash of the following:
* <dl>
* <dt>marker</dt><dd>Style properties for the markers in the series. Specific style attributes are listed
* <a href="#attr_marker">here</a>.</dd>
* <dt>line</dt><dd>Style properties for the lines in the series. Specific
* style attributes are listed <a href="#attr_line">here</a>.</dd>
* <dt>area</dt><dd>Style properties for the area fills in the series. Specific style attributes are listed
* <a href="#attr_area">here</a>.</dd>
* </dl>
*
* @attribute styles
* @type Object
*/
}
});
/**
* The StackedComboSeries class renders a combination of lines, plots and area fills in a single series. Series
* are stacked along the value axis to indicate each series contribution to a cumulative total. Each
* series type has a corresponding boolean attribute indicating if it is rendered. By default, all three types are
* rendered.
*
* @module charts
* @class StackedComboSeries
* @extends ComboSeries
* @uses StackingUtil
* @constructor
*/
/**
* @protected
*
* Calculates the coordinates for the series. Overrides base implementation.
*
* @method setAreaData
*/
setAreaData: function()
{
this._stackCoordinates.apply(this);
},
/**
* @protected
*
* Draws the series.
*
* @method drawSeries
*/
drawSeries: function()
{
if(this.get("showAreaFill"))
{
}
if(this.get("showLines"))
{
this.drawLines();
}
if(this.get("showMarkers"))
{
this.drawPlots();
}
}
}, {
ATTRS : {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default stackedCombo
*/
type: {
value: "stackedCombo"
},
/**
* Indicates whether a fill is displayed.
*
* @attribute showAreaFill
* @type Boolean
* @default true
*/
showAreaFill: {
value: true
}
}
});
/**
* The ComboSplineSeries class renders a combination of splines, plots and areaspline fills in a single series. Each
* series type has a corresponding boolean attribute indicating if it is rendered. By default, splines and plots
* are rendered and areaspline is not.
*
* @module charts
* @class ComboSplineSeries
* @extends ComboSeries
* @extends CurveUtil
* @constructor
*/
/**
* @protected
*
* Draws the series.
*
* @method drawSeries
*/
drawSeries: function()
{
if(this.get("showAreaFill"))
{
this.drawAreaSpline();
}
if(this.get("showLines"))
{
this.drawSpline();
}
if(this.get("showMarkers"))
{
this.drawPlots();
}
}
}, {
ATTRS: {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default comboSpline
*/
type: {
value : "comboSpline"
}
}
});
/**
* The StackedComboSplineSeries class renders a combination of splines, plots and areaspline fills in a single series. Series
* are stacked along the value axis to indicate each series contribution to a cumulative total. Each
* series type has a corresponding boolean attribute indicating if it is rendered. By default, all three types are
* rendered.
*
* @module charts
* @class StackedComboSplineSeries
* @extends StackedComboSeries
* @uses CurveUtil
* @constructor
*/
Y.StackedComboSplineSeries = Y.Base.create("stackedComboSplineSeries", Y.StackedComboSeries, [Y.CurveUtil], {
/**
* @protected
*
* Draws the series.
*
* @method drawSeries
*/
drawSeries: function()
{
if(this.get("showAreaFill"))
{
this.drawStackedAreaSpline();
}
if(this.get("showLines"))
{
this.drawSpline();
}
if(this.get("showMarkers"))
{
this.drawPlots();
}
}
}, {
ATTRS: {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default stackedComboSpline
*/
type : {
value : "stackedComboSpline"
},
/**
* Indicates whether a fill is displayed.
*
* @attribute showAreaFill
* @type Boolean
* @default true
*/
showAreaFill: {
value: true
}
}
});
/**
* StackedLineSeries creates line graphs in which the different series are stacked along a value axis
* to indicate their contribution to a cumulative total.
*
* @module charts
* @class StackedLineSeries
* @constructor
* @extends LineSeries
* @uses StackingUtil
*/
/**
* @protected
*
* Calculates the coordinates for the series. Overrides base implementation.
*
* @method setAreaData
*/
setAreaData: function()
{
this._stackCoordinates.apply(this);
}
}, {
ATTRS: {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default stackedLine
*/
type: {
value:"stackedLine"
}
}
});
/**
* StackedAreaSeries area fills to display data showing its contribution to a whole.
*
* @module charts
* @class StackedAreaSeries
* @constructor
* @param {Object} config (optional) Configuration parameters for the Chart.
* @extends AreaSeries
* @uses StackingUtil
*/
/**
* @protected
*
* Calculates the coordinates for the series. Overrides base implementation.
*
* @method setAreaData
*/
setAreaData: function()
{
this._stackCoordinates.apply(this);
},
/**
* @protected
*
* Draws the series
*
* @method drawSeries
*/
drawSeries: function()
{
}
}, {
ATTRS: {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default stackedArea
*/
type: {
value:"stackedArea"
}
}
});
/**
* The StackedColumnSeries renders column chart in which series are stacked vertically to show
* their contribution to the cumulative total.
*
* @module charts
* @class StackedColumnSeries
* @extends ColumnSeries
* @uses StackingUtil
* @constructor
*/
/**
* Draws the series.
*
* @method drawSeries
* @protected
*/
drawSeries: function()
{
{
return;
}
i = 0,
left,
totalWidth = len * w;
{
}
{
}
this._createMarkerCache();
{
w *= ratio;
w = Math.max(w, 1);
}
if(!useOrigin)
{
if(!negativeBaseValues || !positiveBaseValues)
{
useOrigin = true;
positiveBaseValues = [];
negativeBaseValues = [];
}
}
else
{
negativeBaseValues = [];
positiveBaseValues = [];
}
for(i = 0; i < len; ++i)
{
{
if(useOrigin)
{
negativeBaseValues[i] = this._bottomOrigin;
positiveBaseValues[i] = this._bottomOrigin;
}
continue;
}
if(useOrigin)
{
if(top < this._bottomOrigin)
{
positiveBaseValues[i] = top;
negativeBaseValues[i] = this._bottomOrigin;
}
else if(top > this._bottomOrigin)
{
positiveBaseValues[i] = this._bottomOrigin;
negativeBaseValues[i] = top;
top -= h;
}
else
{
positiveBaseValues[i] = top;
negativeBaseValues[i] = top;
}
}
else
{
if(top > this._bottomOrigin)
{
h = top - negativeBaseValues[i];
negativeBaseValues[i] = top;
top -= h;
}
else if(top <= this._bottomOrigin)
{
h = positiveBaseValues[i] - top;
positiveBaseValues[i] = top;
}
}
if(!isNaN(h) && h > 0)
{
left -= w/2;
if(fillColors)
{
}
if(borderColors)
{
}
}
else
{
}
}
this._clearMarkerCache();
},
/**
* Resizes and positions markers based on a mouse interaction.
*
* @method updateMarkerState
* @param {String} type state of the marker
* @param {Number} i index of the marker
* @protected
*/
updateMarkerState: function(type, i)
{
if(this._markers[i])
{
var styles,
offset = 0,
{
}
else
{
}
{
}
else
{
}
}
},
/**
* Gets the default values for the markers.
*
* @method _getPlotDefaults
* @return Object
* @protected
*/
_getPlotDefaults: function()
{
var defs = {
fill:{
type: "solid",
alpha: 1,
colors:null,
alphas: null,
ratios: null
},
border:{
weight: 0,
alpha: 1
},
width: 24,
height: 24,
shape: "rect",
padding:{
top: 0,
left: 0,
right: 0,
bottom: 0
}
};
return defs;
}
}, {
ATTRS: {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default stackedColumn
*/
type: {
value: "stackedColumn"
},
/**
* @attribute negativeBaseValues
* @type Array
* @default null
* @private
*/
value: null
},
/**
* @attribute positiveBaseValues
* @type Array
* @default null
* @private
*/
value: null
}
/**
* Style properties used for drawing markers. This attribute is inherited from `ColumnSeries`. Below are the default values:
* <dl>
* <dt>fill</dt><dd>A hash containing the following values:
* <dl>
* <dt>color</dt><dd>Color of the fill. The default value is determined by the order of the series on the graph. The color
* will be retrieved from the below array:<br/>
* `["#66007f", "#a86f41", "#295454", "#996ab2", "#e8cdb7", "#90bdbd","#000000","#c3b8ca", "#968373", "#678585"]`
* </dd>
* <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the marker fill. The default value is 1.</dd>
* </dl>
* </dd>
* <dt>border</dt><dd>A hash containing the following values:
* <dl>
* <dt>color</dt><dd>Color of the border. The default value is determined by the order of the series on the graph. The color
* will be retrieved from the below array:<br/>
* `["#205096", "#b38206", "#000000", "#94001e", "#9d6fa0", "#e55b00", "#5e85c9", "#adab9e", "#6ac291", "#006457"]`
* <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the marker border. The default value is 1.</dd>
* <dt>weight</dt><dd>Number indicating the width of the border. The default value is 1.</dd>
* </dl>
* </dd>
* <dt>width</dt><dd>indicates the width of the marker. The default value is 24.</dd>
* <dt>over</dt><dd>hash containing styles for markers when highlighted by a `mouseover` event. The default
* values for each style is null. When an over style is not set, the non-over value will be used. For example,
* the default value for `marker.over.fill.color` is equivalent to `marker.fill.color`.</dd>
* </dl>
*
* @attribute styles
* @type Object
*/
}
});
/**
* The StackedBarSeries renders bar chart in which series are stacked horizontally to show
* their contribution to the cumulative total.
*
* @module charts
* @class StackedBarSeries
* @extends BarSeries
* @uses StackingUtil
* @constructor
*/
/**
* @protected
*
* Draws the series.
*
* @method drawSeries
*/
drawSeries: function()
{
{
return;
}
i = 0,
left,
totalHeight = len * h;
{
}
{
}
this._createMarkerCache();
{
h *= ratio;
h = Math.max(h, 1);
}
if(!useOrigin)
{
if(!negativeBaseValues || !positiveBaseValues)
{
useOrigin = true;
positiveBaseValues = [];
negativeBaseValues = [];
}
}
else
{
negativeBaseValues = [];
positiveBaseValues = [];
}
for(i = 0; i < len; ++i)
{
{
if(useOrigin)
{
positiveBaseValues[i] = this._leftOrigin;
negativeBaseValues[i] = this._leftOrigin;
}
continue;
}
if(useOrigin)
{
if(left > this._leftOrigin)
{
positiveBaseValues[i] = left;
negativeBaseValues[i] = this._leftOrigin;
left -= w;
}
else if(left < this._leftOrigin)
{
positiveBaseValues[i] = this._leftOrigin;
negativeBaseValues[i] = left;
}
else
{
positiveBaseValues[i] = left;
negativeBaseValues[i] = this._leftOrigin;
}
}
else
{
if(left < this._leftOrigin)
{
w = negativeBaseValues[i] - left;
negativeBaseValues[i] = left;
}
else if(left >= this._leftOrigin)
{
w = left - positiveBaseValues[i];
positiveBaseValues[i] = left;
left -= w;
}
}
if(!isNaN(w) && w > 0)
{
top -= h/2;
if(fillColors)
{
}
if(borderColors)
{
}
}
else
{
}
}
this._clearMarkerCache();
},
/**
* @protected
*
* Resizes and positions markers based on a mouse interaction.
*
* @method updateMarkerState
* @param {String} type state of the marker
* @param {Number} i index of the marker
*/
updateMarkerState: function(type, i)
{
if(this._markers[i])
{
{
}
else
{
}
{
}
else
{
}
}
},
/**
* @protected
*
* Returns default values for the `styles` attribute.
*
* @method _getPlotDefaults
* @return Object
*/
_getPlotDefaults: function()
{
var defs = {
fill:{
type: "solid",
alpha: 1,
colors:null,
alphas: null,
ratios: null
},
border:{
weight: 0,
alpha: 1
},
width: 24,
height: 24,
shape: "rect",
padding:{
top: 0,
left: 0,
right: 0,
bottom: 0
}
};
return defs;
}
}, {
ATTRS: {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default stackedBar
*/
type: {
value: "stackedBar"
},
/**
* Direction of the series
*
* @attribute direction
* @type String
* @default vertical
*/
direction: {
value: "vertical"
},
/**
* @private
*
* @attribute negativeBaseValues
* @type Array
* @default null
*/
value: null
},
/**
* @private
*
* @attribute positiveBaseValues
* @type Array
* @default null
*/
value: null
}
/**
* Style properties used for drawing markers. This attribute is inherited from `BarSeries`. Below are the default values:
* <dl>
* <dt>fill</dt><dd>A hash containing the following values:
* <dl>
* <dt>color</dt><dd>Color of the fill. The default value is determined by the order of the series on the graph. The color
* will be retrieved from the below array:<br/>
* `["#66007f", "#a86f41", "#295454", "#996ab2", "#e8cdb7", "#90bdbd","#000000","#c3b8ca", "#968373", "#678585"]`
* </dd>
* <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the marker fill. The default value is 1.</dd>
* </dl>
* </dd>
* <dt>border</dt><dd>A hash containing the following values:
* <dl>
* <dt>color</dt><dd>Color of the border. The default value is determined by the order of the series on the graph. The color
* will be retrieved from the below array:<br/>
* `["#205096", "#b38206", "#000000", "#94001e", "#9d6fa0", "#e55b00", "#5e85c9", "#adab9e", "#6ac291", "#006457"]`
* <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the marker border. The default value is 1.</dd>
* <dt>weight</dt><dd>Number indicating the width of the border. The default value is 1.</dd>
* </dl>
* </dd>
* <dt>height</dt><dd>indicates the width of the marker. The default value is 24.</dd>
* <dt>over</dt><dd>hash containing styles for markers when highlighted by a `mouseover` event. The default
* values for each style is null. When an over style is not set, the non-over value will be used. For example,
* the default value for `marker.over.fill.color` is equivalent to `marker.fill.color`.</dd>
* </dl>
*
* @attribute styles
* @type Object
*/
}
});
/**
* PieSeries visualizes data as a circular chart divided into wedges which represent data as a
* percentage of a whole.
*
* @module charts
* @class PieSeries
* @constructor
* @extends MarkerSeries
*/
/**
* Image map used for interactivity when rendered with canvas.
*
* @property _map
* @type HTMLElement
* @private
*/
_map: null,
/**
* Image used for image map when rendered with canvas.
*
* @property _image
* @type HTMLElement
* @private
*/
_image: null,
/**
* Creates or updates the image map when rendered with canvas.
*
* @method _setMap
* @private
*/
_setMap: function()
{
if(this._image)
{
{
}
}
this._image.src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAABCAYAAAD9yd/wAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABJJREFUeNpiZGBgSGPAAgACDAAIkABoFyloZQAAAABJRU5ErkJggg==";
this._areaNodes = [];
},
/**
* Storage for `categoryDisplayName` attribute.
*
* @property _categoryDisplayName
* @private
*/
_categoryDisplayName: null,
/**
* Storage for `valueDisplayName` attribute.
*
* @property _valueDisplayName
* @private
*/
_valueDisplayName: null,
/**
* Adds event listeners.
*
* @method addListeners
* @private
*/
addListeners: function()
{
if(categoryAxis)
{
}
if(valueAxis)
{
}
},
/**
* Draws the series.
*
* @method validate
* @private
*/
validate: function()
{
this.draw();
this._renderered = true;
},
/**
* Event handler for the categoryAxisChange event.
*
* @method _categoryAxisChangeHandler
* @param {Object} e Event object.
* @private
*/
_categoryAxisChangeHandler: function(e)
{
},
/**
* Event handler for the valueAxisChange event.
*
* @method _valueAxisChangeHandler
* @param {Object} e Event object.
* @private
*/
_valueAxisChangeHandler: function(e)
{
},
/**
* Constant used to generate unique id.
*
* @property GUID
* @type String
* @private
*/
GUID: "pieseries",
/**
* Event handler for categoryDataChange event.
*
* @method _categoryDataChangeHandler
* @param {Object} event Event object.
* @private
*/
_categoryDataChangeHandler: function(event)
{
{
this.draw();
}
},
/**
* Event handler for valueDataChange event.
*
* @method _valueDataChangeHandler
* @param {Object} event Event object.
* @private
*/
_valueDataChangeHandler: function(event)
{
{
this.draw();
}
},
/**
* Draws the series. Overrides the base implementation.
*
* @method draw
* @protected
*/
draw: function()
{
{
this._rendered = true;
if(this._drawing)
{
this._callLater = true;
return;
}
this._drawing = true;
this._callLater = false;
this.drawSeries();
this._drawing = false;
if(this._callLater)
{
this.draw();
}
else
{
this.fire("drawingComplete");
}
}
},
/**
* Draws the markers
*
* @method drawPlots
* @protected
*/
drawPlots: function()
{
totalValue = 0,
tfc,
tfa,
startAngle = -90,
halfWidth = w / 2,
halfHeight = h / 2,
i = 0,
angle = 0,
lc,
la,
lw,
for(; i < itemCount; ++i)
{
{
totalValue += value;
}
}
this._createMarkerCache();
if(isCanvas)
{
this._setMap();
}
for(i = 0; i < itemCount; i++)
{
if(totalValue === 0)
{
}
else
{
}
{
}
{
}
{
}
{
}
{
}
startAngle += angle;
wedgeStyle = {
border: {
},
fill: {
},
type: "pieslice",
cy: halfHeight,
width: w,
height: h
};
if(isCanvas)
{
}
}
this._clearMarkerCache();
},
/**
* Adds an interactive map when rendering in canvas.
*
* @method _addHotspot
* @param {Object} cfg Object containing data used to draw the hotspot
* @param {Number} seriesIndex Index of series in the `seriesCollection`.
* @param {Number} index Index of the marker using the hotspot.
* @private
*/
{
i = 1,
for(i = 1; i <= numPoints; ++i)
{
multDivAng = divAngle * i;
if(startAngle <= 90)
{
}
else
{
}
}
},
/**
* Resizes and positions markers based on a mouse interaction.
*
* @method updateMarkerState
* @param {String} type state of the marker
* @param {Number} i index of the marker
* @protected
*/
updateMarkerState: function(type, i)
{
if(this._markers[i])
{
}
},
/**
* Creates a shape to be used as a marker.
*
* @method _createMarker
* @param {Object} styles Hash of style properties.
* @param {Number} order Order of the series.
* @param {Number} index Index within the series associated with the marker.
* @return Shape
* @private
*/
{
return marker;
},
/**
* Creates a cache of markers for reuse.
*
* @method _createMarkerCache
* @private
*/
_clearMarkerCache: function()
{
i = 0,
for(; i < len; ++i)
{
marker = this._markerCache[i];
if(marker)
{
}
}
this._markerCache = [];
},
/**
* Gets the default style values for the markers.
*
* @method _getPlotDefaults
* @return Object
* @private
*/
_getPlotDefaults: function()
{
var defs = {
padding:{
top: 0,
left: 0,
right: 0,
bottom: 0
},
fill:{
alphas:["1"]
},
border: {
weight: 0,
alpha: 1
}
};
return defs;
},
/**
* Collection of default colors used for lines in a series when not specified by user.
*
* @property _defaultLineColors
* @type Array
* @protected
*/
_defaultLineColors:["#426ab3", "#d09b2c", "#000000", "#b82837", "#b384b5", "#ff7200", "#779de3", "#cbc8ba", "#7ed7a6", "#007a6c"],
/**
* Collection of default colors used for marker fills in a series when not specified by user.
*
* @property _defaultFillColors
* @type Array
* @protected
*/
_defaultFillColors:["#6084d0", "#eeb647", "#6c6b5f", "#d6484f", "#ce9ed1", "#ff9f3b", "#93b7ff", "#e0ddd0", "#94ecba", "#309687"],
/**
* Collection of default colors used for marker borders in a series when not specified by user.
*
* @property _defaultBorderColors
* @type Array
* @protected
*/
_defaultBorderColors:["#205096", "#b38206", "#000000", "#94001e", "#9d6fa0", "#e55b00", "#5e85c9", "#adab9e", "#6ac291", "#006457"],
/**
* Collection of default colors used for area fills, histogram fills and pie fills in a series when not specified by user.
*
* @property _defaultSliceColors
* @type Array
* @protected
*/
_defaultSliceColors: ["#66007f", "#a86f41", "#295454", "#996ab2", "#e8cdb7", "#90bdbd","#000000","#c3b8ca", "#968373", "#678585"],
/**
* Colors used if style colors are not specified
*
* @method _getDefaultColor
* @param {Number} index Index indicating the series order.
* @param {String} type Indicates which type of object needs the color.
* @return String
* @protected
*/
{
var colors = {
line: this._defaultLineColors,
fill: this._defaultFillColors,
border: this._defaultBorderColors,
slice: this._defaultSliceColors
},
if(index >= l)
{
}
}
}, {
ATTRS: {
/**
* Read-only attribute indicating the type of series.
*
* @attribute type
* @type String
* @default pie
*/
type: {
value: "pie"
},
/**
* Order of this instance of this `type`.
*
* @attribute order
* @type Number
*/
order: {},
/**
* Reference to the `Graph` in which the series is drawn into.
*
* @attribute graph
* @type Graph
*/
graph: {},
/**
* Reference to the `Axis` instance used for assigning
* category values to the graph.
*
* @attribute categoryAxis
* @type Axis
*/
categoryAxis: {
value: null,
{
}
},
/**
* Reference to the `Axis` instance used for assigning
* series values to the graph.
*
* @attribute categoryAxis
* @type Axis
*/
valueAxis: {
value: null,
{
}
},
/**
* Indicates which array to from the hash of value arrays in
* the category `Axis` instance.
*
* @attribute categoryKey
* @type String
*/
categoryKey: {
value: null,
{
}
},
/**
* Indicates which array to from the hash of value arrays in
* the value `Axis` instance.
*
* @attribute valueKey
* @type String
*/
valueKey: {
value: null,
{
}
},
/**
* Name used for for displaying category data
*
* @attribute categoryDisplayName
* @type String
*/
{
this._categoryDisplayName = val;
return val;
},
getter: function()
{
}
},
/**
* Name used for for displaying value data
*
* @attribute valueDisplayName
* @type String
*/
{
this._valueDisplayName = val;
return val;
},
getter: function()
{
}
},
/**
* @attribute slices
* @type Array
* @private
*/
slices: null
/**
* Style properties used for drawing markers. This attribute is inherited from `MarkerSeries`. Below are the default values:
* <dl>
* <dt>fill</dt><dd>A hash containing the following values:
* <dl>
* <dt>colors</dt><dd>An array of colors to be used for the marker fills. The color for each marker is retrieved from the
* array below:<br/>
* `["#66007f", "#a86f41", "#295454", "#996ab2", "#e8cdb7", "#90bdbd","#000000","#c3b8ca", "#968373", "#678585"]`
* </dd>
* <dt>alphas</dt><dd>An array of alpha references (Number from 0 to 1) indicating the opacity of each marker fill. The default value is [1].</dd>
* </dl>
* </dd>
* <dt>border</dt><dd>A hash containing the following values:
* <dl>
* <dt>color</dt><dd>An array of colors to be used for the marker borders. The color for each marker is retrieved from the
* array below:<br/>
* `["#205096", "#b38206", "#000000", "#94001e", "#9d6fa0", "#e55b00", "#5e85c9", "#adab9e", "#6ac291", "#006457"]`
* <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the marker border. The default value is 1.</dd>
* <dt>weight</dt><dd>Number indicating the width of the border. The default value is 1.</dd>
* </dl>
* </dd>
* <dt>over</dt><dd>hash containing styles for markers when highlighted by a `mouseover` event. The default
* values for each style is null. When an over style is not set, the non-over value will be used. For example,
* the default value for `marker.over.fill.color` is equivalent to `marker.fill.color`.</dd>
* </dl>
*
* @attribute styles
* @type Object
*/
}
});
/**
* Gridlines draws gridlines on a Graph.
*
* @module charts
* @class Gridlines
* @constructor
* @extends Base
* @uses Renderer
*/
/**
* Reference to the `Path` element used for drawing Gridlines.
*
* @property _path
* @type Path
* @private
*/
_path: null,
/**
* Removes the Gridlines.
*
* @method remove
* @private
*/
remove: function()
{
if(path)
{
}
},
/**
* Draws the gridlines
*
* @method draw
* @protected
*/
draw: function()
{
{
this._drawGridlines();
}
},
/**
* Algorithm for drawing gridlines
*
* @method _drawGridlines
* @private
*/
_drawGridlines: function()
{
var path,
i = 0,
l,
if(axisPosition == "none")
{
points = [];
for(; i < l; ++i)
{
points[i] = {
x: w * (i/(l-1)),
y: h * (i/(l-1))
};
}
i = 0;
}
else
{
}
});
for(; i < l; ++i)
{
}
},
/**
* Algorithm for horizontal lines.
*
* @method _horizontalLine
* @param {Path} path Reference to path element
* @param {Object} pt Coordinates corresponding to a major unit of an axis.
* @param {Number} w Width of the Graph
* @param {Number} h Height of the Graph
* @private
*/
{
},
/**
* Algorithm for vertical lines.
*
* @method _verticalLine
* @param {Path} path Reference to path element
* @param {Object} pt Coordinates corresponding to a major unit of an axis.
* @param {Number} w Width of the Graph
* @param {Number} h Height of the Graph
* @private
*/
{
},
/**
* Gets the default value for the `styles` attribute. Overrides
* base implementation.
*
* @method _getDefaultStyles
* @return Object
* @protected
*/
_getDefaultStyles: function()
{
var defs = {
line: {
color:"#f0efe9",
weight: 1,
alpha: 1
}
};
return defs;
}
},
{
ATTRS: {
/**
* Indicates the direction of the gridline.
*
* @attribute direction
* @type String
*/
direction: {},
/**
* Indicate the `Axis` in which to bind
* the gridlines.
*
* @attribute axis
* @type Axis
*/
axis: {},
/**
* Indicates the `Graph` in which the gridlines
* are drawn.
*
* @attribute graph
* @type Graph
*/
graph: {}
}
});
/**
* Graph manages and contains series instances for a `CartesianChart`
* instance.
*
* @module charts
* @class Graph
* @constructor
* @extends Widget
* @uses Renderer
*/
/**
* @method bindUI
* @private
*/
bindUI: function()
{
},
/**
* @method syncUI
* @private
*/
syncUI: function()
{
var background,
cb,
bg,
i = 0,
if(this.get("showBackground"))
{
}
for(; i < len; ++i)
{
if(series instanceof Y.CartesianSeries)
{
}
}
{
}
{
}
},
/**
* Object of arrays containing series mapped to a series type.
*
* @property seriesTypes
* @type Object
* @private
*/
seriesTypes: null,
/**
* Returns a series instance based on an index.
*
* @method getSeriesByIndex
* @param {Number} val index of the series
* @return CartesianSeries
*/
getSeriesByIndex: function(val)
{
{
}
return series;
},
/**
* Returns a series instance based on a key value.
*
* @method getSeriesByKey
* @param {String} val key value of the series
* @return CartesianSeries
*/
getSeriesByKey: function(val)
{
var obj = this._seriesDictionary,
{
}
return series;
},
/**
* Adds dispatcher to a `_dispatcher` used to
* to ensure all series have redrawn before for firing event.
*
* @method addDispatcher
* @param {CartesianSeries} val series instance to add
* @protected
*/
addDispatcher: function(val)
{
if(!this._dispatchers)
{
this._dispatchers = [];
}
},
/**
* Collection of series to be displayed in the graph.
*
* @property _seriesCollection
* @type Array
* @private
*/
_seriesCollection: null,
/**
* Object containing key value pairs of `CartesianSeries` instances.
*
* @property _seriesDictionary
* @type Object
* @private
*/
_seriesDictionary: null,
/**
* Parses series instances to be displayed in the graph.
*
* @method _parseSeriesCollection
* @param {Array} Collection of `CartesianSeries` instances or objects container `CartesianSeries` attributes values.
* @private
*/
_parseSeriesCollection: function(val)
{
if(!val)
{
return;
}
i = 0,
if(!this.get("seriesCollection"))
{
this._seriesCollection = [];
}
if(!this._seriesDictionary)
{
this._seriesDictionary = {};
}
if(!this.seriesTypes)
{
this.seriesTypes = [];
}
for(; i < len; ++i)
{
{
this._createSeries(series);
continue;
}
this._addSeries(series);
}
for(i = 0; i < len; ++i)
{
}
},
/**
* Adds a series to the graph.
*
* @method _addSeries
* @param {CartesianSeries} series Series to add to the graph.
* @private
*/
_addSeries: function(series)
{
seriesTypes = this.seriesTypes,
{
}
{
this.seriesTypes[type] = [];
}
this.addDispatcher(series);
},
/**
* Creates a `CartesianSeries` instance from an object containing attribute key value pairs. The key value pairs include attributes for the specific series and a type value which defines the type of
* series to be used.
*
* @method createSeries
* @param {Object} seriesData Series attribute key value pairs.
* @private
*/
_createSeries: function(seriesData)
{
seriesTypes = this.seriesTypes,
seriesData.graph = this;
{
seriesTypes[type] = [];
}
seriesData.graph = this;
this.addDispatcher(series);
},
/**
* String reference for pre-defined `Series` classes.
*
* @property _seriesMap
* @type Object
* @private
*/
_seriesMap: {
line : Y.LineSeries,
column : Y.ColumnSeries,
area : Y.AreaSeries,
ohlc : Y.OHLCSeries,
markerseries : Y.MarkerSeries,
spline : Y.SplineSeries,
combo : Y.ComboSeries,
},
/**
* Returns a specific `CartesianSeries` class based on key value from a look up table of a direct reference to a class. When specifying a key value, the following options
* are available:
*
* <table>
* <tr><th>Key Value</th><th>Class</th></tr>
* <tr><td>line</td><td>Y.LineSeries</td></tr>
* <tr><td>column</td><td>Y.ColumnSeries</td></tr>
* <tr><td>bar</td><td>Y.BarSeries</td></tr>
* <tr><td>area</td><td>Y.AreaSeries</td></tr>
* <tr><td>stackedarea</td><td>Y.StackedAreaSeries</td></tr>
* <tr><td>stackedline</td><td>Y.StackedLineSeries</td></tr>
* <tr><td>stackedcolumn</td><td>Y.StackedColumnSeries</td></tr>
* <tr><td>stackedbar</td><td>Y.StackedBarSeries</td></tr>
* <tr><td>markerseries</td><td>Y.MarkerSeries</td></tr>
* <tr><td>spline</td><td>Y.SplineSeries</td></tr>
* <tr><td>areaspline</td><td>Y.AreaSplineSeries</td></tr>
* <tr><td>stackedspline</td><td>Y.StackedSplineSeries</td></tr>
* <tr><td>stackedareaspline</td><td>Y.StackedAreaSplineSeries</td></tr>
* <tr><td>stackedmarkerseries</td><td>Y.StackedMarkerSeries</td></tr>
* <tr><td>pie</td><td>Y.PieSeries</td></tr>
* <tr><td>combo</td><td>Y.ComboSeries</td></tr>
* <tr><td>stackedcombo</td><td>Y.StackedComboSeries</td></tr>
* <tr><td>combospline</td><td>Y.ComboSplineSeries</td></tr>
* <tr><td>stackedcombospline</td><td>Y.StackedComboSplineSeries</td></tr>
* </table>
*
* When referencing a class directly, you can specify any of the above classes or any custom class that extends `CartesianSeries` or `PieSeries`.
*
* @method _getSeries
* @param {String | Object} type Series type.
* @return CartesianSeries
* @private
*/
_getSeries: function(type)
{
var seriesClass;
{
}
else
{
seriesClass = type;
}
return seriesClass;
},
/**
* Event handler for marker events.
*
* @method _markerEventHandler
* @param {Object} e Event object.
* @private
*/
_markerEventHandler: function(e)
{
markerNode = e.currentTarget,
},
/**
* Collection of `CartesianSeries` instances to be redrawn.
*
* @property _dispatchers
* @type Array
* @private
*/
_dispatchers: null,
/**
* Updates the `Graph` styles.
*
* @method _updateStyles
* @private
*/
_updateStyles: function()
{
this._sizeChangeHandler();
},
/**
* Event handler for size changes.
*
* @method _sizeChangeHandler
* @param {Object} e Event object.
* @private
*/
_sizeChangeHandler: function(e)
{
w = this.get("width"),
h = this.get("height"),
{
}
if(this.get("showBackground"))
{
if(w && h)
{
}
}
if(this._gridlines)
{
this._gridlines.clear();
}
{
}
{
}
this._drawSeries();
},
/**
* Draws each series.
*
* @method _drawSeries
* @private
*/
_drawSeries: function()
{
if(this._drawing)
{
this._callLater = true;
return;
}
var sc,
i,
len,
this._callLater = false;
this._drawing = true;
i = 0;
for(; i < len; ++i)
{
{
this._callLater = true;
break;
}
}
this._drawing = false;
if(this._callLater)
{
this._drawSeries();
}
},
/**
* Event handler for series drawingComplete event.
*
* @method _drawingCompleteHandler
* @param {Object} e Event object.
* @private
*/
_drawingCompleteHandler: function(e)
{
var series = e.currentTarget,
if(index > -1)
{
}
{
{
}
this.fire("chartRendered");
}
},
/**
* Gets the default value for the `styles` attribute. Overrides
* base implementation.
*
* @method _getDefaultStyles
* @return Object
* @protected
*/
_getDefaultStyles: function()
{
var defs = {
background: {
shape: "rect",
fill:{
color:"#faf9f2"
},
border: {
color:"#dad8c9",
weight: 1
}
}
};
return defs;
}
}, {
ATTRS: {
/**
* Reference to the chart instance using the graph.
*
* @attribute chart
* @type ChartBase
* @readOnly
*/
chart: {},
/**
* Collection of series. When setting the `seriesCollection` the array can contain a combination of either
* `CartesianSeries` instances or object literals with properties that will define a series.
*
* @attribute seriesCollection
* @type CartesianSeries
*/
getter: function()
{
return this._seriesCollection;
},
{
this._parseSeriesCollection(val);
return this._seriesCollection;
}
},
/**
* Indicates whether the `Graph` has a background.
*
* @attribute showBackground
* @type Boolean
* @default true
*/
value: true
},
/**
* Read-only hash lookup for all series on in the `Graph`.
*
* @attribute seriesDictionary
* @type Object
* @readOnly
*/
readOnly: true,
getter: function()
{
return this._seriesDictionary;
}
},
/**
* Reference to the horizontal `Gridlines` instance.
*
* @attribute horizontalGridlines
* @type Gridlines
* @default null
*/
value: null,
{
{
}
{
return val;
}
{
return gl;
}
}
},
/**
* Reference to the vertical `Gridlines` instance.
*
* @attribute verticalGridlines
* @type Gridlines
* @default null
*/
value: null,
{
{
}
{
return val;
}
{
return gl;
}
}
},
/**
* Reference to graphic instance used for the background.
*
* @attribute background
* @type Graphic
* @readOnly
*/
background: {
getter: function()
{
if(!this._background)
{
}
return this._background;
}
},
/**
* Reference to graphic instance used for gridlines.
*
* @attribute gridlines
* @type Graphic
* @readOnly
*/
gridlines: {
readOnly: true,
getter: function()
{
if(!this._gridlines)
{
}
return this._gridlines;
}
},
/**
* Reference to graphic instance used for series.
*
* @attribute graphic
* @type Graphic
* @readOnly
*/
graphic: {
readOnly: true,
getter: function()
{
if(!this._graphic)
{
}
return this._graphic;
}
}
/**
* Style properties used for drawing a background. Below are the default values:
* <dl>
* <dt>background</dt><dd>An object containing the following values:
* <dl>
* <dt>fill</dt><dd>Defines the style properties for the fill. Contains the following values:
* <dl>
* <dt>color</dt><dd>Color of the fill. The default value is #faf9f2.</dd>
* <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the background fill. The default value is 1.</dd>
* </dl>
* </dd>
* <dt>border</dt><dd>Defines the style properties for the border. Contains the following values:
* <dl>
* <dt>color</dt><dd>Color of the border. The default value is #dad8c9.</dd>
* <dt>alpha</dt><dd>Number from 0 to 1 indicating the opacity of the background border. The default value is 1.</dd>
* <dt>weight</dt><dd>Number indicating the width of the border. The default value is 1.</dd>
* </dl>
* </dd>
* </dl>
* </dd>
* </dl>
*
* @attribute styles
* @type Object
*/
}
});
/**
* The ChartBase class is an abstract class used to create charts.
*
* @module charts
* @class ChartBase
* @constructor
*/
function ChartBase() {}
/**
* Reference to the default tooltip available for the chart.
* <p>Contains the following properties:</p>
* <dl>
* <dt>node</dt><dd>Reference to the actual dom node</dd>
* <dt>showEvent</dt><dd>Event that should trigger the tooltip</dd>
* <dt>hideEvent</dt><dd>Event that should trigger the removal of a tooltip (can be an event or an array of events)</dd>
* <dt>styles</dt><dd>A hash of style properties that will be applied to the tooltip node</dd>
* <dt>show</dt><dd>Indicates whether or not to show the tooltip</dd>
* <dt>markerEventHandler</dt><dd>Displays and hides tooltip based on marker events</dd>
* <dt>planarEventHandler</dt><dd>Displays and hides tooltip based on planar events</dd>
* <dt>markerLabelFunction</dt><dd>Reference to the function used to format a marker event triggered tooltip's text. The method contains
* the following arguments:
* <dl>
* <dt>categoryItem</dt><dd>An object containing the following:
* <dl>
* <dt>axis</dt><dd>The axis to which the category is bound.</dd>
* <dt>displayName</dt><dd>The display name set to the category (defaults to key if not provided).</dd>
* <dt>key</dt><dd>The key of the category.</dd>
* <dt>value</dt><dd>The value of the category.</dd>
* </dl>
* </dd>
* <dt>valueItem</dt><dd>An object containing the following:
* <dl>
* <dt>axis</dt><dd>The axis to which the item's series is bound.</dd>
* <dt>displayName</dt><dd>The display name of the series. (defaults to key if not provided)</dd>
* <dt>key</dt><dd>The key for the series.</dd>
* <dt>value</dt><dd>The value for the series item.</dd>
* </dl>
* </dd>
* <dt>itemIndex</dt><dd>The index of the item within the series.</dd>
* <dt>series</dt><dd> The `CartesianSeries` instance of the item.</dd>
* <dt>seriesIndex</dt><dd>The index of the series in the `seriesCollection`.</dd>
* </dl>
* The method returns an html string which is written into the DOM using `innerHTML`.
* </dd>
* <dt>planarLabelFunction</dt><dd>Reference to the function used to format a planar event triggered tooltip's text
* <dl>
* <dt>categoryAxis</dt><dd> `CategoryAxis` Reference to the categoryAxis of the chart.
* <dt>valueItems</dt><dd>Array of objects for each series that has a data point in the coordinate plane of the event. Each object contains the following data:
* <dl>
* <dt>axis</dt><dd>The value axis of the series.</dd>
* <dt>key</dt><dd>The key for the series.</dd>
* <dt>value</dt><dd>The value for the series item.</dd>
* <dt>displayName</dt><dd>The display name of the series. (defaults to key if not provided)</dd>
* </dl>
* </dd>
* <dt>index</dt><dd>The index of the item within its series.</dd>
* <dt>seriesArray</dt><dd>Array of series instances for each value item.</dd>
* <dt>seriesIndex</dt><dd>The index of the series in the `seriesCollection`.</dd>
* </dl>
* </dd>
* </dl>
* The method returns an html string which is written into the DOM using `innerHTML`.
* </dd>
* </dl>
* @attribute tooltip
* @type Object
*/
tooltip: {
valueFn: "_getTooltip",
{
return this._updateTooltip(val);
}
},
/**
* The key value used for the chart's category axis.
*
* @attribute categoryKey
* @type String
* @default category
*/
categoryKey: {
value: "category"
},
/**
* Indicates the type of axis to use for the category axis.
*
* <dl>
* <dt>category</dt><dd>Specifies a `CategoryAxis`.</dd>
* <dt>time</dt><dd>Specifies a `TimeAxis</dd>
* </dl>
*
* @attribute categoryType
* @type String
* @default category
*/
value:"category"
},
/**
* Indicates the the type of interactions that will fire events.
*
* <dl>
* <dt>marker</dt><dd>Events will be broadcasted when the mouse interacts with individual markers.</dd>
* <dt>planar</dt><dd>Events will be broadcasted when the mouse intersects the plane of any markers on the chart.</dd>
* <dt>none</dt><dd>No events will be broadcasted.</dd>
* </dl>
*
* @attribute interactionType
* @type String
* @default marker
*/
value: "marker"
},
/**
* Data used to generate the chart.
*
* @attribute dataProvider
* @type Array
*/
dataProvider: {
{
return this._setDataValues(val);
}
},
/**
* A collection of keys that map to the series axes. If no keys are set,
* they will be generated automatically depending on the data structure passed into
* the chart.
*
* @attribute seriesKeys
* @type Array
*/
seriesKeys: {},
/**
* Reference to all the axes in the chart.
*
* @attribute axesCollection
* @type Array
*/
axesCollection: {},
/**
* Reference to graph instance.
*
* @attribute graph
* @type Graph
*/
graph: {
valueFn: "_getGraph"
}
};
/**
* Default value function for the `Graph` attribute.
*
* @method _getGraph
* @return Graph
* @private
*/
_getGraph: function()
{
this.fire("chartRendered");
}, this));
return graph;
},
/**
* Returns a series instance by index or key value.
*
* @method getSeries
* @param val
* @return CartesianSeries
*/
{
var series = null,
if(graph)
{
{
}
else
{
}
}
return series;
},
/**
* Returns an `Axis` instance by key reference. If the axis was explicitly set through the `axes` attribute,
* the key will be the same as the key used in the `axes` object. For default axes, the key for
* the category axis is the value of the `categoryKey` (`category`). For the value axis, the default
* key is `values`.
*
* @method getAxisByKey
* @param {String} val Key reference used to look up the axis.
* @return Axis
*/
getAxisByKey: function(val)
{
var axis,
{
}
return axis;
},
/**
* Returns the category axis for the chart.
*
* @method getCategoryAxis
* @return Axis
*/
getCategoryAxis: function()
{
var axis,
{
}
return axis;
},
/**
* Default direction of the chart.
*
* @property _direction
* @type String
* @default horizontal
* @private
*/
_direction: "horizontal",
/**
* Storage for the `dataProvider` attribute.
*
* @property _dataProvider
* @type Array
* @private
*/
_dataProvider: null,
/**
* Setter method for `dataProvider` attribute.
*
* @method _setDataValues
* @param {Array} val Array to be set as `dataProvider`.
* @return Array
* @private
*/
_setDataValues: function(val)
{
{
var hash,
dp = [],
i = 0,
n,
for(; i < l; ++i)
{
for(n = 1; n < sl; ++n)
{
}
}
return dp;
}
return val;
},
/**
* Storage for `seriesCollection` attribute.
*
* @property _seriesCollection
* @type Array
* @private
*/
_seriesCollection: null,
/**
* Setter method for `seriesCollection` attribute.
*
* @property _setSeriesCollection
* @param {Array} val Array of either `CartesianSeries` instances or objects containing series attribute key value pairs.
* @private
*/
_setSeriesCollection: function(val)
{
this._seriesCollection = val;
},
/**
* Helper method that returns the axis class that a key references.
*
* @method _getAxisClass
* @param {String} t The type of axis.
* @return Axis
* @private
*/
_getAxisClass: function(t)
{
return this._axisClass[t];
},
/**
* Key value pairs of axis types.
*
* @property _axisClass
* @type Object
* @private
*/
_axisClass: {
stacked: Y.StackedAxis,
numeric: Y.NumericAxis,
category: Y.CategoryAxis,
},
/**
* Collection of axes.
*
* @property _axes
* @type Array
* @private
*/
_axes: null,
/**
* @method initializer
* @private
*/
initializer: function()
{
this._axesRenderQueue = [];
},
/**
* @method renderUI
* @private
*/
renderUI: function()
{
//move the position = absolute logic to a class file
this._addAxes();
this._addSeries();
{
this._addTooltip();
}
this._redraw();
},
/**
* @property bindUI
* @private
*/
bindUI: function()
{
hideEvent = "mouseout",
showEvent = "mouseover",
i = 0,
len,
if(interactionType == "marker")
{
}
else if(interactionType == "planar")
{
}
if(tt)
{
{
}
else
{
if(showEvent)
{
}
if(hideEvent)
{
{
for(; i < len; ++i)
{
}
}
}
}
}
},
/**
* Event handler for marker events.
*
* @method _markerEventDispatcher
* @param {Object} e Event object.
* @private
*/
_markerEventDispatcher: function(e)
{
markerNode = e.currentTarget,
if(type == "mouseenter")
{
type = "mouseover";
}
else if(type == "mouseleave")
{
type = "mouseout";
}
e.halt();
/**
* Broadcasts when `interactionType` is set to `marker` and a series marker has received a mouseover event.
*
*
* @event markerEvent:mouseover
* @preventable false
* @param {EventFacade} e Event facade with the following additional
* properties:
* <dl>
* <dt>categoryItem</dt><dd>Hash containing information about the category `Axis`.</dd>
* <dt>valueItem</dt><dd>Hash containing information about the value `Axis`.</dd>
* <dt>node</dt><dd>The dom node of the marker.</dd>
* <dt>x</dt><dd>The x-coordinate of the mouse in relation to the Chart.</dd>
* <dt>y</dt><dd>The y-coordinate of the mouse in relation to the Chart.</dd>
* <dt>series</dt><dd>Reference to the series of the marker.</dd>
* <dt>index</dt><dd>Index of the marker in the series.</dd>
* <dt>seriesIndex</dt><dd>The `order` of the marker's series.</dd>
* </dl>
*/
/**
* Broadcasts when `interactionType` is set to `marker` and a series marker has received a mouseout event.
*
* @event markerEvent:mouseout
* @preventable false
* @param {EventFacade} e Event facade with the following additional
* properties:
* <dl>
* <dt>categoryItem</dt><dd>Hash containing information about the category `Axis`.</dd>
* <dt>valueItem</dt><dd>Hash containing information about the value `Axis`.</dd>
* <dt>node</dt><dd>The dom node of the marker.</dd>
* <dt>x</dt><dd>The x-coordinate of the mouse in relation to the Chart.</dd>
* <dt>y</dt><dd>The y-coordinate of the mouse in relation to the Chart.</dd>
* <dt>series</dt><dd>Reference to the series of the marker.</dd>
* <dt>index</dt><dd>Index of the marker in the series.</dd>
* <dt>seriesIndex</dt><dd>The `order` of the marker's series.</dd>
* </dl>
*/
/**
* Broadcasts when `interactionType` is set to `marker` and a series marker has received a mousedown event.
*
* @event markerEvent:mousedown
* @preventable false
* @param {EventFacade} e Event facade with the following additional
* properties:
* <dl>
* <dt>categoryItem</dt><dd>Hash containing information about the category `Axis`.</dd>
* <dt>valueItem</dt><dd>Hash containing information about the value `Axis`.</dd>
* <dt>node</dt><dd>The dom node of the marker.</dd>
* <dt>x</dt><dd>The x-coordinate of the mouse in relation to the Chart.</dd>
* <dt>y</dt><dd>The y-coordinate of the mouse in relation to the Chart.</dd>
* <dt>series</dt><dd>Reference to the series of the marker.</dd>
* <dt>index</dt><dd>Index of the marker in the series.</dd>
* <dt>seriesIndex</dt><dd>The `order` of the marker's series.</dd>
* </dl>
*/
/**
* Broadcasts when `interactionType` is set to `marker` and a series marker has received a mouseup event.
*
* @event markerEvent:mouseup
* @preventable false
* @param {EventFacade} e Event facade with the following additional
* properties:
* <dl>
* <dt>categoryItem</dt><dd>Hash containing information about the category `Axis`.</dd>
* <dt>valueItem</dt><dd>Hash containing information about the value `Axis`.</dd>
* <dt>node</dt><dd>The dom node of the marker.</dd>
* <dt>x</dt><dd>The x-coordinate of the mouse in relation to the Chart.</dd>
* <dt>y</dt><dd>The y-coordinate of the mouse in relation to the Chart.</dd>
* <dt>series</dt><dd>Reference to the series of the marker.</dd>
* <dt>index</dt><dd>Index of the marker in the series.</dd>
* <dt>seriesIndex</dt><dd>The `order` of the marker's series.</dd>
* </dl>
*/
/**
* Broadcasts when `interactionType` is set to `marker` and a series marker has received a click event.
*
* @event markerEvent:click
* @preventable false
* @param {EventFacade} e Event facade with the following additional
* properties:
* <dl>
* <dt>categoryItem</dt><dd>Hash containing information about the category `Axis`.</dd>
* <dt>valueItem</dt><dd>Hash containing information about the value `Axis`.</dd>
* <dt>node</dt><dd>The dom node of the marker.</dd>
* <dt>x</dt><dd>The x-coordinate of the mouse in relation to the Chart.</dd>
* <dt>y</dt><dd>The y-coordinate of the mouse in relation to the Chart.</dd>
* <dt>pageX</dt><dd>The x location of the event on the page (including scroll)</dd>
* <dt>pageY</dt><dd>The y location of the event on the page (including scroll)</dd>
* <dt>series</dt><dd>Reference to the series of the marker.</dd>
* <dt>index</dt><dd>Index of the marker in the series.</dd>
* <dt>seriesIndex</dt><dd>The `order` of the marker's series.</dd>
* <dt>originEvent</dt><dd>Underlying dom event.</dd>
* </dl>
*/
originEvent: e,
x:x,
y:y,
});
},
/**
* Event handler for dataProviderChange.
*
* @method _dataProviderChangeHandler
* @param {Object} e Event object.
* @private
*/
_dataProviderChangeHandler: function(e)
{
i,
axis;
if(axes)
{
for(i in axes)
{
if(axes.hasOwnProperty(i))
{
{
}
}
}
}
},
/**
* Event listener for toggling the tooltip. If a tooltip is visible, hide it. If not, it
* will create and show a tooltip based on the event object.
*
* @method toggleTooltip
* @param {Object} e Event object.
*/
toggleTooltip: function(e)
{
{
this.hideTooltip();
}
else
{
}
},
/**
* Shows a tooltip
*
* @method _showTooltip
* @param {String} msg Message to dispaly in the tooltip.
* @param {Number} x x-coordinate
* @param {Number} y y-coordinate
* @private
*/
_showTooltip: function(msg, x, y)
{
if(msg)
{
}
},
/**
* Positions the tooltip
*
* @method _positionTooltip
* @param {Object} e Event object.
* @private
*/
_positionTooltip: function(e)
{
if(node)
{
}
},
/**
* Hides the default tooltip
*
* @method hideTooltip
*/
hideTooltip: function()
{
},
/**
* Adds a tooltip to the dom.
*
* @method _addTooltip
* @private
*/
_addTooltip: function()
{
if(oldNode)
{
}
},
/**
* Updates the tooltip attribute.
*
* @method _updateTooltip
* @param {Object} val Object containing properties for the tooltip.
* @return Object
* @private
*/
_updateTooltip: function(val)
{
i,
node,
props = {
markerLabelFunction:"markerLabelFunction",
planarLabelFunction:"planarLabelFunction",
showEvent:"showEvent",
hideEvent:"hideEvent",
markerEventHandler:"markerEventHandler",
planarEventHandler:"planarEventHandler",
show:"show"
};
{
if(styles)
{
for(i in styles)
{
if(styles.hasOwnProperty(i))
{
}
}
}
for(i in props)
{
if(val.hasOwnProperty(i))
{
}
}
}
return tt;
},
/**
* Default getter for `tooltip` attribute.
*
* @method _getTooltip
* @return Object
* @private
*/
_getTooltip: function()
{
tt = {
show: true,
hideEvent: "mouseout",
showEvent: "mouseover",
markerEventHandler: function(e)
{
msg = tt.markerLabelFunction.apply(this, [e.categoryItem, e.valueItem, e.index, e.series, e.seriesIndex]);
},
planarEventHandler: function(e)
{
msg ,
msg = tt.planarLabelFunction.apply(this, [categoryAxis, e.valueItem, e.index, e.items, e.seriesIndex]);
}
};
return tt;
},
/**
* Formats tooltip text when `interactionType` is `planar`.
*
* @method _planarLabelFunction
* @param {Axis} categoryAxis Reference to the categoryAxis of the chart.
* @param {Array} valueItems Array of objects for each series that has a data point in the coordinate plane of the event. Each object contains the following data:
* <dl>
* <dt>axis</dt><dd>The value axis of the series.</dd>
* <dt>key</dt><dd>The key for the series.</dd>
* <dt>value</dt><dd>The value for the series item.</dd>
* <dt>displayName</dt><dd>The display name of the series. (defaults to key if not provided)</dd>
* </dl>
* @param {Number} index The index of the item within its series.
* @param {Array} seriesArray Array of series instances for each value item.
* @param {Number} seriesIndex The index of the series in the `seriesCollection`.
* @return {String | HTML}
* @private
*/
{
var msg = "",
i = 0,
axis,
if(categoryAxis)
{
msg += categoryAxis.get("labelFunction").apply(this, [categoryAxis.getKeyValueAt(this.get("categoryKey"), index), categoryAxis.get("labelFormat")]);
}
for(; i < len; ++i)
{
series = seriesArray[i];
{
valueItem = valueItems[i];
msg += "<br/><span>" + valueItem.displayName + ": " + axis.get("labelFunction").apply(this, [axis.getKeyValueAt(valueItem.key, index), axis.get("labelFormat")]) + "</span>";
}
}
return msg;
},
/**
* Formats tooltip text when `interactionType` is `marker`.
*
* @method _tooltipLabelFunction
* @param {Object} categoryItem An object containing the following:
* <dl>
* <dt>axis</dt><dd>The axis to which the category is bound.</dd>
* <dt>displayName</dt><dd>The display name set to the category (defaults to key if not provided)</dd>
* <dt>key</dt><dd>The key of the category.</dd>
* <dt>value</dt><dd>The value of the category</dd>
* </dl>
* @param {Object} valueItem An object containing the following:
* <dl>
* <dt>axis</dt><dd>The axis to which the item's series is bound.</dd>
* <dt>displayName</dt><dd>The display name of the series. (defaults to key if not provided)</dd>
* <dt>key</dt><dd>The key for the series.</dd>
* <dt>value</dt><dd>The value for the series item.</dd>
* </dl>
* @param {Number} itemIndex The index of the item within the series.
* @param {CartesianSeries} series The `CartesianSeries` instance of the item.
* @param {Number} seriesIndex The index of the series in the `seriesCollection`.
* @return {String | HTML}
* @private
*/
{
": " + categoryItem.axis.get("labelFunction").apply(this, [categoryItem.value, categoryItem.axis.get("labelFormat")]) +
": " + valueItem.axis.get("labelFunction").apply(this, [valueItem.value, valueItem.axis.get("labelFormat")]);
return msg;
},
/**
* Event handler for the tooltipChange.
*
* @method _tooltipChangeHandler
* @param {Object} e Event object.
* @private
*/
_tooltipChangeHandler: function(e)
{
if(this.get("tooltip"))
{
{
{
this._addTooltip();
}
}
}
}
};
/**
* The CartesianChart class creates a chart with horizontal and vertical axes.
*
* @module charts
* @class CartesianChart
* @extends ChartBase
* @constructor
*/
/**
* @method renderUI
* @private
*/
renderUI: function()
{
//move the position = absolute logic to a class file
this._addAxes();
this._addGridlines();
this._addSeries();
{
this._addTooltip();
}
//If there is a style definition. Force them to set.
this.get("styles");
{
}
this._redraw();
},
/**
* When `interactionType` is set to `planar`, listens for mouse move events and fires `planarEvent:mouseover` or `planarEvent:mouseout` depending on the position of the mouse in relation to
* data points on the `Chart`.
*
* @method _planarEventDispatcher
* @param {Object} e Event object.
* @private
*/
_planarEventDispatcher: function(e)
{
offset = {
},
i = 0,
oldIndex = this._selectedIndex,
item,
items = [],
categoryItems = [],
valueItems = [],
//data columns and area data could be created on a graph level
len,
if(direction == "horizontal")
{
catAxis = "x";
valAxis = "y";
}
else
{
valAxis = "x";
catAxis = "y";
}
if(sc)
{
while(i < len && !markerPlane)
{
if(sc[i])
{
}
i++;
}
}
if(markerPlane)
{
for(i = 0; i < len; ++i)
{
{
index = i;
break;
}
}
for(i = 0; i < len; ++i)
{
{
}
{
{
}
}
}
this._selectedIndex = index;
/**
* Broadcasts when `interactionType` is set to `planar` and a series' marker plane has received a mouseover event.
*
*
* @event planarEvent:mouseover
* @preventable false
* @param {EventFacade} e Event facade with the following additional
* properties:
* <dl>
* <dt>categoryItem</dt><dd>An array of hashes, each containing information about the category `Axis` of each marker whose plane has been intersected.</dd>
* <dt>valueItem</dt><dd>An array of hashes, each containing information about the value `Axis` of each marker whose plane has been intersected.</dd>
* <dt>x</dt><dd>The x-coordinate of the mouse in relation to the Chart.</dd>
* <dt>y</dt><dd>The y-coordinate of the mouse in relation to the Chart.</dd>
* <dt>pageX</dt><dd>The x location of the event on the page (including scroll)</dd>
* <dt>pageY</dt><dd>The y location of the event on the page (including scroll)</dd>
* <dt>items</dt><dd>An array including all the series which contain a marker whose plane has been intersected.</dd>
* <dt>index</dt><dd>Index of the markers in their respective series.</dd>
* <dt>originEvent</dt><dd>Underlying dom event.</dd>
* </dl>
*/
/**
* Broadcasts when `interactionType` is set to `planar` and a series' marker plane has received a mouseout event.
*
* @event planarEvent:mouseout
* @preventable false
* @param {EventFacade} e
*/
if(index > -1)
{
this.fire("planarEvent:mouseover", {
x:posX,
y:posY,
});
}
else
{
this.fire("planarEvent:mouseout");
}
}
},
/**
* Indicates the default series type for the chart.
*
* @property _type
* @type {String}
* @private
*/
_type: "combo",
/**
* Queue of axes instances that will be updated. This method is used internally to determine when all axes have been updated.
*
* @property _axesRenderQueue
* @type Array
* @private
*/
_axesRenderQueue: null,
/**
* Adds an `Axis` instance to the `_axesRenderQueue`.
*
* @method _addToAxesRenderQueue
* @param {Axis} axis An `Axis` instance.
* @private
*/
_addToAxesRenderQueue: function(axis)
{
if(!this._axesRenderQueue)
{
this._axesRenderQueue = [];
}
{
}
},
/**
* Adds axis instance to the appropriate array based on position
*
* @method _addToAxesCollection
* @param {String} position The position of the axis
* @param {Axis} axis The `Axis` instance
*/
{
if(!axesCollection)
{
axesCollection = [];
}
},
/**
* Returns the default value for the `seriesCollection` attribute.
*
* @method _getDefaultSeriesCollection
* @param {Array} val Array containing either `CartesianSeries` instances or objects containing data to construct series instances.
* @return Array
* @private
*/
_getDefaultSeriesCollection: function(val)
{
tempKeys = [],
i,
l,
key,
if(dir == "vertical")
{
catAxis = "yAxis";
catKey = "yKey";
valAxis = "xAxis";
seriesKey = "xKey";
}
else
{
catAxis = "xAxis";
catKey = "xKey";
valAxis = "yAxis";
seriesKey = "yKey";
}
for(i = 0; i < l; ++i)
{
if(key)
{
if(index > -1)
{
}
}
}
{
}
for(i = 0; i < l; ++i)
{
if(series instanceof Y.CartesianSeries)
{
this._parseSeriesAxes(series);
continue;
}
if((series.type == "combo" || series.type == "stackedcombo" || series.type == "combospline" || series.type == "stackedcombospline"))
{
if(showAreaFill !== null)
{
series.showAreaFill = (series.showAreaFill !== null && series.showAreaFill !== undefined) ? series.showAreaFill : showAreaFill;
}
if(showMarkers !== null)
{
series.showMarkers = (series.showMarkers !== null && series.showMarkers !== undefined) ? series.showMarkers : showMarkers;
}
if(showLines !== null)
{
series.showLines = (series.showLines !== null && series.showLines !== undefined) ? series.showLines : showLines;
}
}
}
if(val)
{
}
return sc;
},
/**
* Parse and sets the axes for a series instance.
*
* @method _parseSeriesAxes
* @param {CartesianSeries} series A `CartesianSeries` instance.
* @private
*/
_parseSeriesAxes: function(series)
{
axis;
{
{
}
}
{
{
}
}
},
/**
* Returns the category axis instance for the chart.
*
* @method _getCategoryAxis
* @return Axis
* @private
*/
_getCategoryAxis: function()
{
var axis,
return axis;
},
/**
* Returns the value axis for a series.
*
* @method _getSeriesAxis
* @param {String} key The key value used to determine the axis instance.
* @return Axis
* @private
*/
{
i,
keys,
axis;
if(axes)
{
{
}
else
{
for(i in axes)
{
if(axes.hasOwnProperty(i))
{
{
break;
}
}
}
}
}
return axis;
},
/**
* Gets an attribute from an object, using a getter for Base objects and a property for object
* literals. Used for determining attributes from series/axis references which can be an actual class instance
* or a hash of properties that will be used to create a class instance.
*
* @method _getBaseAttribute
* @param {Object} item Object or instance in which the attribute resides.
* @param {String} key Attribute whose value will be returned.
* @return Object
* @private
*/
{
{
}
{
}
return null;
},
/**
* Sets an attribute on an object, using a setter of Base objects and a property for object
* literals. Used for setting attributes on a Base class, either directly or to be stored in an object literal
* for use at instantiation.
*
* @method _setBaseAttribute
* @param {Object} item Object or instance in which the attribute resides.
* @param {String} key Attribute whose value will be assigned.
* @param {Object} value Value to be assigned to the attribute.
* @private
*/
{
{
}
else
{
}
},
/**
* Creates `Axis` instances.
*
* @method _parseAxes
* @param {Object} val Object containing `Axis` instances or objects in which to construct `Axis` instances.
* @return Object
* @private
*/
_parseAxes: function(val)
{
axes = {},
axesAttrs = {
edgeOffset: "edgeOffset",
position: "position",
overlapGraph:"overlapGraph",
labelFunction:"labelFunction",
labelFunctionScope:"labelFunctionScope",
labelFormat:"labelFormat",
maximum:"maximum",
minimum:"minimum",
roundingMethod:"roundingMethod",
alwaysShowZero:"alwaysShowZero",
title:"title"
},
ai,
i,
pos,
axis,
dh,
for(i in hash)
{
if(hash.hasOwnProperty(i))
{
{
}
else
{
axis = null;
config = {};
{
}
{
}
{
{
}
}
//only check for existing axis if we constructed the default axes already
if(val)
{
axis = this.getAxisByKey(i);
}
{
if(pos != axisPosition)
{
if(axisPosition != "none")
{
}
if(pos != "none")
{
}
}
}
else
{
}
}
if(axis)
{
{
}
}
}
}
return axes;
},
/**
* Adds axes to the chart.
*
* @method _addAxes
* @private
*/
_addAxes: function()
{
i,
axis,
pos,
w = this.get("width"),
h = this.get("height"),
if(!this._axesCollection)
{
this._axesCollection = [];
}
for(i in axes)
{
if(axes.hasOwnProperty(i))
{
{
if(!w)
{
w = this.get("width");
}
if(!h)
{
h = this.get("height");
}
this._addToAxesRenderQueue(axis);
{
}
else
{
}
{
}
}
}
}
},
/**
* Renders the Graph.
*
* @method _addSeries
* @private
*/
_addSeries: function()
{
},
/**
* Adds gridlines to the chart.
*
* @method _addGridlines
* @private
*/
_addGridlines: function()
{
if(this._axesCollection)
{
}
if(hgl)
{
{
}
{
}
else
{
}
{
}
{
}
}
if(vgl)
{
{
}
{
}
else
{
}
{
}
{
}
}
},
/**
* Returns all the keys contained in a `dataProvider`.
*
* @method _getAllKeys
* @param {Array} dp Collection of objects to be parsed.
* @return Object
*/
_getAllKeys: function(dp)
{
var i = 0,
item,
key,
keys = {};
for(; i < len; ++i)
{
{
{
}
}
}
return keys;
},
/**
* Generates and returns a key-indexed object containing `Axis` instances or objects used to create `Axis` instances.
*
* @method _getDefaultAxes
* @param {Object} axes Object containing `Axis` instances or `Axis` attributes.
* @return Object
* @private
*/
_getDefaultAxes: function(axes)
{
axis,
attr,
keys,
newAxes = {},
claimedKeys = [],
i,
l,
ii,
ll,
dv,
valueAxes = [],
if(direction == "vertical")
{
seriesPosition = "bottom";
categoryPosition = "left";
}
else
{
seriesPosition = "left";
categoryPosition = "bottom";
}
if(axes)
{
for(i in axes)
{
if(axes.hasOwnProperty(i))
{
{
categoryAxisName = i;
this.set("categoryAxisName", i);
{
}
}
else if(i == categoryAxisName)
{
}
else
{
{
{
}
}
{
}
{
this._setBaseAttribute(newAxes[i], "position", this._getDefaultAxisPosition(newAxes[i], valueAxes, seriesPosition));
}
}
}
}
}
{
for(i in dv)
{
{
seriesKeys.push(i);
}
}
}
if(cIndex > -1)
{
}
l = claimedKeys.length;
for(i = 0; i < l; ++i)
{
if(cIndex > -1)
{
}
}
{
newAxes[categoryAxisName] = {};
}
{
}
{
}
{
}
{
}
{
{
}
else
{
}
}
{
{
this._setBaseAttribute(newAxes[valueAxisName], "position", this._getDefaultAxisPosition(newAxes[valueAxisName], valueAxes, seriesPosition));
}
{
}
{
}
}
return newAxes;
},
/**
* Determines the position of an axis when one is not specified.
*
* @method _getDefaultAxisPosition
* @param {Axis} axis `Axis` instance.
* @param {Array} valueAxes Array of `Axis` instances.
* @param {String} position Default position depending on the direction of the chart and type of axis.
* @return String
* @private
*/
{
{
if(direction == "horizontal")
{
{
position = "right";
}
{
position = "left";
}
}
else
{
{
position = "top";
}
else
{
position = "bottom";
}
}
}
return position;
},
/**
* Returns an object literal containing a categoryItem and a valueItem for a given series index. Below is the structure of each:
*
* @method getSeriesItems
* @param {CartesianSeries} series Reference to a series.
* @param {Number} index Index of the specified item within a series.
* @return Object An object literal containing the following:
*
* <dl>
* <dt>categoryItem</dt><dd>Object containing the following data related to the category axis of the series.
* <dl>
* <dt>axis</dt><dd>Reference to the category axis of the series.</dd>
* <dt>key</dt><dd>Category key for the series.</dd>
* <dt>value</dt><dd>Value on the axis corresponding to the series index.</dd>
* </dl>
* </dd>
* <dt>valueItem</dt><dd>Object containing the following data related to the category axis of the series.
* <dl>
* <dt>axis</dt><dd>Reference to the value axis of the series.</dd>
* <dt>key</dt><dd>Value key for the series.</dd>
* <dt>value</dt><dd>Value on the axis corresponding to the series index.</dd>
* </dl>
* </dd>
* </dl>
*/
{
{
categoryItem = {
};
valueItem = {
};
}
else
{
valueItem = {
};
categoryItem = {
};
}
},
/**
* Handler for axisRendered event.
*
* @method _axisRendered
* @param {Object} e Event object.
* @private
*/
_axisRendered: function(e)
{
this._axesRenderQueue = this._axesRenderQueue.splice(1 + Y.Array.indexOf(this._axesRenderQueue, e.currentTarget), 1);
{
this._redraw();
}
},
/**
* Handler for sizeChanged event.
*
* @method _sizeChanged
* @param {Object} e Event object.
* @private
*/
_sizeChanged: function(e)
{
if(this._axesCollection)
{
var ac = this._axesCollection,
i = 0,
for(; i < l; ++i)
{
this._addToAxesRenderQueue(ac[i]);
}
this._redraw();
}
},
/**
* Redraws and position all the components of the chart instance.
*
* @method _redraw
* @private
*/
_redraw: function()
{
if(this._drawing)
{
this._callLater = true;
return;
}
this._drawing = true;
this._callLater = false;
var w = this.get("width"),
h = this.get("height"),
lw = 0,
rw = 0,
th = 0,
bh = 0,
i = 0,
l,
axis,
pos,
pts = [],
graphOverflow = "visible",
if(lc)
{
for(i = l - 1; i > -1; --i)
{
}
}
if(rc)
{
i = 0;
for(i = l - 1; i > -1; --i)
{
}
}
if(tc)
{
for(i = l - 1; i > -1; --i)
{
}
}
if(bc)
{
for(i = l - 1; i > -1; --i)
{
}
}
l = this._axesCollection.length;
i = 0;
for(; i < l; ++i)
{
axis = this._axesCollection[i];
{
{
}
}
{
{
}
}
if(axis._hasDataOverflow())
{
graphOverflow = "hidden";
}
}
this._drawing = false;
if(this._callLater)
{
this._redraw();
return;
}
if(graph)
{
}
if(this._overlay)
{
}
}
}, {
ATTRS: {
/**
* Style object for the axes.
*
* @attribute axesStyles
* @type Object
* @private
*/
axesStyles: {
getter: function()
{
i,
styles = this._axesStyles;
if(axes)
{
for(i in axes)
{
{
if(!styles)
{
styles = {};
}
}
}
}
return styles;
},
{
i;
for(i in val)
{
{
}
}
}
},
/**
* Style object for the series
*
* @attribute seriesStyles
* @type Object
* @private
*/
seriesStyles: {
getter: function()
{
var styles = this._seriesStyles,
dict,
i;
if(graph)
{
if(dict)
{
styles = {};
for(i in dict)
{
if(dict.hasOwnProperty(i))
{
}
}
}
}
return styles;
},
{
var i,
l,
s;
{
s = this.get("seriesCollection");
i = 0;
for(; i < l; ++i)
{
}
}
else
{
for(i in val)
{
if(val.hasOwnProperty(i))
{
s = this.getSeries(i);
}
}
}
}
},
/**
* Styles for the graph.
*
* @attribute graphStyles
* @type Object
* @private
*/
graphStyles: {
getter: function()
{
if(graph)
{
}
return this._graphStyles;
},
{
}
},
/**
* Style properties for the chart. Contains a key indexed hash of the following:
* <dl>
* <dt>series</dt><dd>A key indexed hash containing references to the `styles` attribute for each series in the chart.
* Specific style attributes vary depending on the series:
* <ul>
* <li><a href="AreaSeries.html#attr_styles">AreaSeries</a></li>
* <li><a href="BarSeries.html#attr_styles">BarSeries</a></li>
* <li><a href="ColumnSeries.html#attr_styles">ColumnSeries</a></li>
* <li><a href="ComboSeries.html#attr_styles">ComboSeries</a></li>
* <li><a href="LineSeries.html#attr_styles">LineSeries</a></li>
* <li><a href="MarkerSeries.html#attr_styles">MarkerSeries</a></li>
* <li><a href="SplineSeries.html#attr_styles">SplineSeries</a></li>
* </ul>
* </dd>
* <dt>axes</dt><dd>A key indexed hash containing references to the `styles` attribute for each axes in the chart. Specific
* style attributes can be found in the <a href="Axis.html#attr_styles">Axis</a> class.</dd>
* <dt>graph</dt><dd>A reference to the `styles` attribute in the chart. Specific style attributes can be found in the
* <a href="Graph.html#attr_styles">Graph</a> class.</dd>
* </dl>
*
* @attribute styles
* @type Object
*/
styles: {
getter: function()
{
var styles = {
};
return styles;
},
{
{
if(this.get("axesStyles"))
{
}
else
{
}
}
{
if(this.get("seriesStyles"))
{
}
else
{
}
}
{
}
}
},
/**
* Axes to appear in the chart. This can be a key indexed hash of axis instances or object literals
* used to construct the appropriate axes.
*
* @attribute axes
* @type Object
*/
axes: {
valueFn: "_parseAxes",
{
return this._parseAxes(val);
}
},
/**
* Collection of series to appear on the chart. This can be an array of Series instances or object literals
* used to construct the appropriate series.
*
* @attribute seriesCollection
* @type Array
*/
valueFn: "_getDefaultSeriesCollection",
{
return this._getDefaultSeriesCollection(val);
}
},
/**
* Reference to the left-aligned axes for the chart.
*
* @attribute leftAxesCollection
* @type Array
* @private
*/
leftAxesCollection: {},
/**
* Reference to the bottom-aligned axes for the chart.
*
* @attribute bottomAxesCollection
* @type Array
* @private
*/
bottomAxesCollection: {},
/**
* Reference to the right-aligned axes for the chart.
*
* @attribute rightAxesCollection
* @type Array
* @private
*/
rightAxesCollection: {},
/**
* Reference to the top-aligned axes for the chart.
*
* @attribute topAxesCollection
* @type Array
* @private
*/
topAxesCollection: {},
/**
* Indicates whether or not the chart is stacked.
*
* @attribute stacked
* @type Boolean
*/
stacked: {
value: false
},
/**
* Direction of chart's category axis when there is no series collection specified. Charts can
* be horizontal or vertical. When the chart type is column, the chart is horizontal.
* When the chart type is bar, the chart is vertical.
*
* @attribute direction
* @type String
*/
direction: {
getter: function()
{
if(type == "bar")
{
return "vertical";
}
else if(type == "column")
{
return "horizontal";
}
return this._direction;
},
{
this._direction = val;
return this._direction;
}
},
/**
* Indicates whether or not an area is filled in a combo chart.
*
* @attribute showAreaFill
* @type Boolean
*/
showAreaFill: {},
/**
* Indicates whether to display markers in a combo chart.
*
* @attribute showMarkers
* @type Boolean
*/
showMarkers:{},
/**
* Indicates whether to display lines in a combo chart.
*
* @attribute showLines
* @type Boolean
*/
showLines:{},
/**
* Indicates the key value used to identify a category axis in the `axes` hash. If
* not specified, the categoryKey attribute value will be used.
*
* @attribute categoryAxisName
* @type String
*/
},
/**
* Indicates the key value used to identify a the series axis when an axis not generated.
*
* @attribute valueAxisName
* @type String
*/
value: "values"
},
/**
* Reference to the horizontalGridlines for the chart.
*
* @attribute horizontalGridlines
* @type Gridlines
*/
getter: function()
{
if(graph)
{
}
return this._horizontalGridlines;
},
{
{
val = {};
}
if(graph)
{
}
else
{
this._horizontalGridlines = val;
}
}
},
/**
* Reference to the verticalGridlines for the chart.
*
* @attribute verticalGridlines
* @type Gridlines
*/
getter: function()
{
if(graph)
{
}
return this._verticalGridlines;
},
{
{
val = {};
}
if(graph)
{
}
else
{
this._verticalGridlines = val;
}
}
},
/**
* Type of chart when there is no series collection specified.
*
* @attribute type
* @type String
*/
type: {
getter: function()
{
if(this.get("stacked"))
{
return "stacked" + this._type;
}
return this._type;
},
{
if(this._type == "bar")
{
if(val != "bar")
{
}
}
else
{
if(val == "bar")
{
}
}
return this._type;
}
},
/**
* Reference to the category axis used by the chart.
*
* @attribute categoryAxis
* @type Axis
*/
categoryAxis:{}
}
});
/**
* The PieChart class creates a pie chart
*
* @module charts
* @class PieChart
* @extends ChartBase
* @constructor
*/
/**
* Calculates and returns a `seriesCollection`.
*
* @method _getSeriesCollection
* @return Array
* @private
*/
_getSeriesCollection: function()
{
if(this._seriesCollection)
{
return this._seriesCollection;
}
sc = [],
i = 0,
l,
key,
catAxis = "categoryAxis",
catKey = "categoryKey",
valAxis = "valueAxis",
seriesKey = "valueKey";
if(axes)
{
l = seriesKeys.length;
for(; i < l; ++i)
{
}
}
this._seriesCollection = sc;
return sc;
},
/**
* Creates `Axis` instances.
*
* @method _parseAxes
* @param {Object} val Object containing `Axis` instances or objects in which to construct `Axis` instances.
* @return Object
* @private
*/
_parseAxes: function(hash)
{
if(!this._axes)
{
this._axes = {};
}
w = this.get("width"),
h = this.get("height"),
if(!w)
{
w = this.get("width");
}
if(!h)
{
h = this.get("height");
}
for(i in hash)
{
if(hash.hasOwnProperty(i))
{
{
}
}
}
},
/**
* Adds axes to the chart.
*
* @method _addAxes
* @private
*/
_addAxes: function()
{
i,
axis,
p;
if(!axes)
{
}
if(!this._axesCollection)
{
this._axesCollection = [];
}
for(i in axes)
{
if(axes.hasOwnProperty(i))
{
if(!this.get(p + "AxesCollection"))
{
}
else
{
}
}
}
},
/**
* Renders the Graph.
*
* @method _addSeries
* @private
*/
_addSeries: function()
{
this._parseSeriesAxes(seriesCollection);
},
/**
* Parse and sets the axes for the chart.
*
* @method _parseSeriesAxes
* @param {Array} c A collection `PieSeries` instance.
* @private
*/
_parseSeriesAxes: function(c)
{
var i = 0,
s,
axis;
for(; i < len; ++i)
{
s = c[i];
if(s)
{
//If series is an actual series instance,
//replace axes attribute string ids with axes
if(s instanceof Y.PieSeries)
{
{
}
{
}
continue;
}
if(!s.type)
{
}
}
}
},
/**
* Generates and returns a key-indexed object containing `Axis` instances or objects used to create `Axis` instances.
*
* @method _getDefaultAxes
* @return Object
* @private
*/
_getDefaultAxes: function()
{
seriesAxis = "numeric",
i,
{
for(i in dv)
{
if(i != catKey)
{
seriesKeys.push(i);
}
}
{
}
}
return {
values:{
},
category:{
}
};
},
/**
* Returns an object literal containing a categoryItem and a valueItem for a given series index.
*
* @method getSeriesItem
* @param series Reference to a series.
* @param index Index of the specified item within a series.
* @return Object
*/
{
var categoryItem = {
},
valueItem = {
};
},
/**
* Handler for sizeChanged event.
*
* @method _sizeChanged
* @param {Object} e Event object.
* @private
*/
_sizeChanged: function(e)
{
if(graph)
{
}
},
/**
* Redraws the chart instance.
*
* @method _redraw
* @private
*/
_redraw: function()
{
if(graph)
{
}
}
}, {
ATTRS: {
/**
* Axes to appear in the chart.
*
* @attribute axes
* @type Object
*/
axes: {
getter: function()
{
return this._axes;
},
{
this._parseAxes(val);
}
},
/**
* Collection of series to appear on the chart. This can be an array of Series instances or object literals
* used to describe a Series instance.
*
* @attribute seriesCollection
* @type Array
*/
getter: function()
{
return this._getSeriesCollection();
},
{
return this._setSeriesCollection(val);
}
},
/**
* Type of chart when there is no series collection specified.
*
* @attribute type
* @type String
*/
type: {
value: "pie"
}
}
});
/**
* The Chart class is the basic application used to create a chart.
*
* @module charts
* @class Chart
* @constructor
*/
{
{
return new Y.CartesianChart(cfg);
}
else
{
}
}
}, '@VERSION@' ,{requires:['dom', 'datatype-number', 'datatype-date', 'event-custom', 'event-mouseenter', 'widget', 'widget-position', 'widget-stack', 'graphics']});