forked from extern/egroupware
10423 lines
418 KiB
JavaScript
10423 lines
418 KiB
JavaScript
/**
|
||
* Title: jqPlot Charts
|
||
*
|
||
* Pure JavaScript plotting plugin for jQuery.
|
||
*
|
||
* About: Version
|
||
*
|
||
* 1.0.0b2_r947
|
||
*
|
||
* About: Copyright & License
|
||
*
|
||
* Copyright (c) 2009-2011 Chris Leonello
|
||
* jqPlot is currently available for use in all personal or commercial projects
|
||
* under both the MIT and GPL version 2.0 licenses. This means that you can
|
||
* choose the license that best suits your project and use it accordingly.
|
||
*
|
||
* See <GPL Version 2> and <MIT License> contained within this distribution for further information.
|
||
*
|
||
* The author would appreciate an email letting him know of any substantial
|
||
* use of jqPlot. You can reach the author at: chris at jqplot dot com
|
||
* or see http://www.jqplot.com/info.php. This is, of course, not required.
|
||
*
|
||
* If you are feeling kind and generous, consider supporting the project by
|
||
* making a donation at: http://www.jqplot.com/donate.php.
|
||
*
|
||
* sprintf functions contained in jqplot.sprintf.js by Ash Searle:
|
||
*
|
||
* version 2007.04.27
|
||
* author Ash Searle
|
||
* http://hexmen.com/blog/2007/03/printf-sprintf/
|
||
* http://hexmen.com/js/sprintf.js
|
||
* The author (Ash Searle) has placed this code in the public domain:
|
||
* "This code is unrestricted: you are free to use it however you like."
|
||
*
|
||
*
|
||
* About: Introduction
|
||
*
|
||
* jqPlot requires jQuery (1.4+ required for certain features). jQuery 1.4.2 is included in the distribution.
|
||
* To use jqPlot include jQuery, the jqPlot jQuery plugin, the jqPlot css file and optionally
|
||
* the excanvas script for IE support in your web page:
|
||
*
|
||
* > <!--[if lt IE 9]><script language="javascript" type="text/javascript" src="excanvas.js"></script><![endif]-->
|
||
* > <script language="javascript" type="text/javascript" src="jquery-1.4.4.min.js"></script>
|
||
* > <script language="javascript" type="text/javascript" src="jquery.jqplot.min.js"></script>
|
||
* > <link rel="stylesheet" type="text/css" href="jquery.jqplot.css" />
|
||
*
|
||
* jqPlot can be customized by overriding the defaults of any of the objects which make
|
||
* up the plot. The general usage of jqplot is:
|
||
*
|
||
* > chart = $.jqplot('targetElemId', [dataArray,...], {optionsObject});
|
||
*
|
||
* The options available to jqplot are detailed in <jqPlot Options> in the jqPlotOptions.txt file.
|
||
*
|
||
* An actual call to $.jqplot() may look like the
|
||
* examples below:
|
||
*
|
||
* > chart = $.jqplot('chartdiv', [[[1, 2],[3,5.12],[5,13.1],[7,33.6],[9,85.9],[11,219.9]]]);
|
||
*
|
||
* or
|
||
*
|
||
* > dataArray = [34,12,43,55,77];
|
||
* > chart = $.jqplot('targetElemId', [dataArray, ...], {title:'My Plot', axes:{yaxis:{min:20, max:100}}});
|
||
*
|
||
* For more inforrmation, see <jqPlot Usage>.
|
||
*
|
||
* About: Usage
|
||
*
|
||
* See <jqPlot Usage>
|
||
*
|
||
* About: Available Options
|
||
*
|
||
* See <jqPlot Options> for a list of options available thorugh the options object (not complete yet!)
|
||
*
|
||
* About: Options Usage
|
||
*
|
||
* See <Options Tutorial>
|
||
*
|
||
* About: Changes
|
||
*
|
||
* See <Change Log>
|
||
*
|
||
*/
|
||
|
||
(function($) {
|
||
// make sure undefined is undefined
|
||
var undefined;
|
||
|
||
$.fn.emptyForce = function() {
|
||
for ( var i = 0, elem; (elem = $(this)[i]) != null; i++ ) {
|
||
// Remove element nodes and prevent memory leaks
|
||
if ( elem.nodeType === 1 ) {
|
||
jQuery.cleanData( elem.getElementsByTagName("*") );
|
||
}
|
||
|
||
// Remove any remaining nodes
|
||
if ($.jqplot_use_excanvas) {
|
||
elem.outerHTML = "";
|
||
}
|
||
else {
|
||
while ( elem.firstChild ) {
|
||
elem.removeChild( elem.firstChild );
|
||
}
|
||
}
|
||
|
||
elem = null;
|
||
}
|
||
|
||
return $(this);
|
||
};
|
||
|
||
$.fn.removeChildForce = function(parent) {
|
||
while ( parent.firstChild ) {
|
||
this.removeChildForce( parent.firstChild );
|
||
parent.removeChild( parent.firstChild );
|
||
}
|
||
};
|
||
|
||
|
||
/**
|
||
* Namespace: $.jqplot
|
||
* jQuery function called by the user to create a plot.
|
||
*
|
||
* Parameters:
|
||
* target - ID of target element to render the plot into.
|
||
* data - an array of data series.
|
||
* options - user defined options object. See the individual classes for available options.
|
||
*
|
||
* Properties:
|
||
* config - object to hold configuration information for jqPlot plot object.
|
||
*
|
||
* attributes:
|
||
* enablePlugins - False to disable plugins by default. Plugins must then be explicitly
|
||
* enabled in the individual plot options. Default: false.
|
||
* This property sets the "show" property of certain plugins to true or false.
|
||
* Only plugins that can be immediately active upon loading are affected. This includes
|
||
* non-renderer plugins like cursor, dragable, highlighter, and trendline.
|
||
* defaultHeight - Default height for plots where no css height specification exists. This
|
||
* is a jqplot wide default.
|
||
* defaultWidth - Default height for plots where no css height specification exists. This
|
||
* is a jqplot wide default.
|
||
*/
|
||
|
||
$.jqplot = function(target, data, options) {
|
||
var _data, _options;
|
||
|
||
if (options == null) {
|
||
if (jQuery.isArray(data)) {
|
||
_data = data;
|
||
_options = null;
|
||
}
|
||
|
||
else if (typeof(data) === 'object') {
|
||
_data = null;
|
||
_options = data;
|
||
}
|
||
}
|
||
else {
|
||
_data = data;
|
||
_options = options;
|
||
}
|
||
var plot = new jqPlot();
|
||
// remove any error class that may be stuck on target.
|
||
$('#'+target).removeClass('jqplot-error');
|
||
|
||
if ($.jqplot.config.catchErrors) {
|
||
try {
|
||
plot.init(target, _data, _options);
|
||
plot.draw();
|
||
plot.themeEngine.init.call(plot);
|
||
return plot;
|
||
}
|
||
catch(e) {
|
||
var msg = $.jqplot.config.errorMessage || e.message;
|
||
$('#'+target).append('<div class="jqplot-error-message">'+msg+'</div>');
|
||
$('#'+target).addClass('jqplot-error');
|
||
document.getElementById(target).style.background = $.jqplot.config.errorBackground;
|
||
document.getElementById(target).style.border = $.jqplot.config.errorBorder;
|
||
document.getElementById(target).style.fontFamily = $.jqplot.config.errorFontFamily;
|
||
document.getElementById(target).style.fontSize = $.jqplot.config.errorFontSize;
|
||
document.getElementById(target).style.fontStyle = $.jqplot.config.errorFontStyle;
|
||
document.getElementById(target).style.fontWeight = $.jqplot.config.errorFontWeight;
|
||
}
|
||
}
|
||
else {
|
||
plot.init(target, _data, _options);
|
||
plot.draw();
|
||
plot.themeEngine.init.call(plot);
|
||
return plot;
|
||
}
|
||
};
|
||
|
||
$.jqplot.version = "1.0.0b2_r947";
|
||
|
||
// canvas manager to reuse canvases on the plot.
|
||
// Should help solve problem of canvases not being freed and
|
||
// problem of waiting forever for firefox to decide to free memory.
|
||
$.jqplot.CanvasManager = function() {
|
||
// canvases are managed globally so that they can be reused
|
||
// across plots after they have been freed
|
||
if (typeof $.jqplot.CanvasManager.canvases == 'undefined') {
|
||
$.jqplot.CanvasManager.canvases = [];
|
||
$.jqplot.CanvasManager.free = [];
|
||
}
|
||
|
||
var myCanvases = [];
|
||
|
||
this.getCanvas = function() {
|
||
var canvas;
|
||
var makeNew = true;
|
||
|
||
if (!$.jqplot.use_excanvas) {
|
||
for (var i = 0, l = $.jqplot.CanvasManager.canvases.length; i < l; i++) {
|
||
if ($.jqplot.CanvasManager.free[i] === true) {
|
||
makeNew = false;
|
||
canvas = $.jqplot.CanvasManager.canvases[i];
|
||
// $(canvas).removeClass('jqplot-canvasManager-free').addClass('jqplot-canvasManager-inuse');
|
||
$.jqplot.CanvasManager.free[i] = false;
|
||
myCanvases.push(i);
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
|
||
if (makeNew) {
|
||
canvas = document.createElement('canvas');
|
||
myCanvases.push($.jqplot.CanvasManager.canvases.length);
|
||
$.jqplot.CanvasManager.canvases.push(canvas);
|
||
$.jqplot.CanvasManager.free.push(false);
|
||
}
|
||
|
||
return canvas;
|
||
};
|
||
|
||
// this method has to be used after settings the dimesions
|
||
// on the element returned by getCanvas()
|
||
this.initCanvas = function(canvas) {
|
||
if ($.jqplot.use_excanvas) {
|
||
return window.G_vmlCanvasManager.initElement(canvas);
|
||
}
|
||
return canvas;
|
||
};
|
||
|
||
this.freeAllCanvases = function() {
|
||
for (var i = 0, l=myCanvases.length; i < l; i++) {
|
||
this.freeCanvas(myCanvases[i]);
|
||
}
|
||
myCanvases = [];
|
||
};
|
||
|
||
this.freeCanvas = function(idx) {
|
||
if ($.jqplot.use_excanvas && window.G_vmlCanvasManager.uninitElement !== undefined) {
|
||
// excanvas can't be reused, but properly unset
|
||
window.G_vmlCanvasManager.uninitElement($.jqplot.CanvasManager.canvases[idx]);
|
||
$.jqplot.CanvasManager.canvases[idx] = null;
|
||
}
|
||
else {
|
||
var canvas = $.jqplot.CanvasManager.canvases[idx];
|
||
canvas.getContext('2d').clearRect(0, 0, canvas.width, canvas.height);
|
||
$(canvas).unbind().removeAttr('class').removeAttr('style');
|
||
// Style attributes seemed to be still hanging around. wierd. Some ticks
|
||
// still retained a left: 0px attribute after reusing a canvas.
|
||
$(canvas).css({left: '', top: '', position: ''});
|
||
// setting size to 0 may save memory of unused canvases?
|
||
canvas.width = 0;
|
||
canvas.height = 0;
|
||
$.jqplot.CanvasManager.free[idx] = true;
|
||
}
|
||
};
|
||
|
||
};
|
||
|
||
|
||
// Convienence function that won't hang IE or FF without FireBug.
|
||
$.jqplot.log = function() {
|
||
if (window.console) {
|
||
window.console.log.apply(window.console, arguments);
|
||
}
|
||
};
|
||
|
||
$.jqplot.config = {
|
||
enablePlugins:false,
|
||
defaultHeight:300,
|
||
defaultWidth:400,
|
||
UTCAdjust:false,
|
||
timezoneOffset: new Date(new Date().getTimezoneOffset() * 60000),
|
||
errorMessage: '',
|
||
errorBackground: '',
|
||
errorBorder: '',
|
||
errorFontFamily: '',
|
||
errorFontSize: '',
|
||
errorFontStyle: '',
|
||
errorFontWeight: '',
|
||
catchErrors: false,
|
||
defaultTickFormatString: "%.1f",
|
||
defaultColors: [ "#4bb2c5", "#EAA228", "#c5b47f", "#579575", "#839557", "#958c12", "#953579", "#4b5de4", "#d8b83f", "#ff5800", "#0085cc", "#c747a3", "#cddf54", "#FBD178", "#26B4E3", "#bd70c7"],
|
||
defaultNegativeColors: [ "#498991", "#C08840", "#9F9274", "#546D61", "#646C4A", "#6F6621", "#6E3F5F", "#4F64B0", "#A89050", "#C45923", "#187399", "#945381", "#959E5C", "#C7AF7B", "#478396", "#907294"],
|
||
dashLength: 4,
|
||
gapLength: 4,
|
||
dotGapLength: 2.5,
|
||
srcLocation: 'jqplot/src/',
|
||
pluginLocation: 'jqplot/src/plugins/'
|
||
};
|
||
|
||
|
||
$.jqplot.arrayMax = function( array ){
|
||
return Math.max.apply( Math, array );
|
||
};
|
||
|
||
$.jqplot.arrayMin = function( array ){
|
||
return Math.min.apply( Math, array );
|
||
};
|
||
|
||
$.jqplot.enablePlugins = $.jqplot.config.enablePlugins;
|
||
|
||
// canvas related tests taken from modernizer:
|
||
// Copyright (c) 2009 - 2010 Faruk Ates.
|
||
// http://www.modernizr.com
|
||
|
||
$.jqplot.support_canvas = function() {
|
||
if (typeof $.jqplot.support_canvas.result == 'undefined') {
|
||
$.jqplot.support_canvas.result = !!document.createElement('canvas').getContext;
|
||
}
|
||
return $.jqplot.support_canvas.result;
|
||
};
|
||
|
||
$.jqplot.support_canvas_text = function() {
|
||
if (typeof $.jqplot.support_canvas_text.result == 'undefined') {
|
||
if (window.G_vmlCanvasManager !== undefined && window.G_vmlCanvasManager._version > 887) {
|
||
$.jqplot.support_canvas_text.result = true;
|
||
}
|
||
else {
|
||
$.jqplot.support_canvas_text.result = !!(document.createElement('canvas').getContext && typeof document.createElement('canvas').getContext('2d').fillText == 'function');
|
||
}
|
||
|
||
}
|
||
return $.jqplot.support_canvas_text.result;
|
||
};
|
||
|
||
$.jqplot.use_excanvas = ($.browser.msie && !$.jqplot.support_canvas()) ? true : false;
|
||
|
||
/**
|
||
*
|
||
* Hooks: jqPlot Pugin Hooks
|
||
*
|
||
* $.jqplot.preInitHooks - called before initialization.
|
||
* $.jqplot.postInitHooks - called after initialization.
|
||
* $.jqplot.preParseOptionsHooks - called before user options are parsed.
|
||
* $.jqplot.postParseOptionsHooks - called after user options are parsed.
|
||
* $.jqplot.preDrawHooks - called before plot draw.
|
||
* $.jqplot.postDrawHooks - called after plot draw.
|
||
* $.jqplot.preDrawSeriesHooks - called before each series is drawn.
|
||
* $.jqplot.postDrawSeriesHooks - called after each series is drawn.
|
||
* $.jqplot.preDrawLegendHooks - called before the legend is drawn.
|
||
* $.jqplot.addLegendRowHooks - called at the end of legend draw, so plugins
|
||
* can add rows to the legend table.
|
||
* $.jqplot.preSeriesInitHooks - called before series is initialized.
|
||
* $.jqplot.postSeriesInitHooks - called after series is initialized.
|
||
* $.jqplot.preParseSeriesOptionsHooks - called before series related options
|
||
* are parsed.
|
||
* $.jqplot.postParseSeriesOptionsHooks - called after series related options
|
||
* are parsed.
|
||
* $.jqplot.eventListenerHooks - called at the end of plot drawing, binds
|
||
* listeners to the event canvas which lays on top of the grid area.
|
||
* $.jqplot.preDrawSeriesShadowHooks - called before series shadows are drawn.
|
||
* $.jqplot.postDrawSeriesShadowHooks - called after series shadows are drawn.
|
||
*
|
||
*/
|
||
|
||
$.jqplot.preInitHooks = [];
|
||
$.jqplot.postInitHooks = [];
|
||
$.jqplot.preParseOptionsHooks = [];
|
||
$.jqplot.postParseOptionsHooks = [];
|
||
$.jqplot.preDrawHooks = [];
|
||
$.jqplot.postDrawHooks = [];
|
||
$.jqplot.preDrawSeriesHooks = [];
|
||
$.jqplot.postDrawSeriesHooks = [];
|
||
$.jqplot.preDrawLegendHooks = [];
|
||
$.jqplot.addLegendRowHooks = [];
|
||
$.jqplot.preSeriesInitHooks = [];
|
||
$.jqplot.postSeriesInitHooks = [];
|
||
$.jqplot.preParseSeriesOptionsHooks = [];
|
||
$.jqplot.postParseSeriesOptionsHooks = [];
|
||
$.jqplot.eventListenerHooks = [];
|
||
$.jqplot.preDrawSeriesShadowHooks = [];
|
||
$.jqplot.postDrawSeriesShadowHooks = [];
|
||
|
||
// A superclass holding some common properties and methods.
|
||
$.jqplot.ElemContainer = function() {
|
||
this._elem;
|
||
this._plotWidth;
|
||
this._plotHeight;
|
||
this._plotDimensions = {height:null, width:null};
|
||
};
|
||
|
||
$.jqplot.ElemContainer.prototype.createElement = function(el, offsets, clss, cssopts, attrib) {
|
||
this._offsets = offsets;
|
||
var klass = clss || 'jqplot';
|
||
var elem = document.createElement(el);
|
||
this._elem = $(elem);
|
||
this._elem.addClass(klass);
|
||
this._elem.css(cssopts);
|
||
this._elem.attr(attrib);
|
||
// avoid memory leak;
|
||
elem = null;
|
||
return this._elem;
|
||
};
|
||
|
||
$.jqplot.ElemContainer.prototype.getWidth = function() {
|
||
if (this._elem) {
|
||
return this._elem.outerWidth(true);
|
||
}
|
||
else {
|
||
return null;
|
||
}
|
||
};
|
||
|
||
$.jqplot.ElemContainer.prototype.getHeight = function() {
|
||
if (this._elem) {
|
||
return this._elem.outerHeight(true);
|
||
}
|
||
else {
|
||
return null;
|
||
}
|
||
};
|
||
|
||
$.jqplot.ElemContainer.prototype.getPosition = function() {
|
||
if (this._elem) {
|
||
return this._elem.position();
|
||
}
|
||
else {
|
||
return {top:null, left:null, bottom:null, right:null};
|
||
}
|
||
};
|
||
|
||
$.jqplot.ElemContainer.prototype.getTop = function() {
|
||
return this.getPosition().top;
|
||
};
|
||
|
||
$.jqplot.ElemContainer.prototype.getLeft = function() {
|
||
return this.getPosition().left;
|
||
};
|
||
|
||
$.jqplot.ElemContainer.prototype.getBottom = function() {
|
||
return this._elem.css('bottom');
|
||
};
|
||
|
||
$.jqplot.ElemContainer.prototype.getRight = function() {
|
||
return this._elem.css('right');
|
||
};
|
||
|
||
|
||
/**
|
||
* Class: Axis
|
||
* An individual axis object. Cannot be instantiated directly, but created
|
||
* by the Plot oject. Axis properties can be set or overriden by the
|
||
* options passed in from the user.
|
||
*
|
||
*/
|
||
function Axis(name) {
|
||
$.jqplot.ElemContainer.call(this);
|
||
// Group: Properties
|
||
//
|
||
// Axes options are specified within an axes object at the top level of the
|
||
// plot options like so:
|
||
// > {
|
||
// > axes: {
|
||
// > xaxis: {min: 5},
|
||
// > yaxis: {min: 2, max: 8, numberTicks:4},
|
||
// > x2axis: {pad: 1.5},
|
||
// > y2axis: {ticks:[22, 44, 66, 88]}
|
||
// > }
|
||
// > }
|
||
// There are 2 x axes, 'xaxis' and 'x2axis', and
|
||
// 9 yaxes, 'yaxis', 'y2axis'. 'y3axis', ... Any or all of which may be specified.
|
||
this.name = name;
|
||
this._series = [];
|
||
// prop: show
|
||
// Wether to display the axis on the graph.
|
||
this.show = false;
|
||
// prop: tickRenderer
|
||
// A class of a rendering engine for creating the ticks labels displayed on the plot,
|
||
// See <$.jqplot.AxisTickRenderer>.
|
||
this.tickRenderer = $.jqplot.AxisTickRenderer;
|
||
// prop: tickOptions
|
||
// Options that will be passed to the tickRenderer, see <$.jqplot.AxisTickRenderer> options.
|
||
this.tickOptions = {};
|
||
// prop: labelRenderer
|
||
// A class of a rendering engine for creating an axis label.
|
||
this.labelRenderer = $.jqplot.AxisLabelRenderer;
|
||
// prop: labelOptions
|
||
// Options passed to the label renderer.
|
||
this.labelOptions = {};
|
||
// prop: label
|
||
// Label for the axis
|
||
this.label = null;
|
||
// prop: showLabel
|
||
// true to show the axis label.
|
||
this.showLabel = true;
|
||
// prop: min
|
||
// minimum value of the axis (in data units, not pixels).
|
||
this.min = null;
|
||
// prop: max
|
||
// maximum value of the axis (in data units, not pixels).
|
||
this.max = null;
|
||
// prop: autoscale
|
||
// DEPRECATED
|
||
// the default scaling algorithm produces superior results.
|
||
this.autoscale = false;
|
||
// prop: pad
|
||
// Padding to extend the range above and below the data bounds.
|
||
// The data range is multiplied by this factor to determine minimum and maximum axis bounds.
|
||
// A value of 0 will be interpreted to mean no padding, and pad will be set to 1.0.
|
||
this.pad = 1.2;
|
||
// prop: padMax
|
||
// Padding to extend the range above data bounds.
|
||
// The top of the data range is multiplied by this factor to determine maximum axis bounds.
|
||
// A value of 0 will be interpreted to mean no padding, and padMax will be set to 1.0.
|
||
this.padMax = null;
|
||
// prop: padMin
|
||
// Padding to extend the range below data bounds.
|
||
// The bottom of the data range is multiplied by this factor to determine minimum axis bounds.
|
||
// A value of 0 will be interpreted to mean no padding, and padMin will be set to 1.0.
|
||
this.padMin = null;
|
||
// prop: ticks
|
||
// 1D [val, val, ...] or 2D [[val, label], [val, label], ...] array of ticks for the axis.
|
||
// If no label is specified, the value is formatted into an appropriate label.
|
||
this.ticks = [];
|
||
// prop: numberTicks
|
||
// Desired number of ticks. Default is to compute automatically.
|
||
this.numberTicks;
|
||
// prop: tickInterval
|
||
// number of units between ticks. Mutually exclusive with numberTicks.
|
||
this.tickInterval;
|
||
// prop: renderer
|
||
// A class of a rendering engine that handles tick generation,
|
||
// scaling input data to pixel grid units and drawing the axis element.
|
||
this.renderer = $.jqplot.LinearAxisRenderer;
|
||
// prop: rendererOptions
|
||
// renderer specific options. See <$.jqplot.LinearAxisRenderer> for options.
|
||
this.rendererOptions = {};
|
||
// prop: showTicks
|
||
// Wether to show the ticks (both marks and labels) or not.
|
||
// Will not override showMark and showLabel options if specified on the ticks themselves.
|
||
this.showTicks = true;
|
||
// prop: showTickMarks
|
||
// Wether to show the tick marks (line crossing grid) or not.
|
||
// Overridden by showTicks and showMark option of tick itself.
|
||
this.showTickMarks = true;
|
||
// prop: showMinorTicks
|
||
// Wether or not to show minor ticks. This is renderer dependent.
|
||
this.showMinorTicks = true;
|
||
// prop: drawMajorGridlines
|
||
// True to draw gridlines for major axis ticks.
|
||
this.drawMajorGridlines = true;
|
||
// prop: drawMinorGridlines
|
||
// True to draw gridlines for minor ticks.
|
||
this.drawMinorGridlines = false;
|
||
// prop: drawMajorTickMarks
|
||
// True to draw tick marks for major axis ticks.
|
||
this.drawMajorTickMarks = true;
|
||
// prop: drawMinorTickMarks
|
||
// True to draw tick marks for minor ticks. This is renderer dependent.
|
||
this.drawMinorTickMarks = true;
|
||
// prop: useSeriesColor
|
||
// Use the color of the first series associated with this axis for the
|
||
// tick marks and line bordering this axis.
|
||
this.useSeriesColor = false;
|
||
// prop: borderWidth
|
||
// width of line stroked at the border of the axis. Defaults
|
||
// to the width of the grid boarder.
|
||
this.borderWidth = null;
|
||
// prop: borderColor
|
||
// color of the border adjacent to the axis. Defaults to grid border color.
|
||
this.borderColor = null;
|
||
// minimum and maximum values on the axis.
|
||
this._dataBounds = {min:null, max:null};
|
||
// statistics (min, max, mean) as well as actual data intervals for each series attached to axis.
|
||
// holds collection of {intervals:[], min:, max:, mean: } objects for each series on axis.
|
||
this._intervalStats = [];
|
||
// pixel position from the top left of the min value and max value on the axis.
|
||
this._offsets = {min:null, max:null};
|
||
this._ticks=[];
|
||
this._label = null;
|
||
// prop: syncTicks
|
||
// true to try and synchronize tick spacing across multiple axes so that ticks and
|
||
// grid lines line up. This has an impact on autoscaling algorithm, however.
|
||
// In general, autoscaling an individual axis will work better if it does not
|
||
// have to sync ticks.
|
||
this.syncTicks = null;
|
||
// prop: tickSpacing
|
||
// Approximate pixel spacing between ticks on graph. Used during autoscaling.
|
||
// This number will be an upper bound, actual spacing will be less.
|
||
this.tickSpacing = 75;
|
||
// Properties to hold the original values for min, max, ticks, tickInterval and numberTicks
|
||
// so they can be restored if altered by plugins.
|
||
this._min = null;
|
||
this._max = null;
|
||
this._tickInterval = null;
|
||
this._numberTicks = null;
|
||
this.__ticks = null;
|
||
// hold original user options.
|
||
this._options = {};
|
||
}
|
||
|
||
Axis.prototype = new $.jqplot.ElemContainer();
|
||
Axis.prototype.constructor = Axis;
|
||
|
||
Axis.prototype.init = function() {
|
||
this.renderer = new this.renderer();
|
||
// set the axis name
|
||
this.tickOptions.axis = this.name;
|
||
// if showMark or showLabel tick options not specified, use value of axis option.
|
||
// showTicks overrides showTickMarks.
|
||
if (this.tickOptions.showMark == null) {
|
||
this.tickOptions.showMark = this.showTicks;
|
||
}
|
||
if (this.tickOptions.showMark == null) {
|
||
this.tickOptions.showMark = this.showTickMarks;
|
||
}
|
||
if (this.tickOptions.showLabel == null) {
|
||
this.tickOptions.showLabel = this.showTicks;
|
||
}
|
||
|
||
if (this.label == null || this.label == '') {
|
||
this.showLabel = false;
|
||
}
|
||
else {
|
||
this.labelOptions.label = this.label;
|
||
}
|
||
if (this.showLabel == false) {
|
||
this.labelOptions.show = false;
|
||
}
|
||
// set the default padMax, padMin if not specified
|
||
// special check, if no padding desired, padding
|
||
// should be set to 1.0
|
||
if (this.pad == 0) {
|
||
this.pad = 1.0;
|
||
}
|
||
if (this.padMax == 0) {
|
||
this.padMax = 1.0;
|
||
}
|
||
if (this.padMin == 0) {
|
||
this.padMin = 1.0;
|
||
}
|
||
if (this.padMax == null) {
|
||
this.padMax = (this.pad-1)/2 + 1;
|
||
}
|
||
if (this.padMin == null) {
|
||
this.padMin = (this.pad-1)/2 + 1;
|
||
}
|
||
// now that padMin and padMax are correctly set, reset pad in case user has supplied
|
||
// padMin and/or padMax
|
||
this.pad = this.padMax + this.padMin - 1;
|
||
if (this.min != null || this.max != null) {
|
||
this.autoscale = false;
|
||
}
|
||
// if not set, sync ticks for y axes but not x by default.
|
||
if (this.syncTicks == null && this.name.indexOf('y') > -1) {
|
||
this.syncTicks = true;
|
||
}
|
||
else if (this.syncTicks == null){
|
||
this.syncTicks = false;
|
||
}
|
||
this.renderer.init.call(this, this.rendererOptions);
|
||
|
||
};
|
||
|
||
Axis.prototype.draw = function(ctx, plot) {
|
||
// Memory Leaks patch
|
||
if (this.__ticks) {
|
||
this.__ticks = null;
|
||
}
|
||
|
||
return this.renderer.draw.call(this, ctx, plot);
|
||
|
||
};
|
||
|
||
Axis.prototype.set = function() {
|
||
this.renderer.set.call(this);
|
||
};
|
||
|
||
Axis.prototype.pack = function(pos, offsets) {
|
||
if (this.show) {
|
||
this.renderer.pack.call(this, pos, offsets);
|
||
}
|
||
// these properties should all be available now.
|
||
if (this._min == null) {
|
||
this._min = this.min;
|
||
this._max = this.max;
|
||
this._tickInterval = this.tickInterval;
|
||
this._numberTicks = this.numberTicks;
|
||
this.__ticks = this._ticks;
|
||
}
|
||
};
|
||
|
||
// reset the axis back to original values if it has been scaled, zoomed, etc.
|
||
Axis.prototype.reset = function() {
|
||
this.renderer.reset.call(this);
|
||
};
|
||
|
||
Axis.prototype.resetScale = function(opts) {
|
||
$.extend(true, this, {min: null, max: null, numberTicks: null, tickInterval: null, _ticks: [], ticks: []}, opts);
|
||
this.resetDataBounds();
|
||
};
|
||
|
||
Axis.prototype.resetDataBounds = function() {
|
||
// Go through all the series attached to this axis and find
|
||
// the min/max bounds for this axis.
|
||
var db = this._dataBounds;
|
||
db.min = null;
|
||
db.max = null;
|
||
var l, s, d;
|
||
// check for when to force min 0 on bar series plots.
|
||
var doforce = (this.show) ? true : false;
|
||
for (var i=0; i<this._series.length; i++) {
|
||
s = this._series[i];
|
||
d = s._plotData;
|
||
if (s._type === 'line' && s.renderer.bands.show && this.name.charAt(0) !== 'x') {
|
||
d = [[0, s.renderer.bands._min], [1, s.renderer.bands._max]];
|
||
}
|
||
|
||
var minyidx = 1, maxyidx = 1;
|
||
|
||
if (s._type != null && s._type == 'ohlc') {
|
||
minyidx = 3;
|
||
maxyidx = 2;
|
||
}
|
||
|
||
for (var j=0, l=d.length; j<l; j++) {
|
||
if (this.name == 'xaxis' || this.name == 'x2axis') {
|
||
if ((d[j][0] != null && d[j][0] < db.min) || db.min == null) {
|
||
db.min = d[j][0];
|
||
}
|
||
if ((d[j][0] != null && d[j][0] > db.max) || db.max == null) {
|
||
db.max = d[j][0];
|
||
}
|
||
}
|
||
else {
|
||
if ((d[j][minyidx] != null && d[j][minyidx] < db.min) || db.min == null) {
|
||
db.min = d[j][minyidx];
|
||
}
|
||
if ((d[j][maxyidx] != null && d[j][maxyidx] > db.max) || db.max == null) {
|
||
db.max = d[j][maxyidx];
|
||
}
|
||
}
|
||
}
|
||
|
||
// Hack to not pad out bottom of bar plots unless user has specified a padding.
|
||
// every series will have a chance to set doforce to false. once it is set to
|
||
// false, it cannot be reset to true.
|
||
// If any series attached to axis is not a bar, wont force 0.
|
||
if (doforce && s.renderer.constructor !== $.jqplot.BarRenderer) {
|
||
doforce = false;
|
||
}
|
||
|
||
else if (doforce && this._options.hasOwnProperty('forceTickAt0') && this._options.forceTickAt0 == false) {
|
||
doforce = false;
|
||
}
|
||
|
||
else if (doforce && s.renderer.constructor === $.jqplot.BarRenderer) {
|
||
if (s.barDirection == 'vertical' && this.name != 'xaxis' && this.name != 'x2axis') {
|
||
if (this._options.pad != null || this._options.padMin != null) {
|
||
doforce = false;
|
||
}
|
||
}
|
||
|
||
else if (s.barDirection == 'horizontal' && (this.name == 'xaxis' || this.name == 'x2axis')) {
|
||
if (this._options.pad != null || this._options.padMin != null) {
|
||
doforce = false;
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
if (doforce && this.renderer.constructor === $.jqplot.LinearAxisRenderer && db.min >= 0) {
|
||
this.padMin = 1.0;
|
||
this.forceTickAt0 = true;
|
||
}
|
||
};
|
||
|
||
/**
|
||
* Class: Legend
|
||
* Legend object. Cannot be instantiated directly, but created
|
||
* by the Plot oject. Legend properties can be set or overriden by the
|
||
* options passed in from the user.
|
||
*/
|
||
function Legend(options) {
|
||
$.jqplot.ElemContainer.call(this);
|
||
// Group: Properties
|
||
|
||
// prop: show
|
||
// Wether to display the legend on the graph.
|
||
this.show = false;
|
||
// prop: location
|
||
// Placement of the legend. one of the compass directions: nw, n, ne, e, se, s, sw, w
|
||
this.location = 'ne';
|
||
// prop: labels
|
||
// Array of labels to use. By default the renderer will look for labels on the series.
|
||
// Labels specified in this array will override labels specified on the series.
|
||
this.labels = [];
|
||
// prop: showLabels
|
||
// true to show the label text on the legend.
|
||
this.showLabels = true;
|
||
// prop: showSwatch
|
||
// true to show the color swatches on the legend.
|
||
this.showSwatches = true;
|
||
// prop: placement
|
||
// "insideGrid" places legend inside the grid area of the plot.
|
||
// "outsideGrid" places the legend outside the grid but inside the plot container,
|
||
// shrinking the grid to accomodate the legend.
|
||
// "inside" synonym for "insideGrid",
|
||
// "outside" places the legend ouside the grid area, but does not shrink the grid which
|
||
// can cause the legend to overflow the plot container.
|
||
this.placement = "insideGrid";
|
||
// prop: xoffset
|
||
// DEPRECATED. Set the margins on the legend using the marginTop, marginLeft, etc.
|
||
// properties or via CSS margin styling of the .jqplot-table-legend class.
|
||
this.xoffset = 0;
|
||
// prop: yoffset
|
||
// DEPRECATED. Set the margins on the legend using the marginTop, marginLeft, etc.
|
||
// properties or via CSS margin styling of the .jqplot-table-legend class.
|
||
this.yoffset = 0;
|
||
// prop: border
|
||
// css spec for the border around the legend box.
|
||
this.border;
|
||
// prop: background
|
||
// css spec for the background of the legend box.
|
||
this.background;
|
||
// prop: textColor
|
||
// css color spec for the legend text.
|
||
this.textColor;
|
||
// prop: fontFamily
|
||
// css font-family spec for the legend text.
|
||
this.fontFamily;
|
||
// prop: fontSize
|
||
// css font-size spec for the legend text.
|
||
this.fontSize ;
|
||
// prop: rowSpacing
|
||
// css padding-top spec for the rows in the legend.
|
||
this.rowSpacing = '0.5em';
|
||
// renderer
|
||
// A class that will create a DOM object for the legend,
|
||
// see <$.jqplot.TableLegendRenderer>.
|
||
this.renderer = $.jqplot.TableLegendRenderer;
|
||
// prop: rendererOptions
|
||
// renderer specific options passed to the renderer.
|
||
this.rendererOptions = {};
|
||
// prop: predraw
|
||
// Wether to draw the legend before the series or not.
|
||
// Used with series specific legend renderers for pie, donut, mekko charts, etc.
|
||
this.preDraw = false;
|
||
// prop: marginTop
|
||
// CSS margin for the legend DOM element. This will set an element
|
||
// CSS style for the margin which will override any style sheet setting.
|
||
// The default will be taken from the stylesheet.
|
||
this.marginTop = null;
|
||
// prop: marginRight
|
||
// CSS margin for the legend DOM element. This will set an element
|
||
// CSS style for the margin which will override any style sheet setting.
|
||
// The default will be taken from the stylesheet.
|
||
this.marginRight = null;
|
||
// prop: marginBottom
|
||
// CSS margin for the legend DOM element. This will set an element
|
||
// CSS style for the margin which will override any style sheet setting.
|
||
// The default will be taken from the stylesheet.
|
||
this.marginBottom = null;
|
||
// prop: marginLeft
|
||
// CSS margin for the legend DOM element. This will set an element
|
||
// CSS style for the margin which will override any style sheet setting.
|
||
// The default will be taken from the stylesheet.
|
||
this.marginLeft = null;
|
||
// prop: escapeHtml
|
||
// True to escape special characters with their html entity equivalents
|
||
// in legend text. "<" becomes < and so on, so html tags are not rendered.
|
||
this.escapeHtml = false;
|
||
this._series = [];
|
||
|
||
$.extend(true, this, options);
|
||
}
|
||
|
||
Legend.prototype = new $.jqplot.ElemContainer();
|
||
Legend.prototype.constructor = Legend;
|
||
|
||
Legend.prototype.setOptions = function(options) {
|
||
$.extend(true, this, options);
|
||
|
||
// Try to emulate deprecated behaviour
|
||
// if user has specified xoffset or yoffset, copy these to
|
||
// the margin properties.
|
||
|
||
if (this.placement == 'inside') {
|
||
this.placement = 'insideGrid';
|
||
}
|
||
|
||
if (this.xoffset >0) {
|
||
if (this.placement == 'insideGrid') {
|
||
switch (this.location) {
|
||
case 'nw':
|
||
case 'w':
|
||
case 'sw':
|
||
if (this.marginLeft == null) {
|
||
this.marginLeft = this.xoffset + 'px';
|
||
}
|
||
this.marginRight = '0px';
|
||
break;
|
||
case 'ne':
|
||
case 'e':
|
||
case 'se':
|
||
default:
|
||
if (this.marginRight == null) {
|
||
this.marginRight = this.xoffset + 'px';
|
||
}
|
||
this.marginLeft = '0px';
|
||
break;
|
||
}
|
||
}
|
||
else if (this.placement == 'outside') {
|
||
switch (this.location) {
|
||
case 'nw':
|
||
case 'w':
|
||
case 'sw':
|
||
if (this.marginRight == null) {
|
||
this.marginRight = this.xoffset + 'px';
|
||
}
|
||
this.marginLeft = '0px';
|
||
break;
|
||
case 'ne':
|
||
case 'e':
|
||
case 'se':
|
||
default:
|
||
if (this.marginLeft == null) {
|
||
this.marginLeft = this.xoffset + 'px';
|
||
}
|
||
this.marginRight = '0px';
|
||
break;
|
||
}
|
||
}
|
||
this.xoffset = 0;
|
||
}
|
||
|
||
if (this.yoffset >0) {
|
||
if (this.placement == 'outside') {
|
||
switch (this.location) {
|
||
case 'sw':
|
||
case 's':
|
||
case 'se':
|
||
if (this.marginTop == null) {
|
||
this.marginTop = this.yoffset + 'px';
|
||
}
|
||
this.marginBottom = '0px';
|
||
break;
|
||
case 'ne':
|
||
case 'n':
|
||
case 'nw':
|
||
default:
|
||
if (this.marginBottom == null) {
|
||
this.marginBottom = this.yoffset + 'px';
|
||
}
|
||
this.marginTop = '0px';
|
||
break;
|
||
}
|
||
}
|
||
else if (this.placement == 'insideGrid') {
|
||
switch (this.location) {
|
||
case 'sw':
|
||
case 's':
|
||
case 'se':
|
||
if (this.marginBottom == null) {
|
||
this.marginBottom = this.yoffset + 'px';
|
||
}
|
||
this.marginTop = '0px';
|
||
break;
|
||
case 'ne':
|
||
case 'n':
|
||
case 'nw':
|
||
default:
|
||
if (this.marginTop == null) {
|
||
this.marginTop = this.yoffset + 'px';
|
||
}
|
||
this.marginBottom = '0px';
|
||
break;
|
||
}
|
||
}
|
||
this.yoffset = 0;
|
||
}
|
||
|
||
// TO-DO:
|
||
// Handle case where offsets are < 0.
|
||
//
|
||
};
|
||
|
||
Legend.prototype.init = function() {
|
||
this.renderer = new this.renderer();
|
||
this.renderer.init.call(this, this.rendererOptions);
|
||
};
|
||
|
||
Legend.prototype.draw = function(offsets) {
|
||
for (var i=0; i<$.jqplot.preDrawLegendHooks.length; i++){
|
||
$.jqplot.preDrawLegendHooks[i].call(this, offsets);
|
||
}
|
||
return this.renderer.draw.call(this, offsets);
|
||
};
|
||
|
||
Legend.prototype.pack = function(offsets) {
|
||
this.renderer.pack.call(this, offsets);
|
||
};
|
||
|
||
/**
|
||
* Class: Title
|
||
* Plot Title object. Cannot be instantiated directly, but created
|
||
* by the Plot oject. Title properties can be set or overriden by the
|
||
* options passed in from the user.
|
||
*
|
||
* Parameters:
|
||
* text - text of the title.
|
||
*/
|
||
function Title(text) {
|
||
$.jqplot.ElemContainer.call(this);
|
||
// Group: Properties
|
||
|
||
// prop: text
|
||
// text of the title;
|
||
this.text = text;
|
||
// prop: show
|
||
// wether or not to show the title
|
||
this.show = true;
|
||
// prop: fontFamily
|
||
// css font-family spec for the text.
|
||
this.fontFamily;
|
||
// prop: fontSize
|
||
// css font-size spec for the text.
|
||
this.fontSize ;
|
||
// prop: textAlign
|
||
// css text-align spec for the text.
|
||
this.textAlign;
|
||
// prop: textColor
|
||
// css color spec for the text.
|
||
this.textColor;
|
||
// prop: renderer
|
||
// A class for creating a DOM element for the title,
|
||
// see <$.jqplot.DivTitleRenderer>.
|
||
this.renderer = $.jqplot.DivTitleRenderer;
|
||
// prop: rendererOptions
|
||
// renderer specific options passed to the renderer.
|
||
this.rendererOptions = {};
|
||
// prop: escapeHtml
|
||
// True to escape special characters with their html entity equivalents
|
||
// in title text. "<" becomes < and so on, so html tags are not rendered.
|
||
this.escapeHtml = false;
|
||
}
|
||
|
||
Title.prototype = new $.jqplot.ElemContainer();
|
||
Title.prototype.constructor = Title;
|
||
|
||
Title.prototype.init = function() {
|
||
this.renderer = new this.renderer();
|
||
this.renderer.init.call(this, this.rendererOptions);
|
||
};
|
||
|
||
Title.prototype.draw = function(width) {
|
||
return this.renderer.draw.call(this, width);
|
||
};
|
||
|
||
Title.prototype.pack = function() {
|
||
this.renderer.pack.call(this);
|
||
};
|
||
|
||
|
||
/**
|
||
* Class: Series
|
||
* An individual data series object. Cannot be instantiated directly, but created
|
||
* by the Plot oject. Series properties can be set or overriden by the
|
||
* options passed in from the user.
|
||
*/
|
||
function Series() {
|
||
$.jqplot.ElemContainer.call(this);
|
||
// Group: Properties
|
||
// Properties will be assigned from a series array at the top level of the
|
||
// options. If you had two series and wanted to change the color and line
|
||
// width of the first and set the second to use the secondary y axis with
|
||
// no shadow and supply custom labels for each:
|
||
// > {
|
||
// > series:[
|
||
// > {color: '#ff4466', lineWidth: 5, label:'good line'},
|
||
// > {yaxis: 'y2axis', shadow: false, label:'bad line'}
|
||
// > ]
|
||
// > }
|
||
|
||
// prop: show
|
||
// wether or not to draw the series.
|
||
this.show = true;
|
||
// prop: xaxis
|
||
// which x axis to use with this series, either 'xaxis' or 'x2axis'.
|
||
this.xaxis = 'xaxis';
|
||
this._xaxis;
|
||
// prop: yaxis
|
||
// which y axis to use with this series, either 'yaxis' or 'y2axis'.
|
||
this.yaxis = 'yaxis';
|
||
this._yaxis;
|
||
this.gridBorderWidth = 2.0;
|
||
// prop: renderer
|
||
// A class of a renderer which will draw the series,
|
||
// see <$.jqplot.LineRenderer>.
|
||
this.renderer = $.jqplot.LineRenderer;
|
||
// prop: rendererOptions
|
||
// Options to pass on to the renderer.
|
||
this.rendererOptions = {};
|
||
this.data = [];
|
||
this.gridData = [];
|
||
// prop: label
|
||
// Line label to use in the legend.
|
||
this.label = '';
|
||
// prop: showLabel
|
||
// true to show label for this series in the legend.
|
||
this.showLabel = true;
|
||
// prop: color
|
||
// css color spec for the series
|
||
this.color;
|
||
// prop: negativeColor
|
||
// css color spec used for filled (area) plots that are filled to zero and
|
||
// the "useNegativeColors" option is true.
|
||
this.negativeColor;
|
||
// prop: lineWidth
|
||
// width of the line in pixels. May have different meanings depending on renderer.
|
||
this.lineWidth = 2.5;
|
||
// prop: lineJoin
|
||
// Canvas lineJoin style between segments of series.
|
||
this.lineJoin = 'round';
|
||
// prop: lineCap
|
||
// Canvas lineCap style at ends of line.
|
||
this.lineCap = 'round';
|
||
// prop: linePattern
|
||
// line pattern 'dashed', 'dotted', 'solid', some combination
|
||
// of '-' and '.' characters such as '.-.' or a numerical array like
|
||
// [draw, skip, draw, skip, ...] such as [1, 10] to draw a dotted line,
|
||
// [1, 10, 20, 10] to draw a dot-dash line, and so on.
|
||
this.linePattern = 'solid';
|
||
this.shadow = true;
|
||
// prop: shadowAngle
|
||
// Shadow angle in degrees
|
||
this.shadowAngle = 45;
|
||
// prop: shadowOffset
|
||
// Shadow offset from line in pixels
|
||
this.shadowOffset = 1.25;
|
||
// prop: shadowDepth
|
||
// Number of times shadow is stroked, each stroke offset shadowOffset from the last.
|
||
this.shadowDepth = 3;
|
||
// prop: shadowAlpha
|
||
// Alpha channel transparency of shadow. 0 = transparent.
|
||
this.shadowAlpha = '0.1';
|
||
// prop: breakOnNull
|
||
// Wether line segments should be be broken at null value.
|
||
// False will join point on either side of line.
|
||
this.breakOnNull = false;
|
||
// prop: markerRenderer
|
||
// A class of a renderer which will draw marker (e.g. circle, square, ...) at the data points,
|
||
// see <$.jqplot.MarkerRenderer>.
|
||
this.markerRenderer = $.jqplot.MarkerRenderer;
|
||
// prop: markerOptions
|
||
// renderer specific options to pass to the markerRenderer,
|
||
// see <$.jqplot.MarkerRenderer>.
|
||
this.markerOptions = {};
|
||
// prop: showLine
|
||
// wether to actually draw the line or not. Series will still be renderered, even if no line is drawn.
|
||
this.showLine = true;
|
||
// prop: showMarker
|
||
// wether or not to show the markers at the data points.
|
||
this.showMarker = true;
|
||
// prop: index
|
||
// 0 based index of this series in the plot series array.
|
||
this.index;
|
||
// prop: fill
|
||
// true or false, wether to fill under lines or in bars.
|
||
// May not be implemented in all renderers.
|
||
this.fill = false;
|
||
// prop: fillColor
|
||
// CSS color spec to use for fill under line. Defaults to line color.
|
||
this.fillColor;
|
||
// prop: fillAlpha
|
||
// Alpha transparency to apply to the fill under the line.
|
||
// Use this to adjust alpha separate from fill color.
|
||
this.fillAlpha;
|
||
// prop: fillAndStroke
|
||
// If true will stroke the line (with color this.color) as well as fill under it.
|
||
// Applies only when fill is true.
|
||
this.fillAndStroke = false;
|
||
// prop: disableStack
|
||
// true to not stack this series with other series in the plot.
|
||
// To render properly, non-stacked series must come after any stacked series
|
||
// in the plot's data series array. So, the plot's data series array would look like:
|
||
// > [stackedSeries1, stackedSeries2, ..., nonStackedSeries1, nonStackedSeries2, ...]
|
||
// disableStack will put a gap in the stacking order of series, and subsequent
|
||
// stacked series will not fill down through the non-stacked series and will
|
||
// most likely not stack properly on top of the non-stacked series.
|
||
this.disableStack = false;
|
||
// _stack is set by the Plot if the plot is a stacked chart.
|
||
// will stack lines or bars on top of one another to build a "mountain" style chart.
|
||
// May not be implemented in all renderers.
|
||
this._stack = false;
|
||
// prop: neighborThreshold
|
||
// how close or far (in pixels) the cursor must be from a point marker to detect the point.
|
||
this.neighborThreshold = 4;
|
||
// prop: fillToZero
|
||
// true will force bar and filled series to fill toward zero on the fill Axis.
|
||
this.fillToZero = false;
|
||
// prop: fillToValue
|
||
// fill a filled series to this value on the fill axis.
|
||
// Works in conjunction with fillToZero, so that must be true.
|
||
this.fillToValue = 0;
|
||
// prop: fillAxis
|
||
// Either 'x' or 'y'. Which axis to fill the line toward if fillToZero is true.
|
||
// 'y' means fill up/down to 0 on the y axis for this series.
|
||
this.fillAxis = 'y';
|
||
// prop: useNegativeColors
|
||
// true to color negative values differently in filled and bar charts.
|
||
this.useNegativeColors = true;
|
||
this._stackData = [];
|
||
// _plotData accounts for stacking. If plots not stacked, _plotData and data are same. If
|
||
// stacked, _plotData is accumulation of stacking data.
|
||
this._plotData = [];
|
||
// _plotValues hold the individual x and y values that will be plotted for this series.
|
||
this._plotValues = {x:[], y:[]};
|
||
// statistics about the intervals between data points. Used for auto scaling.
|
||
this._intervals = {x:{}, y:{}};
|
||
// data from the previous series, for stacked charts.
|
||
this._prevPlotData = [];
|
||
this._prevGridData = [];
|
||
this._stackAxis = 'y';
|
||
this._primaryAxis = '_xaxis';
|
||
// give each series a canvas to draw on. This should allow for redrawing speedups.
|
||
this.canvas = new $.jqplot.GenericCanvas();
|
||
this.shadowCanvas = new $.jqplot.GenericCanvas();
|
||
this.plugins = {};
|
||
// sum of y values in this series.
|
||
this._sumy = 0;
|
||
this._sumx = 0;
|
||
this._type = '';
|
||
}
|
||
|
||
Series.prototype = new $.jqplot.ElemContainer();
|
||
Series.prototype.constructor = Series;
|
||
|
||
Series.prototype.init = function(index, gridbw, plot) {
|
||
// weed out any null values in the data.
|
||
this.index = index;
|
||
this.gridBorderWidth = gridbw;
|
||
var d = this.data;
|
||
var temp = [], i;
|
||
for (i=0; i<d.length; i++) {
|
||
if (! this.breakOnNull) {
|
||
if (d[i] == null || d[i][0] == null || d[i][1] == null) {
|
||
continue;
|
||
}
|
||
else {
|
||
temp.push(d[i]);
|
||
}
|
||
}
|
||
else {
|
||
// TODO: figure out what to do with null values
|
||
// probably involve keeping nulls in data array
|
||
// and then updating renderers to break line
|
||
// when it hits null value.
|
||
// For now, just keep value.
|
||
temp.push(d[i]);
|
||
}
|
||
}
|
||
this.data = temp;
|
||
|
||
// parse the renderer options and apply default colors if not provided
|
||
if (!this.color && this.show) {
|
||
this.color = plot.colorGenerator.get(this.index);
|
||
}
|
||
if (!this.negativeColor && this.show) {
|
||
this.negativeColor = plot.negativeColorGenerator.get(this.index);
|
||
}
|
||
|
||
|
||
if (!this.fillColor) {
|
||
this.fillColor = this.color;
|
||
}
|
||
if (this.fillAlpha) {
|
||
var comp = $.jqplot.normalize2rgb(this.fillColor);
|
||
var comp = $.jqplot.getColorComponents(comp);
|
||
this.fillColor = 'rgba('+comp[0]+','+comp[1]+','+comp[2]+','+this.fillAlpha+')';
|
||
}
|
||
this.renderer = new this.renderer();
|
||
this.renderer.init.call(this, this.rendererOptions, plot);
|
||
this.markerRenderer = new this.markerRenderer();
|
||
if (!this.markerOptions.color) {
|
||
this.markerOptions.color = this.color;
|
||
}
|
||
if (this.markerOptions.show == null) {
|
||
this.markerOptions.show = this.showMarker;
|
||
}
|
||
this.showMarker = this.markerOptions.show;
|
||
// the markerRenderer is called within it's own scaope, don't want to overwrite series options!!
|
||
this.markerRenderer.init(this.markerOptions);
|
||
};
|
||
|
||
// data - optional data point array to draw using this series renderer
|
||
// gridData - optional grid data point array to draw using this series renderer
|
||
// stackData - array of cumulative data for stacked plots.
|
||
Series.prototype.draw = function(sctx, opts, plot) {
|
||
var options = (opts == undefined) ? {} : opts;
|
||
sctx = (sctx == undefined) ? this.canvas._ctx : sctx;
|
||
|
||
var j, data, gridData;
|
||
|
||
// hooks get called even if series not shown
|
||
// we don't clear canvas here, it would wipe out all other series as well.
|
||
for (j=0; j<$.jqplot.preDrawSeriesHooks.length; j++) {
|
||
$.jqplot.preDrawSeriesHooks[j].call(this, sctx, options);
|
||
}
|
||
if (this.show) {
|
||
this.renderer.setGridData.call(this, plot);
|
||
if (!options.preventJqPlotSeriesDrawTrigger) {
|
||
$(sctx.canvas).trigger('jqplotSeriesDraw', [this.data, this.gridData]);
|
||
}
|
||
data = [];
|
||
if (options.data) {
|
||
data = options.data;
|
||
}
|
||
else if (!this._stack) {
|
||
data = this.data;
|
||
}
|
||
else {
|
||
data = this._plotData;
|
||
}
|
||
gridData = options.gridData || this.renderer.makeGridData.call(this, data, plot);
|
||
|
||
if (this._type === 'line' && this.renderer.smooth && this.renderer._smoothedData.length) {
|
||
gridData = this.renderer._smoothedData;
|
||
}
|
||
|
||
this.renderer.draw.call(this, sctx, gridData, options, plot);
|
||
}
|
||
|
||
for (j=0; j<$.jqplot.postDrawSeriesHooks.length; j++) {
|
||
$.jqplot.postDrawSeriesHooks[j].call(this, sctx, options);
|
||
}
|
||
|
||
sctx = opts = plot = j = data = gridData = null;
|
||
};
|
||
|
||
Series.prototype.drawShadow = function(sctx, opts, plot) {
|
||
var options = (opts == undefined) ? {} : opts;
|
||
sctx = (sctx == undefined) ? this.shadowCanvas._ctx : sctx;
|
||
|
||
var j, data, gridData;
|
||
|
||
// hooks get called even if series not shown
|
||
// we don't clear canvas here, it would wipe out all other series as well.
|
||
for (j=0; j<$.jqplot.preDrawSeriesShadowHooks.length; j++) {
|
||
$.jqplot.preDrawSeriesShadowHooks[j].call(this, sctx, options);
|
||
}
|
||
if (this.shadow) {
|
||
this.renderer.setGridData.call(this, plot);
|
||
|
||
data = [];
|
||
if (options.data) {
|
||
data = options.data;
|
||
}
|
||
else if (!this._stack) {
|
||
data = this.data;
|
||
}
|
||
else {
|
||
data = this._plotData;
|
||
}
|
||
gridData = options.gridData || this.renderer.makeGridData.call(this, data, plot);
|
||
|
||
this.renderer.drawShadow.call(this, sctx, gridData, options);
|
||
}
|
||
|
||
for (j=0; j<$.jqplot.postDrawSeriesShadowHooks.length; j++) {
|
||
$.jqplot.postDrawSeriesShadowHooks[j].call(this, sctx, options);
|
||
}
|
||
|
||
sctx = opts = plot = j = data = gridData = null;
|
||
|
||
};
|
||
|
||
// toggles series display on plot, e.g. show/hide series
|
||
Series.prototype.toggleDisplay = function(ev) {
|
||
var s, speed;
|
||
if (ev.data.series) {
|
||
s = ev.data.series;
|
||
}
|
||
else {
|
||
s = this;
|
||
}
|
||
if (ev.data.speed) {
|
||
speed = ev.data.speed;
|
||
}
|
||
if (speed) {
|
||
if (s.canvas._elem.is(':hidden')) {
|
||
s.canvas._elem.removeClass('jqplot-series-hidden');
|
||
if (s.shadowCanvas._elem) {
|
||
s.shadowCanvas._elem.fadeIn(speed);
|
||
}
|
||
s.canvas._elem.fadeIn(speed);
|
||
s.canvas._elem.nextAll('.jqplot-point-label.jqplot-series-'+s.index).fadeIn(speed);
|
||
}
|
||
else {
|
||
s.canvas._elem.addClass('jqplot-series-hidden');
|
||
if (s.shadowCanvas._elem) {
|
||
s.shadowCanvas._elem.fadeOut(speed);
|
||
}
|
||
s.canvas._elem.fadeOut(speed);
|
||
s.canvas._elem.nextAll('.jqplot-point-label.jqplot-series-'+s.index).fadeOut(speed);
|
||
}
|
||
}
|
||
else {
|
||
if (s.canvas._elem.is(':hidden')) {
|
||
s.canvas._elem.removeClass('jqplot-series-hidden');
|
||
if (s.shadowCanvas._elem) {
|
||
s.shadowCanvas._elem.show();
|
||
}
|
||
s.canvas._elem.show();
|
||
s.canvas._elem.nextAll('.jqplot-point-label.jqplot-series-'+s.index).show();
|
||
}
|
||
else {
|
||
s.canvas._elem.addClass('jqplot-series-hidden');
|
||
if (s.shadowCanvas._elem) {
|
||
s.shadowCanvas._elem.hide();
|
||
}
|
||
s.canvas._elem.hide();
|
||
s.canvas._elem.nextAll('.jqplot-point-label.jqplot-series-'+s.index).hide();
|
||
}
|
||
}
|
||
};
|
||
|
||
|
||
|
||
/**
|
||
* Class: Grid
|
||
*
|
||
* Object representing the grid on which the plot is drawn. The grid in this
|
||
* context is the area bounded by the axes, the area which will contain the series.
|
||
* Note, the series are drawn on their own canvas.
|
||
* The Grid object cannot be instantiated directly, but is created by the Plot oject.
|
||
* Grid properties can be set or overriden by the options passed in from the user.
|
||
*/
|
||
function Grid() {
|
||
$.jqplot.ElemContainer.call(this);
|
||
// Group: Properties
|
||
|
||
// prop: drawGridlines
|
||
// wether to draw the gridlines on the plot.
|
||
this.drawGridlines = true;
|
||
// prop: gridLineColor
|
||
// color of the grid lines.
|
||
this.gridLineColor = '#cccccc';
|
||
// prop: gridLineWidth
|
||
// width of the grid lines.
|
||
this.gridLineWidth = 1.0;
|
||
// prop: background
|
||
// css spec for the background color.
|
||
this.background = '#fffdf6';
|
||
// prop: borderColor
|
||
// css spec for the color of the grid border.
|
||
this.borderColor = '#999999';
|
||
// prop: borderWidth
|
||
// width of the border in pixels.
|
||
this.borderWidth = 2.0;
|
||
// prop: drawBorder
|
||
// True to draw border around grid.
|
||
this.drawBorder = true;
|
||
// prop: shadow
|
||
// wether to show a shadow behind the grid.
|
||
this.shadow = true;
|
||
// prop: shadowAngle
|
||
// shadow angle in degrees
|
||
this.shadowAngle = 45;
|
||
// prop: shadowOffset
|
||
// Offset of each shadow stroke from the border in pixels
|
||
this.shadowOffset = 1.5;
|
||
// prop: shadowWidth
|
||
// width of the stoke for the shadow
|
||
this.shadowWidth = 3;
|
||
// prop: shadowDepth
|
||
// Number of times shadow is stroked, each stroke offset shadowOffset from the last.
|
||
this.shadowDepth = 3;
|
||
// prop: shadowColor
|
||
// an optional css color spec for the shadow in 'rgba(n, n, n, n)' form
|
||
this.shadowColor = null;
|
||
// prop: shadowAlpha
|
||
// Alpha channel transparency of shadow. 0 = transparent.
|
||
this.shadowAlpha = '0.07';
|
||
this._left;
|
||
this._top;
|
||
this._right;
|
||
this._bottom;
|
||
this._width;
|
||
this._height;
|
||
this._axes = [];
|
||
// prop: renderer
|
||
// Instance of a renderer which will actually render the grid,
|
||
// see <$.jqplot.CanvasGridRenderer>.
|
||
this.renderer = $.jqplot.CanvasGridRenderer;
|
||
// prop: rendererOptions
|
||
// Options to pass on to the renderer,
|
||
// see <$.jqplot.CanvasGridRenderer>.
|
||
this.rendererOptions = {};
|
||
this._offsets = {top:null, bottom:null, left:null, right:null};
|
||
}
|
||
|
||
Grid.prototype = new $.jqplot.ElemContainer();
|
||
Grid.prototype.constructor = Grid;
|
||
|
||
Grid.prototype.init = function() {
|
||
this.renderer = new this.renderer();
|
||
this.renderer.init.call(this, this.rendererOptions);
|
||
};
|
||
|
||
Grid.prototype.createElement = function(offsets,plot) {
|
||
this._offsets = offsets;
|
||
return this.renderer.createElement.call(this, plot);
|
||
};
|
||
|
||
Grid.prototype.draw = function() {
|
||
this.renderer.draw.call(this);
|
||
};
|
||
|
||
$.jqplot.GenericCanvas = function() {
|
||
$.jqplot.ElemContainer.call(this);
|
||
this._ctx;
|
||
};
|
||
|
||
$.jqplot.GenericCanvas.prototype = new $.jqplot.ElemContainer();
|
||
$.jqplot.GenericCanvas.prototype.constructor = $.jqplot.GenericCanvas;
|
||
|
||
$.jqplot.GenericCanvas.prototype.createElement = function(offsets, clss, plotDimensions, plot) {
|
||
this._offsets = offsets;
|
||
var klass = 'jqplot';
|
||
if (clss != undefined) {
|
||
klass = clss;
|
||
}
|
||
var elem;
|
||
|
||
elem = plot.canvasManager.getCanvas();
|
||
|
||
// if new plotDimensions supplied, use them.
|
||
if (plotDimensions != null) {
|
||
this._plotDimensions = plotDimensions;
|
||
}
|
||
|
||
elem.width = this._plotDimensions.width - this._offsets.left - this._offsets.right;
|
||
elem.height = this._plotDimensions.height - this._offsets.top - this._offsets.bottom;
|
||
this._elem = $(elem);
|
||
this._elem.css({ position: 'absolute', left: this._offsets.left, top: this._offsets.top });
|
||
|
||
this._elem.addClass(klass);
|
||
|
||
elem = plot.canvasManager.initCanvas(elem);
|
||
|
||
elem = null;
|
||
return this._elem;
|
||
};
|
||
|
||
$.jqplot.GenericCanvas.prototype.setContext = function() {
|
||
this._ctx = this._elem.get(0).getContext("2d");
|
||
return this._ctx;
|
||
};
|
||
|
||
// Memory Leaks patch
|
||
$.jqplot.GenericCanvas.prototype.resetCanvas = function() {
|
||
if (this._elem) {
|
||
if ($.jqplot.use_excanvas && window.G_vmlCanvasManager.uninitElement !== undefined) {
|
||
window.G_vmlCanvasManager.uninitElement(this._elem.get(0));
|
||
}
|
||
|
||
//this._elem.remove();
|
||
this._elem.emptyForce();
|
||
}
|
||
|
||
this._ctx = null;
|
||
};
|
||
|
||
$.jqplot.HooksManager = function () {
|
||
this.hooks =[];
|
||
};
|
||
|
||
$.jqplot.HooksManager.prototype.addOnce = function(fn) {
|
||
var havehook = false, i;
|
||
for (i=0; i<this.hooks.length; i++) {
|
||
if (this.hooks[i][0] == fn) {
|
||
havehook = true;
|
||
}
|
||
}
|
||
if (!havehook) {
|
||
this.hooks.push(fn);
|
||
}
|
||
};
|
||
|
||
$.jqplot.HooksManager.prototype.add = function(fn) {
|
||
this.hooks.push(fn);
|
||
};
|
||
|
||
$.jqplot.EventListenerManager = function () {
|
||
this.hooks =[];
|
||
};
|
||
|
||
$.jqplot.EventListenerManager.prototype.addOnce = function(ev, fn) {
|
||
var havehook = false, h, i;
|
||
for (i=0; i<this.hooks.length; i++) {
|
||
h = this.hooks[i];
|
||
if (h[0] == ev && h[1] == fn) {
|
||
havehook = true;
|
||
}
|
||
}
|
||
if (!havehook) {
|
||
this.hooks.push([ev, fn]);
|
||
}
|
||
};
|
||
|
||
$.jqplot.EventListenerManager.prototype.add = function(ev, fn) {
|
||
this.hooks.push([ev, fn]);
|
||
};
|
||
|
||
|
||
var _axisNames = ['yMidAxis', 'xaxis', 'yaxis', 'x2axis', 'y2axis', 'y3axis', 'y4axis', 'y5axis', 'y6axis', 'y7axis', 'y8axis', 'y9axis'];
|
||
|
||
/**
|
||
* Class: jqPlot
|
||
* Plot object returned by call to $.jqplot. Handles parsing user options,
|
||
* creating sub objects (Axes, legend, title, series) and rendering the plot.
|
||
*/
|
||
function jqPlot() {
|
||
// Group: Properties
|
||
// These properties are specified at the top of the options object
|
||
// like so:
|
||
// > {
|
||
// > axesDefaults:{min:0},
|
||
// > series:[{color:'#6633dd'}],
|
||
// > title: 'A Plot'
|
||
// > }
|
||
//
|
||
// prop: data
|
||
// user's data. Data should *NOT* be specified in the options object,
|
||
// but be passed in as the second argument to the $.jqplot() function.
|
||
// The data property is described here soley for reference.
|
||
// The data should be in the form of an array of 2D or 1D arrays like
|
||
// > [ [[x1, y1], [x2, y2],...], [y1, y2, ...] ].
|
||
this.data = [];
|
||
// prop: dataRenderer
|
||
// A callable which can be used to preprocess data passed into the plot.
|
||
// Will be called with 2 arguments, the plot data and a reference to the plot.
|
||
this.dataRenderer;
|
||
// prop: dataRendererOptions
|
||
// Options that will be passed to the dataRenderer.
|
||
// Can be of any type.
|
||
this.dataRendererOptions;
|
||
// prop: noDataIndicator
|
||
// Options to set up a mock plot with a data loading indicator if no data is specified.
|
||
this.noDataIndicator = {
|
||
show: false,
|
||
indicator: 'Loading Data...',
|
||
axes: {
|
||
xaxis: {
|
||
min: 0,
|
||
max: 10,
|
||
tickInterval: 2,
|
||
show: true
|
||
},
|
||
yaxis: {
|
||
min: 0,
|
||
max: 12,
|
||
tickInterval: 3,
|
||
show: true
|
||
}
|
||
}
|
||
};
|
||
// The id of the dom element to render the plot into
|
||
this.targetId = null;
|
||
// the jquery object for the dom target.
|
||
this.target = null;
|
||
this.defaults = {
|
||
// prop: axesDefaults
|
||
// default options that will be applied to all axes.
|
||
// see <Axis> for axes options.
|
||
axesDefaults: {},
|
||
axes: {xaxis:{}, yaxis:{}, x2axis:{}, y2axis:{}, y3axis:{}, y4axis:{}, y5axis:{}, y6axis:{}, y7axis:{}, y8axis:{}, y9axis:{}, yMidAxis:{}},
|
||
// prop: seriesDefaults
|
||
// default options that will be applied to all series.
|
||
// see <Series> for series options.
|
||
seriesDefaults: {},
|
||
series:[]
|
||
};
|
||
// prop: series
|
||
// Array of series object options.
|
||
// see <Series> for series specific options.
|
||
this.series = [];
|
||
// prop: axes
|
||
// up to 4 axes are supported, each with it's own options,
|
||
// See <Axis> for axis specific options.
|
||
this.axes = {xaxis: new Axis('xaxis'), yaxis: new Axis('yaxis'), x2axis: new Axis('x2axis'), y2axis: new Axis('y2axis'), y3axis: new Axis('y3axis'), y4axis: new Axis('y4axis'), y5axis: new Axis('y5axis'), y6axis: new Axis('y6axis'), y7axis: new Axis('y7axis'), y8axis: new Axis('y8axis'), y9axis: new Axis('y9axis'), yMidAxis: new Axis('yMidAxis')};
|
||
// prop: grid
|
||
// See <Grid> for grid specific options.
|
||
this.grid = new Grid();
|
||
// prop: legend
|
||
// see <$.jqplot.TableLegendRenderer>
|
||
this.legend = new Legend();
|
||
this.baseCanvas = new $.jqplot.GenericCanvas();
|
||
// array of series indicies. Keep track of order
|
||
// which series canvases are displayed, lowest
|
||
// to highest, back to front.
|
||
this.seriesStack = [];
|
||
this.previousSeriesStack = [];
|
||
this.eventCanvas = new $.jqplot.GenericCanvas();
|
||
this._width = null;
|
||
this._height = null;
|
||
this._plotDimensions = {height:null, width:null};
|
||
this._gridPadding = {top:null, right:null, bottom:null, left:null};
|
||
this._defaultGridPadding = {top:10, right:10, bottom:23, left:10};
|
||
// a shortcut for axis syncTicks options. Not implemented yet.
|
||
this.syncXTicks = true;
|
||
// a shortcut for axis syncTicks options. Not implemented yet.
|
||
this.syncYTicks = true;
|
||
// prop: seriesColors
|
||
// Ann array of CSS color specifications that will be applied, in order,
|
||
// to the series in the plot. Colors will wrap around so, if their
|
||
// are more series than colors, colors will be reused starting at the
|
||
// beginning. For pie charts, this specifies the colors of the slices.
|
||
this.seriesColors = $.jqplot.config.defaultColors;
|
||
this.negativeSeriesColors = $.jqplot.config.defaultNegativeColors;
|
||
// prop: sortData
|
||
// false to not sort the data passed in by the user.
|
||
// Many bar, stakced and other graphs as well as many plugins depend on
|
||
// having sorted data.
|
||
this.sortData = true;
|
||
var seriesColorsIndex = 0;
|
||
// prop textColor
|
||
// css spec for the css color attribute. Default for the entire plot.
|
||
this.textColor;
|
||
// prop; fontFamily
|
||
// css spec for the font-family attribute. Default for the entire plot.
|
||
this.fontFamily;
|
||
// prop: fontSize
|
||
// css spec for the font-size attribute. Default for the entire plot.
|
||
this.fontSize;
|
||
// prop: title
|
||
// Title object. See <Title> for specific options. As a shortcut, you
|
||
// can specify the title option as just a string like: title: 'My Plot'
|
||
// and this will create a new title object with the specified text.
|
||
this.title = new Title();
|
||
// container to hold all of the merged options. Convienence for plugins.
|
||
this.options = {};
|
||
// prop: stackSeries
|
||
// true or false, creates a stack or "mountain" plot.
|
||
// Not all series renderers may implement this option.
|
||
this.stackSeries = false;
|
||
// prop: defaultAxisStart
|
||
// 1-D data series are internally converted into 2-D [x,y] data point arrays
|
||
// by jqPlot. This is the default starting value for the missing x or y value.
|
||
// The added data will be a monotonically increasing series (e.g. [1, 2, 3, ...])
|
||
// starting at this value.
|
||
this.defaultAxisStart = 1;
|
||
// array to hold the cumulative stacked series data.
|
||
// used to ajust the individual series data, which won't have access to other
|
||
// series data.
|
||
this._stackData = [];
|
||
// array that holds the data to be plotted. This will be the series data
|
||
// merged with the the appropriate data from _stackData according to the stackAxis.
|
||
this._plotData = [];
|
||
// Namespece to hold plugins. Generally non-renderer plugins add themselves to here.
|
||
this.plugins = {};
|
||
// Count how many times the draw method has been called while the plot is visible.
|
||
// Mostly used to test if plot has never been dran (=0), has been successfully drawn
|
||
// into a visible container once (=1) or draw more than once into a visible container.
|
||
// Can use this in tests to see if plot has been visibly drawn at least one time.
|
||
// After plot has been visibly drawn once, it generally doesn't need redrawn if its
|
||
// container is hidden and shown.
|
||
this._drawCount = 0;
|
||
// this.doCustomEventBinding = true;
|
||
// prop: drawIfHidden
|
||
// True to execute the draw method even if the plot target is hidden.
|
||
// Generally, this should be false. Most plot elements will not be sized/
|
||
// positioned correclty if renderered into a hidden container. To render into
|
||
// a hidden container, call the replot method when the container is shown.
|
||
this.drawIfHidden = false;
|
||
// true to intercept right click events and fire a 'jqplotRightClick' event.
|
||
// this will also block the context menu.
|
||
this.captureRightClick = false;
|
||
this.themeEngine = new $.jqplot.ThemeEngine();
|
||
// sum of y values for all series in plot.
|
||
// used in mekko chart.
|
||
this._sumy = 0;
|
||
this._sumx = 0;
|
||
this.preInitHooks = new $.jqplot.HooksManager();
|
||
this.postInitHooks = new $.jqplot.HooksManager();
|
||
this.preParseOptionsHooks = new $.jqplot.HooksManager();
|
||
this.postParseOptionsHooks = new $.jqplot.HooksManager();
|
||
this.preDrawHooks = new $.jqplot.HooksManager();
|
||
this.postDrawHooks = new $.jqplot.HooksManager();
|
||
this.preDrawSeriesHooks = new $.jqplot.HooksManager();
|
||
this.postDrawSeriesHooks = new $.jqplot.HooksManager();
|
||
this.preDrawLegendHooks = new $.jqplot.HooksManager();
|
||
this.addLegendRowHooks = new $.jqplot.HooksManager();
|
||
this.preSeriesInitHooks = new $.jqplot.HooksManager();
|
||
this.postSeriesInitHooks = new $.jqplot.HooksManager();
|
||
this.preParseSeriesOptionsHooks = new $.jqplot.HooksManager();
|
||
this.postParseSeriesOptionsHooks = new $.jqplot.HooksManager();
|
||
this.eventListenerHooks = new $.jqplot.EventListenerManager();
|
||
this.preDrawSeriesShadowHooks = new $.jqplot.HooksManager();
|
||
this.postDrawSeriesShadowHooks = new $.jqplot.HooksManager();
|
||
|
||
this.colorGenerator = new $.jqplot.ColorGenerator();
|
||
this.negativeColorGenerator = new $.jqplot.ColorGenerator();
|
||
|
||
this.canvasManager = new $.jqplot.CanvasManager();
|
||
|
||
// Group: methods
|
||
//
|
||
// method: init
|
||
// sets the plot target, checks data and applies user
|
||
// options to plot.
|
||
this.init = function(target, data, options) {
|
||
options = options || {};
|
||
for (var i=0; i<$.jqplot.preInitHooks.length; i++) {
|
||
$.jqplot.preInitHooks[i].call(this, target, data, options);
|
||
}
|
||
|
||
for (var i=0; i<this.preInitHooks.hooks.length; i++) {
|
||
this.preInitHooks.hooks[i].call(this, target, data, options);
|
||
}
|
||
|
||
this.targetId = '#'+target;
|
||
this.target = $('#'+target);
|
||
// remove any error class that may be stuck on target.
|
||
this.target.removeClass('jqplot-error');
|
||
if (!this.target.get(0)) {
|
||
throw "No plot target specified";
|
||
}
|
||
|
||
// make sure the target is positioned by some means and set css
|
||
if (this.target.css('position') == 'static') {
|
||
this.target.css('position', 'relative');
|
||
}
|
||
if (!this.target.hasClass('jqplot-target')) {
|
||
this.target.addClass('jqplot-target');
|
||
}
|
||
|
||
// if no height or width specified, use a default.
|
||
if (!this.target.height()) {
|
||
var h;
|
||
if (options && options.height) {
|
||
h = parseInt(options.height, 10);
|
||
}
|
||
else if (this.target.attr('data-height')) {
|
||
h = parseInt(this.target.attr('data-height'), 10);
|
||
}
|
||
else {
|
||
h = parseInt($.jqplot.config.defaultHeight, 10);
|
||
}
|
||
this._height = h;
|
||
this.target.css('height', h+'px');
|
||
}
|
||
else {
|
||
this._height = h = this.target.height();
|
||
}
|
||
if (!this.target.width()) {
|
||
var w;
|
||
if (options && options.width) {
|
||
w = parseInt(options.width, 10);
|
||
}
|
||
else if (this.target.attr('data-width')) {
|
||
w = parseInt(this.target.attr('data-width'), 10);
|
||
}
|
||
else {
|
||
w = parseInt($.jqplot.config.defaultWidth, 10);
|
||
}
|
||
this._width = w;
|
||
this.target.css('width', w+'px');
|
||
}
|
||
else {
|
||
this._width = w = this.target.width();
|
||
}
|
||
|
||
this._plotDimensions.height = this._height;
|
||
this._plotDimensions.width = this._width;
|
||
this.grid._plotDimensions = this._plotDimensions;
|
||
this.title._plotDimensions = this._plotDimensions;
|
||
this.baseCanvas._plotDimensions = this._plotDimensions;
|
||
this.eventCanvas._plotDimensions = this._plotDimensions;
|
||
this.legend._plotDimensions = this._plotDimensions;
|
||
if (this._height <=0 || this._width <=0 || !this._height || !this._width) {
|
||
throw "Canvas dimension not set";
|
||
}
|
||
|
||
if (options.dataRenderer && jQuery.isFunction(options.dataRenderer)) {
|
||
if (options.dataRendererOptions) {
|
||
this.dataRendererOptions = options.dataRendererOptions;
|
||
}
|
||
this.dataRenderer = options.dataRenderer;
|
||
data = this.dataRenderer(data, this, this.dataRendererOptions);
|
||
}
|
||
|
||
if (options.noDataIndicator && jQuery.isPlainObject(options.noDataIndicator)) {
|
||
$.extend(true, this.noDataIndicator, options.noDataIndicator);
|
||
}
|
||
|
||
if (data == null || jQuery.isArray(data) == false || data.length == 0 || jQuery.isArray(data[0]) == false || data[0].length == 0) {
|
||
|
||
if (this.noDataIndicator.show == false) {
|
||
throw{
|
||
name: "DataError",
|
||
message: "No data to plot."
|
||
};
|
||
}
|
||
|
||
else {
|
||
// have to be descructive here in order for plot to not try and render series.
|
||
// This means that $.jqplot() will have to be called again when there is data.
|
||
//delete options.series;
|
||
|
||
for (var ax in this.noDataIndicator.axes) {
|
||
for (var prop in this.noDataIndicator.axes[ax]) {
|
||
this.axes[ax][prop] = this.noDataIndicator.axes[ax][prop];
|
||
}
|
||
}
|
||
|
||
this.postDrawHooks.add(function() {
|
||
var eh = this.eventCanvas.getHeight();
|
||
var ew = this.eventCanvas.getWidth();
|
||
var temp = $('<div class="jqplot-noData-container" style="position:absolute;"></div>');
|
||
this.target.append(temp);
|
||
temp.height(eh);
|
||
temp.width(ew);
|
||
temp.css('top', this.eventCanvas._offsets.top);
|
||
temp.css('left', this.eventCanvas._offsets.left);
|
||
|
||
var temp2 = $('<div class="jqplot-noData-contents" style="text-align:center; position:relative; margin-left:auto; margin-right:auto;"></div>');
|
||
temp.append(temp2);
|
||
temp2.html(this.noDataIndicator.indicator);
|
||
var th = temp2.height();
|
||
var tw = temp2.width();
|
||
temp2.height(th);
|
||
temp2.width(tw);
|
||
temp2.css('top', (eh - th)/2 + 'px');
|
||
});
|
||
|
||
}
|
||
}
|
||
|
||
this.data = data;
|
||
|
||
this.parseOptions(options);
|
||
|
||
if (this.textColor) {
|
||
this.target.css('color', this.textColor);
|
||
}
|
||
if (this.fontFamily) {
|
||
this.target.css('font-family', this.fontFamily);
|
||
}
|
||
if (this.fontSize) {
|
||
this.target.css('font-size', this.fontSize);
|
||
}
|
||
|
||
this.title.init();
|
||
this.legend.init();
|
||
this._sumy = 0;
|
||
this._sumx = 0;
|
||
for (var i=0; i<this.series.length; i++) {
|
||
// set default stacking order for series canvases
|
||
this.seriesStack.push(i);
|
||
this.previousSeriesStack.push(i);
|
||
this.series[i].shadowCanvas._plotDimensions = this._plotDimensions;
|
||
this.series[i].canvas._plotDimensions = this._plotDimensions;
|
||
for (var j=0; j<$.jqplot.preSeriesInitHooks.length; j++) {
|
||
$.jqplot.preSeriesInitHooks[j].call(this.series[i], target, data, this.options.seriesDefaults, this.options.series[i], this);
|
||
}
|
||
for (var j=0; j<this.preSeriesInitHooks.hooks.length; j++) {
|
||
this.preSeriesInitHooks.hooks[j].call(this.series[i], target, data, this.options.seriesDefaults, this.options.series[i], this);
|
||
}
|
||
this.populatePlotData(this.series[i], i);
|
||
this.series[i]._plotDimensions = this._plotDimensions;
|
||
this.series[i].init(i, this.grid.borderWidth, this);
|
||
for (var j=0; j<$.jqplot.postSeriesInitHooks.length; j++) {
|
||
$.jqplot.postSeriesInitHooks[j].call(this.series[i], target, data, this.options.seriesDefaults, this.options.series[i], this);
|
||
}
|
||
for (var j=0; j<this.postSeriesInitHooks.hooks.length; j++) {
|
||
this.postSeriesInitHooks.hooks[j].call(this.series[i], target, data, this.options.seriesDefaults, this.options.series[i], this);
|
||
}
|
||
this._sumy += this.series[i]._sumy;
|
||
this._sumx += this.series[i]._sumx;
|
||
}
|
||
|
||
for (var i=0; i<12; i++) {
|
||
name = _axisNames[i];
|
||
this.axes[name]._plotDimensions = this._plotDimensions;
|
||
this.axes[name].init();
|
||
if (this.axes[name].borderColor == null) {
|
||
if (name.charAt(0) !== 'x' && this.axes[name].useSeriesColor === true && this.axes[name].show) {
|
||
this.axes[name].borderColor = this.axes[name]._series[0].color;
|
||
}
|
||
else {
|
||
this.axes[name].borderColor = this.grid.borderColor;
|
||
}
|
||
}
|
||
}
|
||
|
||
if (this.sortData) {
|
||
sortData(this.series);
|
||
}
|
||
this.grid.init();
|
||
this.grid._axes = this.axes;
|
||
|
||
this.legend._series = this.series;
|
||
|
||
for (var i=0; i<$.jqplot.postInitHooks.length; i++) {
|
||
$.jqplot.postInitHooks[i].call(this, target, data, options);
|
||
}
|
||
|
||
for (var i=0; i<this.postInitHooks.hooks.length; i++) {
|
||
this.postInitHooks.hooks[i].call(this, target, data, options);
|
||
}
|
||
};
|
||
|
||
// method: resetAxesScale
|
||
// Reset the specified axes min, max, numberTicks and tickInterval properties to null
|
||
// or reset these properties on all axes if no list of axes is provided.
|
||
//
|
||
// Parameters:
|
||
// axes - Boolean to reset or not reset all axes or an array or object of axis names to reset.
|
||
this.resetAxesScale = function(axes, options) {
|
||
var opts = options || {};
|
||
var ax = axes || this.axes;
|
||
if (ax === true) {
|
||
ax = this.axes;
|
||
}
|
||
if (jQuery.isArray(ax)) {
|
||
for (var i = 0; i < ax.length; i++) {
|
||
this.axes[ax[i]].resetScale(opts[ax[i]]);
|
||
}
|
||
}
|
||
else if (typeof(ax) === 'object') {
|
||
for (var name in ax) {
|
||
this.axes[name].resetScale(opts[name]);
|
||
}
|
||
}
|
||
};
|
||
// method: reInitialize
|
||
// reinitialize plot for replotting.
|
||
// not called directly.
|
||
this.reInitialize = function () {
|
||
// Plot should be visible and have a height and width.
|
||
// If plot doesn't have height and width for some
|
||
// reason, set it by other means. Plot must not have
|
||
// a display:none attribute, however.
|
||
|
||
//
|
||
// Wont have options here
|
||
/*
|
||
if (!this.target.height()) {
|
||
var h;
|
||
if (options && options.height) {
|
||
h = parseInt(options.height, 10);
|
||
}
|
||
else if (this.target.attr('data-height')) {
|
||
h = parseInt(this.target.attr('data-height'), 10);
|
||
}
|
||
else {
|
||
h = parseInt($.jqplot.config.defaultHeight, 10);
|
||
}
|
||
this._height = h;
|
||
this.target.css('height', h+'px');
|
||
}
|
||
else {
|
||
this._height = this.target.height();
|
||
}
|
||
if (!this.target.width()) {
|
||
var w;
|
||
if (options && options.width) {
|
||
w = parseInt(options.width, 10);
|
||
}
|
||
else if (this.target.attr('data-width')) {
|
||
w = parseInt(this.target.attr('data-width'), 10);
|
||
}
|
||
else {
|
||
w = parseInt($.jqplot.config.defaultWidth, 10);
|
||
}
|
||
this._width = w;
|
||
this.target.css('width', w+'px');
|
||
}
|
||
else {
|
||
this._width = this.target.width();
|
||
}
|
||
*/
|
||
|
||
this._height = this.target.height();
|
||
this._width = this.target.width();
|
||
|
||
if (this._height <=0 || this._width <=0 || !this._height || !this._width) {
|
||
throw "Target dimension not set";
|
||
}
|
||
|
||
this._plotDimensions.height = this._height;
|
||
this._plotDimensions.width = this._width;
|
||
this.grid._plotDimensions = this._plotDimensions;
|
||
this.title._plotDimensions = this._plotDimensions;
|
||
this.baseCanvas._plotDimensions = this._plotDimensions;
|
||
this.eventCanvas._plotDimensions = this._plotDimensions;
|
||
this.legend._plotDimensions = this._plotDimensions;
|
||
|
||
for (var n in this.axes) {
|
||
this.axes[n]._plotWidth = this._width;
|
||
this.axes[n]._plotHeight = this._height;
|
||
}
|
||
|
||
this.title._plotWidth = this._width;
|
||
|
||
if (this.textColor) {
|
||
this.target.css('color', this.textColor);
|
||
}
|
||
if (this.fontFamily) {
|
||
this.target.css('font-family', this.fontFamily);
|
||
}
|
||
if (this.fontSize) {
|
||
this.target.css('font-size', this.fontSize);
|
||
}
|
||
|
||
this._sumy = 0;
|
||
this._sumx = 0;
|
||
for (var i=0; i<this.series.length; i++) {
|
||
this.populatePlotData(this.series[i], i);
|
||
if (this.series[i]._type === 'line' && this.series[i].renderer.bands.show) {
|
||
this.series[i].renderer.initBands.call(this.series[i], this.series[i].renderer.options, this);
|
||
}
|
||
this.series[i]._plotDimensions = this._plotDimensions;
|
||
this.series[i].canvas._plotDimensions = this._plotDimensions;
|
||
//this.series[i].init(i, this.grid.borderWidth);
|
||
this._sumy += this.series[i]._sumy;
|
||
this._sumx += this.series[i]._sumx;
|
||
}
|
||
|
||
for (var j=0; j<12; j++) {
|
||
name = _axisNames[j];
|
||
// Memory Leaks patch : clear ticks elements
|
||
var t = this.axes[name]._ticks;
|
||
for (var i = 0; i < t.length; i++) {
|
||
var el = t[i]._elem;
|
||
if (el) {
|
||
// if canvas renderer
|
||
if ($.jqplot.use_excanvas && window.G_vmlCanvasManager.uninitElement !== undefined) {
|
||
window.G_vmlCanvasManager.uninitElement(el.get(0));
|
||
}
|
||
el.emptyForce();
|
||
el = null;
|
||
t._elem = null;
|
||
}
|
||
}
|
||
t = null;
|
||
|
||
this.axes[name]._plotDimensions = this._plotDimensions;
|
||
this.axes[name]._ticks = [];
|
||
// this.axes[name].renderer.init.call(this.axes[name], {});
|
||
}
|
||
|
||
if (this.sortData) {
|
||
sortData(this.series);
|
||
}
|
||
|
||
this.grid._axes = this.axes;
|
||
|
||
this.legend._series = this.series;
|
||
};
|
||
|
||
// sort the series data in increasing order.
|
||
function sortData(series) {
|
||
var d, sd, pd, ppd, ret;
|
||
for (var i=0; i<series.length; i++) {
|
||
// d = series[i].data;
|
||
// sd = series[i]._stackData;
|
||
// pd = series[i]._plotData;
|
||
// ppd = series[i]._prevPlotData;
|
||
var check;
|
||
var bat = [series[i].data, series[i]._stackData, series[i]._plotData, series[i]._prevPlotData];
|
||
for (var n=0; n<4; n++) {
|
||
check = true;
|
||
d = bat[n];
|
||
if (series[i]._stackAxis == 'x') {
|
||
for (var j = 0; j < d.length; j++) {
|
||
if (typeof(d[j][1]) != "number") {
|
||
check = false;
|
||
break;
|
||
}
|
||
}
|
||
if (check) {
|
||
d.sort(function(a,b) { return a[1] - b[1]; });
|
||
// sd.sort(function(a,b) { return a[1] - b[1]; });
|
||
// pd.sort(function(a,b) { return a[1] - b[1]; });
|
||
// ppd.sort(function(a,b) { return a[1] - b[1]; });
|
||
}
|
||
}
|
||
else {
|
||
for (var j = 0; j < d.length; j++) {
|
||
if (typeof(d[j][0]) != "number") {
|
||
check = false;
|
||
break;
|
||
}
|
||
}
|
||
if (check) {
|
||
d.sort(function(a,b) { return a[0] - b[0]; });
|
||
// sd.sort(function(a,b) { return a[0] - b[0]; });
|
||
// pd.sort(function(a,b) { return a[0] - b[0]; });
|
||
// ppd.sort(function(a,b) { return a[0] - b[0]; });
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
// populate the _stackData and _plotData arrays for the plot and the series.
|
||
this.populatePlotData = function(series, index) {
|
||
// if a stacked chart, compute the stacked data
|
||
this._plotData = [];
|
||
this._stackData = [];
|
||
series._stackData = [];
|
||
series._plotData = [];
|
||
var plotValues = {x:[], y:[]};
|
||
if (this.stackSeries && !series.disableStack) {
|
||
series._stack = true;
|
||
var sidx = series._stackAxis == 'x' ? 0 : 1;
|
||
var idx = sidx ? 0 : 1;
|
||
// push the current data into stackData
|
||
//this._stackData.push(this.series[i].data);
|
||
var temp = $.extend(true, [], series.data);
|
||
// create the data that will be plotted for this series
|
||
var plotdata = $.extend(true, [], series.data);
|
||
// for first series, nothing to add to stackData.
|
||
for (var j=0; j<index; j++) {
|
||
var cd = this.series[j].data;
|
||
for (var k=0; k<cd.length; k++) {
|
||
temp[k][0] += cd[k][0];
|
||
temp[k][1] += cd[k][1];
|
||
// only need to sum up the stack axis column of data
|
||
plotdata[k][sidx] += cd[k][sidx];
|
||
}
|
||
}
|
||
for (var i=0; i<plotdata.length; i++) {
|
||
plotValues.x.push(plotdata[i][0]);
|
||
plotValues.y.push(plotdata[i][1]);
|
||
}
|
||
this._plotData.push(plotdata);
|
||
this._stackData.push(temp);
|
||
series._stackData = temp;
|
||
series._plotData = plotdata;
|
||
series._plotValues = plotValues;
|
||
}
|
||
else {
|
||
for (var i=0; i<series.data.length; i++) {
|
||
plotValues.x.push(series.data[i][0]);
|
||
plotValues.y.push(series.data[i][1]);
|
||
}
|
||
this._stackData.push(series.data);
|
||
this.series[index]._stackData = series.data;
|
||
this._plotData.push(series.data);
|
||
series._plotData = series.data;
|
||
series._plotValues = plotValues;
|
||
}
|
||
if (index>0) {
|
||
series._prevPlotData = this.series[index-1]._plotData;
|
||
}
|
||
series._sumy = 0;
|
||
series._sumx = 0;
|
||
for (i=series.data.length-1; i>-1; i--) {
|
||
series._sumy += series.data[i][1];
|
||
series._sumx += series.data[i][0];
|
||
}
|
||
};
|
||
|
||
// this.setData = function(seriesIndex, newdata) {
|
||
// // if newdata is null, assume all data is passed in as first argument
|
||
// if (newdata == null) {
|
||
|
||
// }
|
||
// };
|
||
|
||
// function to safely return colors from the color array and wrap around at the end.
|
||
this.getNextSeriesColor = (function(t) {
|
||
var idx = 0;
|
||
var sc = t.seriesColors;
|
||
|
||
return function () {
|
||
if (idx < sc.length) {
|
||
return sc[idx++];
|
||
}
|
||
else {
|
||
idx = 0;
|
||
return sc[idx++];
|
||
}
|
||
};
|
||
})(this);
|
||
|
||
this.parseOptions = function(options){
|
||
for (var i=0; i<this.preParseOptionsHooks.hooks.length; i++) {
|
||
this.preParseOptionsHooks.hooks[i].call(this, options);
|
||
}
|
||
for (var i=0; i<$.jqplot.preParseOptionsHooks.length; i++) {
|
||
$.jqplot.preParseOptionsHooks[i].call(this, options);
|
||
}
|
||
this.options = $.extend(true, {}, this.defaults, options);
|
||
this.stackSeries = this.options.stackSeries;
|
||
if (this.options.seriesColors) {
|
||
this.seriesColors = this.options.seriesColors;
|
||
}
|
||
if (this.options.negativeSeriesColors) {
|
||
this.negativeSeriesColors = this.options.negativeSeriesColors;
|
||
}
|
||
if (this.options.captureRightClick) {
|
||
this.captureRightClick = this.options.captureRightClick;
|
||
}
|
||
this.defaultAxisStart = (options && options.defaultAxisStart != null) ? options.defaultAxisStart : this.defaultAxisStart;
|
||
this.colorGenerator.setColors(this.seriesColors);
|
||
this.negativeColorGenerator.setColors(this.negativeSeriesColors);
|
||
// var cg = new this.colorGenerator(this.seriesColors);
|
||
// var ncg = new this.colorGenerator(this.negativeSeriesColors);
|
||
// this._gridPadding = this.options.gridPadding;
|
||
$.extend(true, this._gridPadding, this.options.gridPadding);
|
||
this.sortData = (this.options.sortData != null) ? this.options.sortData : this.sortData;
|
||
for (var i=0; i<12; i++) {
|
||
var n = _axisNames[i];
|
||
var axis = this.axes[n];
|
||
axis._options = $.extend(true, {}, this.options.axesDefaults, this.options.axes[n]);
|
||
$.extend(true, axis, this.options.axesDefaults, this.options.axes[n]);
|
||
axis._plotWidth = this._width;
|
||
axis._plotHeight = this._height;
|
||
}
|
||
// if (this.data.length == 0) {
|
||
// this.data = [];
|
||
// for (var i=0; i<this.options.series.length; i++) {
|
||
// this.data.push(this.options.series.data);
|
||
// }
|
||
// }
|
||
|
||
var normalizeData = function(data, dir, start) {
|
||
// return data as an array of point arrays,
|
||
// in form [[x1,y1...], [x2,y2...], ...]
|
||
var temp = [];
|
||
var i;
|
||
dir = dir || 'vertical';
|
||
if (!jQuery.isArray(data[0])) {
|
||
// we have a series of scalars. One line with just y values.
|
||
// turn the scalar list of data into a data array of form:
|
||
// [[1, data[0]], [2, data[1]], ...]
|
||
for (i=0; i<data.length; i++) {
|
||
if (dir == 'vertical') {
|
||
temp.push([start + i, data[i]]);
|
||
}
|
||
else {
|
||
temp.push([data[i], start+i]);
|
||
}
|
||
}
|
||
}
|
||
else {
|
||
// we have a properly formatted data series, copy it.
|
||
$.extend(true, temp, data);
|
||
}
|
||
return temp;
|
||
};
|
||
|
||
var colorIndex = 0;
|
||
for (var i=0; i<this.data.length; i++) {
|
||
var temp = new Series();
|
||
for (var j=0; j<$.jqplot.preParseSeriesOptionsHooks.length; j++) {
|
||
$.jqplot.preParseSeriesOptionsHooks[j].call(temp, this.options.seriesDefaults, this.options.series[i]);
|
||
}
|
||
for (var j=0; j<this.preParseSeriesOptionsHooks.hooks.length; j++) {
|
||
this.preParseSeriesOptionsHooks.hooks[j].call(temp, this.options.seriesDefaults, this.options.series[i]);
|
||
}
|
||
$.extend(true, temp, {seriesColors:this.seriesColors, negativeSeriesColors:this.negativeSeriesColors}, this.options.seriesDefaults, this.options.series[i]);
|
||
var dir = 'vertical';
|
||
if (temp.renderer === $.jqplot.BarRenderer && temp.rendererOptions && temp.rendererOptions.barDirection == 'horizontal' && temp.transposeData === true) {
|
||
dir = 'horizontal';
|
||
}
|
||
temp.data = normalizeData(this.data[i], dir, this.defaultAxisStart);
|
||
switch (temp.xaxis) {
|
||
case 'xaxis':
|
||
temp._xaxis = this.axes.xaxis;
|
||
break;
|
||
case 'x2axis':
|
||
temp._xaxis = this.axes.x2axis;
|
||
break;
|
||
default:
|
||
break;
|
||
}
|
||
temp._yaxis = this.axes[temp.yaxis];
|
||
temp._xaxis._series.push(temp);
|
||
temp._yaxis._series.push(temp);
|
||
if (temp.show) {
|
||
temp._xaxis.show = true;
|
||
temp._yaxis.show = true;
|
||
}
|
||
|
||
// // parse the renderer options and apply default colors if not provided
|
||
// if (!temp.color && temp.show != false) {
|
||
// temp.color = cg.next();
|
||
// colorIndex = cg.getIndex() - 1;;
|
||
// }
|
||
// if (!temp.negativeColor && temp.show != false) {
|
||
// temp.negativeColor = ncg.get(colorIndex);
|
||
// ncg.setIndex(colorIndex);
|
||
// }
|
||
if (!temp.label) {
|
||
temp.label = 'Series '+ (i+1).toString();
|
||
}
|
||
// temp.rendererOptions.show = temp.show;
|
||
// $.extend(true, temp.renderer, {color:this.seriesColors[i]}, this.rendererOptions);
|
||
this.series.push(temp);
|
||
for (var j=0; j<$.jqplot.postParseSeriesOptionsHooks.length; j++) {
|
||
$.jqplot.postParseSeriesOptionsHooks[j].call(this.series[i], this.options.seriesDefaults, this.options.series[i]);
|
||
}
|
||
for (var j=0; j<this.postParseSeriesOptionsHooks.hooks.length; j++) {
|
||
this.postParseSeriesOptionsHooks.hooks[j].call(this.series[i], this.options.seriesDefaults, this.options.series[i]);
|
||
}
|
||
}
|
||
|
||
// copy the grid and title options into this object.
|
||
$.extend(true, this.grid, this.options.grid);
|
||
// if axis border properties aren't set, set default.
|
||
for (var i=0; i<12; i++) {
|
||
var n = _axisNames[i];
|
||
var axis = this.axes[n];
|
||
if (axis.borderWidth == null) {
|
||
axis.borderWidth =this.grid.borderWidth;
|
||
}
|
||
}
|
||
|
||
if (typeof this.options.title == 'string') {
|
||
this.title.text = this.options.title;
|
||
}
|
||
else if (typeof this.options.title == 'object') {
|
||
$.extend(true, this.title, this.options.title);
|
||
}
|
||
this.title._plotWidth = this._width;
|
||
this.legend.setOptions(this.options.legend);
|
||
|
||
for (var i=0; i<$.jqplot.postParseOptionsHooks.length; i++) {
|
||
$.jqplot.postParseOptionsHooks[i].call(this, options);
|
||
}
|
||
for (var i=0; i<this.postParseOptionsHooks.hooks.length; i++) {
|
||
this.postParseOptionsHooks.hooks[i].call(this, options);
|
||
}
|
||
};
|
||
|
||
// method: destroy
|
||
// Releases all resources occupied by the plot
|
||
this.destroy = function() {
|
||
this.canvasManager.freeAllCanvases();
|
||
if (this.eventCanvas && this.eventCanvas._elem) {
|
||
this.eventCanvas._elem.unbind();
|
||
}
|
||
// Couple of posts on Stack Overflow indicate that empty() doesn't
|
||
// always cear up the dom and release memory. Sometimes setting
|
||
// innerHTML property to null is needed. Particularly on IE, may
|
||
// have to directly set it to null, bypassing jQuery.
|
||
this.target.empty();
|
||
|
||
this.target[0].innerHTML = '';
|
||
};
|
||
|
||
// method: replot
|
||
// Does a reinitialization of the plot followed by
|
||
// a redraw. Method could be used to interactively
|
||
// change plot characteristics and then replot.
|
||
//
|
||
// Parameters:
|
||
// options - Options used for replotting.
|
||
//
|
||
// Properties:
|
||
// clear - false to not clear (empty) the plot container before replotting (default: true).
|
||
// resetAxes - true to reset all axes min, max, numberTicks and tickInterval setting so axes will rescale themselves.
|
||
// optionally pass in list of axes to reset (e.g. ['xaxis', 'y2axis']) (default: false).
|
||
this.replot = function(options) {
|
||
var opts = options || {};
|
||
var clear = opts.clear || true;
|
||
var resetAxes = opts.resetAxes || false;
|
||
this.target.trigger('jqplotPreReplot');
|
||
|
||
if (clear) {
|
||
this.destroy();
|
||
}
|
||
this.reInitialize();
|
||
if (resetAxes) {
|
||
this.resetAxesScale(resetAxes, opts.axes);
|
||
}
|
||
this.draw();
|
||
this.target.trigger('jqplotPostReplot');
|
||
};
|
||
|
||
// method: redraw
|
||
// Empties the plot target div and redraws the plot.
|
||
// This enables plot data and properties to be changed
|
||
// and then to comletely clear the plot and redraw.
|
||
// redraw *will not* reinitialize any plot elements.
|
||
// That is, axes will not be autoscaled and defaults
|
||
// will not be reapplied to any plot elements. redraw
|
||
// is used primarily with zooming.
|
||
//
|
||
// Parameters:
|
||
// clear - false to not clear (empty) the plot container before redrawing (default: true).
|
||
this.redraw = function(clear) {
|
||
clear = (clear != null) ? clear : true;
|
||
this.target.trigger('jqplotPreRedraw');
|
||
if (clear) {
|
||
this.canvasManager.freeAllCanvases();
|
||
this.eventCanvas._elem.unbind();
|
||
// Dont think I bind any events to the target, this shouldn't be necessary.
|
||
// It will remove user's events.
|
||
// this.target.unbind();
|
||
this.target.empty();
|
||
}
|
||
for (var ax in this.axes) {
|
||
this.axes[ax]._ticks = [];
|
||
}
|
||
for (var i=0; i<this.series.length; i++) {
|
||
this.populatePlotData(this.series[i], i);
|
||
}
|
||
this._sumy = 0;
|
||
this._sumx = 0;
|
||
for (i=0; i<this.series.length; i++) {
|
||
this._sumy += this.series[i]._sumy;
|
||
this._sumx += this.series[i]._sumx;
|
||
}
|
||
this.draw();
|
||
this.target.trigger('jqplotPostRedraw');
|
||
};
|
||
|
||
// method: draw
|
||
// Draws all elements of the plot into the container.
|
||
// Does not clear the container before drawing.
|
||
this.draw = function(){
|
||
if (this.drawIfHidden || this.target.is(':visible')) {
|
||
this.target.trigger('jqplotPreDraw');
|
||
var i, j;
|
||
for (i=0; i<$.jqplot.preDrawHooks.length; i++) {
|
||
$.jqplot.preDrawHooks[i].call(this);
|
||
}
|
||
for (i=0; i<this.preDrawHooks.hooks.length; i++) {
|
||
this.preDrawHooks.hooks[i].call(this);
|
||
}
|
||
// create an underlying canvas to be used for special features.
|
||
this.target.append(this.baseCanvas.createElement({left:0, right:0, top:0, bottom:0}, 'jqplot-base-canvas', null, this));
|
||
this.baseCanvas.setContext();
|
||
this.target.append(this.title.draw());
|
||
this.title.pack({top:0, left:0});
|
||
|
||
// make room for the legend between the grid and the edge.
|
||
var legendElem = this.legend.draw();
|
||
|
||
var gridPadding = {top:0, left:0, bottom:0, right:0};
|
||
|
||
if (this.legend.placement == "outsideGrid") {
|
||
// temporarily append the legend to get dimensions
|
||
this.target.append(legendElem);
|
||
switch (this.legend.location) {
|
||
case 'n':
|
||
gridPadding.top += this.legend.getHeight();
|
||
break;
|
||
case 's':
|
||
gridPadding.bottom += this.legend.getHeight();
|
||
break;
|
||
case 'ne':
|
||
case 'e':
|
||
case 'se':
|
||
gridPadding.right += this.legend.getWidth();
|
||
break;
|
||
case 'nw':
|
||
case 'w':
|
||
case 'sw':
|
||
gridPadding.left += this.legend.getWidth();
|
||
break;
|
||
default: // same as 'ne'
|
||
gridPadding.right += this.legend.getWidth();
|
||
break;
|
||
}
|
||
legendElem = legendElem.detach();
|
||
}
|
||
|
||
var ax = this.axes;
|
||
// draw the yMidAxis first, so xaxis of pyramid chart can adjust itself if needed.
|
||
for (i=0; i<12; i++) {
|
||
name = _axisNames[i];
|
||
this.target.append(ax[name].draw(this.baseCanvas._ctx, this));
|
||
ax[name].set();
|
||
}
|
||
if (ax.yaxis.show) {
|
||
gridPadding.left += ax.yaxis.getWidth();
|
||
}
|
||
var ra = ['y2axis', 'y3axis', 'y4axis', 'y5axis', 'y6axis', 'y7axis', 'y8axis', 'y9axis'];
|
||
var rapad = [0, 0, 0, 0, 0, 0, 0, 0];
|
||
var gpr = 0;
|
||
var n;
|
||
for (n=0; n<8; n++) {
|
||
if (ax[ra[n]].show) {
|
||
gpr += ax[ra[n]].getWidth();
|
||
rapad[n] = gpr;
|
||
}
|
||
}
|
||
gridPadding.right += gpr;
|
||
if (ax.x2axis.show) {
|
||
gridPadding.top += ax.x2axis.getHeight();
|
||
}
|
||
if (this.title.show) {
|
||
gridPadding.top += this.title.getHeight();
|
||
}
|
||
if (ax.xaxis.show) {
|
||
gridPadding.bottom += ax.xaxis.getHeight();
|
||
}
|
||
|
||
// end of gridPadding adjustments.
|
||
|
||
// if user passed in gridDimensions option, check against calculated gridPadding
|
||
if (this.options.gridDimensions && $.isPlainObject(this.options.gridDimensions)) {
|
||
var gdw = parseInt(this.options.gridDimensions.width, 10) || 0;
|
||
var gdh = parseInt(this.options.gridDimensions.height, 10) || 0;
|
||
var widthAdj = (this._width - gridPadding.left - gridPadding.right - gdw)/2;
|
||
var heightAdj = (this._height - gridPadding.top - gridPadding.bottom - gdh)/2;
|
||
|
||
if (heightAdj >= 0 && widthAdj >= 0) {
|
||
gridPadding.top += heightAdj;
|
||
gridPadding.bottom += heightAdj;
|
||
gridPadding.left += widthAdj;
|
||
gridPadding.right += widthAdj;
|
||
}
|
||
}
|
||
var arr = ['top', 'bottom', 'left', 'right'];
|
||
for (var n in arr) {
|
||
if (this._gridPadding[arr[n]] == null && gridPadding[arr[n]] > 0) {
|
||
this._gridPadding[arr[n]] = gridPadding[arr[n]];
|
||
}
|
||
else if (this._gridPadding[arr[n]] == null) {
|
||
this._gridPadding[arr[n]] = this._defaultGridPadding[arr[n]];
|
||
}
|
||
}
|
||
|
||
var legendPadding = (this.legend.placement == 'outsideGrid') ? {top:this.title.getHeight(), left: 0, right: 0, bottom: 0} : this._gridPadding;
|
||
|
||
ax.xaxis.pack({position:'absolute', bottom:this._gridPadding.bottom - ax.xaxis.getHeight(), left:0, width:this._width}, {min:this._gridPadding.left, max:this._width - this._gridPadding.right});
|
||
ax.yaxis.pack({position:'absolute', top:0, left:this._gridPadding.left - ax.yaxis.getWidth(), height:this._height}, {min:this._height - this._gridPadding.bottom, max: this._gridPadding.top});
|
||
ax.x2axis.pack({position:'absolute', top:this._gridPadding.top - ax.x2axis.getHeight(), left:0, width:this._width}, {min:this._gridPadding.left, max:this._width - this._gridPadding.right});
|
||
for (i=8; i>0; i--) {
|
||
ax[ra[i-1]].pack({position:'absolute', top:0, right:this._gridPadding.right - rapad[i-1]}, {min:this._height - this._gridPadding.bottom, max: this._gridPadding.top});
|
||
}
|
||
var ltemp = (this._width - this._gridPadding.left - this._gridPadding.right)/2.0 + this._gridPadding.left - ax.yMidAxis.getWidth()/2.0;
|
||
ax.yMidAxis.pack({position:'absolute', top:0, left:ltemp, zIndex:9, textAlign: 'center'}, {min:this._height - this._gridPadding.bottom, max: this._gridPadding.top});
|
||
|
||
this.target.append(this.grid.createElement(this._gridPadding, this));
|
||
this.grid.draw();
|
||
|
||
// put the shadow canvases behind the series canvases so shadows don't overlap on stacked bars.
|
||
for (i=0; i<this.series.length; i++) {
|
||
// draw series in order of stacking. This affects only
|
||
// order in which canvases are added to dom.
|
||
j = this.seriesStack[i];
|
||
this.target.append(this.series[j].shadowCanvas.createElement(this._gridPadding, 'jqplot-series-shadowCanvas', null, this));
|
||
this.series[j].shadowCanvas.setContext();
|
||
this.series[j].shadowCanvas._elem.data('seriesIndex', j);
|
||
}
|
||
|
||
for (i=0; i<this.series.length; i++) {
|
||
// draw series in order of stacking. This affects only
|
||
// order in which canvases are added to dom.
|
||
j = this.seriesStack[i];
|
||
this.target.append(this.series[j].canvas.createElement(this._gridPadding, 'jqplot-series-canvas', null, this));
|
||
this.series[j].canvas.setContext();
|
||
this.series[j].canvas._elem.data('seriesIndex', j);
|
||
}
|
||
// Need to use filled canvas to capture events in IE.
|
||
// Also, canvas seems to block selection of other elements in document on FF.
|
||
this.target.append(this.eventCanvas.createElement(this._gridPadding, 'jqplot-event-canvas', null, this));
|
||
this.eventCanvas.setContext();
|
||
this.eventCanvas._ctx.fillStyle = 'rgba(0,0,0,0)';
|
||
this.eventCanvas._ctx.fillRect(0,0,this.eventCanvas._ctx.canvas.width, this.eventCanvas._ctx.canvas.height);
|
||
|
||
// bind custom event handlers to regular events.
|
||
this.bindCustomEvents();
|
||
|
||
// draw legend before series if the series needs to know the legend dimensions.
|
||
if (this.legend.preDraw) {
|
||
this.eventCanvas._elem.before(legendElem);
|
||
this.legend.pack(legendPadding);
|
||
if (this.legend._elem) {
|
||
this.drawSeries({legendInfo:{location:this.legend.location, placement:this.legend.placement, width:this.legend.getWidth(), height:this.legend.getHeight(), xoffset:this.legend.xoffset, yoffset:this.legend.yoffset}});
|
||
}
|
||
else {
|
||
this.drawSeries();
|
||
}
|
||
}
|
||
else { // draw series before legend
|
||
this.drawSeries();
|
||
if (this.series.length) {
|
||
$(this.series[this.series.length-1].canvas._elem).after(legendElem);
|
||
}
|
||
this.legend.pack(legendPadding);
|
||
}
|
||
|
||
// register event listeners on the overlay canvas
|
||
for (var i=0; i<$.jqplot.eventListenerHooks.length; i++) {
|
||
// in the handler, this will refer to the eventCanvas dom element.
|
||
// make sure there are references back into plot objects.
|
||
this.eventCanvas._elem.bind($.jqplot.eventListenerHooks[i][0], {plot:this}, $.jqplot.eventListenerHooks[i][1]);
|
||
}
|
||
|
||
// register event listeners on the overlay canvas
|
||
for (var i=0; i<this.eventListenerHooks.hooks.length; i++) {
|
||
// in the handler, this will refer to the eventCanvas dom element.
|
||
// make sure there are references back into plot objects.
|
||
this.eventCanvas._elem.bind(this.eventListenerHooks.hooks[i][0], {plot:this}, this.eventListenerHooks.hooks[i][1]);
|
||
}
|
||
|
||
for (var i=0; i<$.jqplot.postDrawHooks.length; i++) {
|
||
$.jqplot.postDrawHooks[i].call(this);
|
||
}
|
||
|
||
for (var i=0; i<this.postDrawHooks.hooks.length; i++) {
|
||
this.postDrawHooks.hooks[i].call(this);
|
||
}
|
||
|
||
if (this.target.is(':visible')) {
|
||
this._drawCount += 1;
|
||
}
|
||
|
||
this.target.trigger('jqplotPostDraw', [this]);
|
||
}
|
||
};
|
||
|
||
this.bindCustomEvents = function() {
|
||
this.eventCanvas._elem.bind('click', {plot:this}, this.onClick);
|
||
this.eventCanvas._elem.bind('dblclick', {plot:this}, this.onDblClick);
|
||
this.eventCanvas._elem.bind('mousedown', {plot:this}, this.onMouseDown);
|
||
this.eventCanvas._elem.bind('mousemove', {plot:this}, this.onMouseMove);
|
||
this.eventCanvas._elem.bind('mouseenter', {plot:this}, this.onMouseEnter);
|
||
this.eventCanvas._elem.bind('mouseleave', {plot:this}, this.onMouseLeave);
|
||
if (this.captureRightClick) {
|
||
this.eventCanvas._elem.bind('mouseup', {plot:this}, this.onRightClick);
|
||
this.eventCanvas._elem.get(0).oncontextmenu = function() {
|
||
return false;
|
||
};
|
||
}
|
||
else {
|
||
this.eventCanvas._elem.bind('mouseup', {plot:this}, this.onMouseUp);
|
||
}
|
||
};
|
||
|
||
function getEventPosition(ev) {
|
||
var plot = ev.data.plot;
|
||
var go = plot.eventCanvas._elem.offset();
|
||
var gridPos = {x:ev.pageX - go.left, y:ev.pageY - go.top};
|
||
var dataPos = {xaxis:null, yaxis:null, x2axis:null, y2axis:null, y3axis:null, y4axis:null, y5axis:null, y6axis:null, y7axis:null, y8axis:null, y9axis:null, yMidAxis:null};
|
||
var an = ['xaxis', 'yaxis', 'x2axis', 'y2axis', 'y3axis', 'y4axis', 'y5axis', 'y6axis', 'y7axis', 'y8axis', 'y9axis', 'yMidAxis'];
|
||
var ax = plot.axes;
|
||
var n, axis;
|
||
for (n=11; n>0; n--) {
|
||
axis = an[n-1];
|
||
if (ax[axis].show) {
|
||
dataPos[axis] = ax[axis].series_p2u(gridPos[axis.charAt(0)]);
|
||
}
|
||
}
|
||
|
||
return {offsets:go, gridPos:gridPos, dataPos:dataPos};
|
||
}
|
||
|
||
|
||
// function to check if event location is over a area area
|
||
function checkIntersection(gridpos, plot) {
|
||
var series = plot.series;
|
||
var i, j, k, s, r, x, y, theta, sm, sa, minang, maxang;
|
||
var d0, d, p, pp, points, bw;
|
||
var threshold, t;
|
||
for (k=plot.seriesStack.length-1; k>=0; k--) {
|
||
i = plot.seriesStack[k];
|
||
s = series[i];
|
||
switch (s.renderer.constructor) {
|
||
case $.jqplot.BarRenderer:
|
||
case $.jqplot.PyramidRenderer:
|
||
x = gridpos.x;
|
||
y = gridpos.y;
|
||
for (j=0; j<s._barPoints.length; j++) {
|
||
points = s._barPoints[j];
|
||
p = s.gridData[j];
|
||
if (x>points[0][0] && x<points[2][0] && y>points[2][1] && y<points[0][1]) {
|
||
return {seriesIndex:s.index, pointIndex:j, gridData:p, data:s.data[j], points:s._barPoints[j]};
|
||
}
|
||
}
|
||
break;
|
||
|
||
case $.jqplot.DonutRenderer:
|
||
sa = s.startAngle/180*Math.PI;
|
||
x = gridpos.x - s._center[0];
|
||
y = gridpos.y - s._center[1];
|
||
r = Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2));
|
||
if (x > 0 && -y >= 0) {
|
||
theta = 2*Math.PI - Math.atan(-y/x);
|
||
}
|
||
else if (x > 0 && -y < 0) {
|
||
theta = -Math.atan(-y/x);
|
||
}
|
||
else if (x < 0) {
|
||
theta = Math.PI - Math.atan(-y/x);
|
||
}
|
||
else if (x == 0 && -y > 0) {
|
||
theta = 3*Math.PI/2;
|
||
}
|
||
else if (x == 0 && -y < 0) {
|
||
theta = Math.PI/2;
|
||
}
|
||
else if (x == 0 && y == 0) {
|
||
theta = 0;
|
||
}
|
||
if (sa) {
|
||
theta -= sa;
|
||
if (theta < 0) {
|
||
theta += 2*Math.PI;
|
||
}
|
||
else if (theta > 2*Math.PI) {
|
||
theta -= 2*Math.PI;
|
||
}
|
||
}
|
||
|
||
sm = s.sliceMargin/180*Math.PI;
|
||
if (r < s._radius && r > s._innerRadius) {
|
||
for (j=0; j<s.gridData.length; j++) {
|
||
minang = (j>0) ? s.gridData[j-1][1]+sm : sm;
|
||
maxang = s.gridData[j][1];
|
||
if (theta > minang && theta < maxang) {
|
||
return {seriesIndex:s.index, pointIndex:j, gridData:s.gridData[j], data:s.data[j]};
|
||
}
|
||
}
|
||
}
|
||
break;
|
||
|
||
case $.jqplot.PieRenderer:
|
||
sa = s.startAngle/180*Math.PI;
|
||
x = gridpos.x - s._center[0];
|
||
y = gridpos.y - s._center[1];
|
||
r = Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2));
|
||
if (x > 0 && -y >= 0) {
|
||
theta = 2*Math.PI - Math.atan(-y/x);
|
||
}
|
||
else if (x > 0 && -y < 0) {
|
||
theta = -Math.atan(-y/x);
|
||
}
|
||
else if (x < 0) {
|
||
theta = Math.PI - Math.atan(-y/x);
|
||
}
|
||
else if (x == 0 && -y > 0) {
|
||
theta = 3*Math.PI/2;
|
||
}
|
||
else if (x == 0 && -y < 0) {
|
||
theta = Math.PI/2;
|
||
}
|
||
else if (x == 0 && y == 0) {
|
||
theta = 0;
|
||
}
|
||
if (sa) {
|
||
theta -= sa;
|
||
if (theta < 0) {
|
||
theta += 2*Math.PI;
|
||
}
|
||
else if (theta > 2*Math.PI) {
|
||
theta -= 2*Math.PI;
|
||
}
|
||
}
|
||
|
||
sm = s.sliceMargin/180*Math.PI;
|
||
if (r < s._radius) {
|
||
for (j=0; j<s.gridData.length; j++) {
|
||
minang = (j>0) ? s.gridData[j-1][1]+sm : sm;
|
||
maxang = s.gridData[j][1];
|
||
if (theta > minang && theta < maxang) {
|
||
return {seriesIndex:s.index, pointIndex:j, gridData:s.gridData[j], data:s.data[j]};
|
||
}
|
||
}
|
||
}
|
||
break;
|
||
|
||
case $.jqplot.BubbleRenderer:
|
||
x = gridpos.x;
|
||
y = gridpos.y;
|
||
var ret = null;
|
||
|
||
if (s.show) {
|
||
for (var j=0; j<s.gridData.length; j++) {
|
||
p = s.gridData[j];
|
||
d = Math.sqrt( (x-p[0]) * (x-p[0]) + (y-p[1]) * (y-p[1]) );
|
||
if (d <= p[2] && (d <= d0 || d0 == null)) {
|
||
d0 = d;
|
||
ret = {seriesIndex: i, pointIndex:j, gridData:p, data:s.data[j]};
|
||
}
|
||
}
|
||
if (ret != null) {
|
||
return ret;
|
||
}
|
||
}
|
||
break;
|
||
|
||
case $.jqplot.FunnelRenderer:
|
||
x = gridpos.x;
|
||
y = gridpos.y;
|
||
var v = s._vertices,
|
||
vfirst = v[0],
|
||
vlast = v[v.length-1],
|
||
lex,
|
||
rex,
|
||
cv;
|
||
|
||
// equations of right and left sides, returns x, y values given height of section (y value and 2 points)
|
||
|
||
function findedge (l, p1 , p2) {
|
||
var m = (p1[1] - p2[1])/(p1[0] - p2[0]);
|
||
var b = p1[1] - m*p1[0];
|
||
var y = l + p1[1];
|
||
|
||
return [(y - b)/m, y];
|
||
}
|
||
|
||
// check each section
|
||
lex = findedge(y, vfirst[0], vlast[3]);
|
||
rex = findedge(y, vfirst[1], vlast[2]);
|
||
for (j=0; j<v.length; j++) {
|
||
cv = v[j];
|
||
if (y >= cv[0][1] && y <= cv[3][1] && x >= lex[0] && x <= rex[0]) {
|
||
return {seriesIndex:s.index, pointIndex:j, gridData:null, data:s.data[j]};
|
||
}
|
||
}
|
||
break;
|
||
|
||
case $.jqplot.LineRenderer:
|
||
x = gridpos.x;
|
||
y = gridpos.y;
|
||
r = s.renderer;
|
||
if (s.show) {
|
||
if ((s.fill || (s.renderer.bands.show && s.renderer.bands.fill)) && (!plot.plugins.highlighter || !plot.plugins.highlighter.show)) {
|
||
// first check if it is in bounding box
|
||
var inside = false;
|
||
if (x>s._boundingBox[0][0] && x<s._boundingBox[1][0] && y>s._boundingBox[1][1] && y<s._boundingBox[0][1]) {
|
||
// now check the crossing number
|
||
|
||
var numPoints = s._areaPoints.length;
|
||
var ii;
|
||
var j = numPoints-1;
|
||
|
||
for(var ii=0; ii < numPoints; ii++) {
|
||
var vertex1 = [s._areaPoints[ii][0], s._areaPoints[ii][1]];
|
||
var vertex2 = [s._areaPoints[j][0], s._areaPoints[j][1]];
|
||
|
||
if (vertex1[1] < y && vertex2[1] >= y || vertex2[1] < y && vertex1[1] >= y) {
|
||
if (vertex1[0] + (y - vertex1[1]) / (vertex2[1] - vertex1[1]) * (vertex2[0] - vertex1[0]) < x) {
|
||
inside = !inside;
|
||
}
|
||
}
|
||
|
||
j = ii;
|
||
}
|
||
}
|
||
if (inside) {
|
||
return {seriesIndex:i, pointIndex:null, gridData:s.gridData, data:s.data, points:s._areaPoints};
|
||
}
|
||
break;
|
||
|
||
}
|
||
|
||
else {
|
||
t = s.markerRenderer.size/2+s.neighborThreshold;
|
||
threshold = (t > 0) ? t : 0;
|
||
for (var j=0; j<s.gridData.length; j++) {
|
||
p = s.gridData[j];
|
||
// neighbor looks different to OHLC chart.
|
||
if (r.constructor == $.jqplot.OHLCRenderer) {
|
||
if (r.candleStick) {
|
||
var yp = s._yaxis.series_u2p;
|
||
if (x >= p[0]-r._bodyWidth/2 && x <= p[0]+r._bodyWidth/2 && y >= yp(s.data[j][2]) && y <= yp(s.data[j][3])) {
|
||
return {seriesIndex: i, pointIndex:j, gridData:p, data:s.data[j]};
|
||
}
|
||
}
|
||
// if an open hi low close chart
|
||
else if (!r.hlc){
|
||
var yp = s._yaxis.series_u2p;
|
||
if (x >= p[0]-r._tickLength && x <= p[0]+r._tickLength && y >= yp(s.data[j][2]) && y <= yp(s.data[j][3])) {
|
||
return {seriesIndex: i, pointIndex:j, gridData:p, data:s.data[j]};
|
||
}
|
||
}
|
||
// a hi low close chart
|
||
else {
|
||
var yp = s._yaxis.series_u2p;
|
||
if (x >= p[0]-r._tickLength && x <= p[0]+r._tickLength && y >= yp(s.data[j][1]) && y <= yp(s.data[j][2])) {
|
||
return {seriesIndex: i, pointIndex:j, gridData:p, data:s.data[j]};
|
||
}
|
||
}
|
||
|
||
}
|
||
else if (p[0] != null && p[1] != null){
|
||
d = Math.sqrt( (x-p[0]) * (x-p[0]) + (y-p[1]) * (y-p[1]) );
|
||
if (d <= threshold && (d <= d0 || d0 == null)) {
|
||
d0 = d;
|
||
return {seriesIndex: i, pointIndex:j, gridData:p, data:s.data[j]};
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
break;
|
||
|
||
default:
|
||
x = gridpos.x;
|
||
y = gridpos.y;
|
||
r = s.renderer;
|
||
if (s.show) {
|
||
t = s.markerRenderer.size/2+s.neighborThreshold;
|
||
threshold = (t > 0) ? t : 0;
|
||
for (var j=0; j<s.gridData.length; j++) {
|
||
p = s.gridData[j];
|
||
// neighbor looks different to OHLC chart.
|
||
if (r.constructor == $.jqplot.OHLCRenderer) {
|
||
if (r.candleStick) {
|
||
var yp = s._yaxis.series_u2p;
|
||
if (x >= p[0]-r._bodyWidth/2 && x <= p[0]+r._bodyWidth/2 && y >= yp(s.data[j][2]) && y <= yp(s.data[j][3])) {
|
||
return {seriesIndex: i, pointIndex:j, gridData:p, data:s.data[j]};
|
||
}
|
||
}
|
||
// if an open hi low close chart
|
||
else if (!r.hlc){
|
||
var yp = s._yaxis.series_u2p;
|
||
if (x >= p[0]-r._tickLength && x <= p[0]+r._tickLength && y >= yp(s.data[j][2]) && y <= yp(s.data[j][3])) {
|
||
return {seriesIndex: i, pointIndex:j, gridData:p, data:s.data[j]};
|
||
}
|
||
}
|
||
// a hi low close chart
|
||
else {
|
||
var yp = s._yaxis.series_u2p;
|
||
if (x >= p[0]-r._tickLength && x <= p[0]+r._tickLength && y >= yp(s.data[j][1]) && y <= yp(s.data[j][2])) {
|
||
return {seriesIndex: i, pointIndex:j, gridData:p, data:s.data[j]};
|
||
}
|
||
}
|
||
|
||
}
|
||
else {
|
||
d = Math.sqrt( (x-p[0]) * (x-p[0]) + (y-p[1]) * (y-p[1]) );
|
||
if (d <= threshold && (d <= d0 || d0 == null)) {
|
||
d0 = d;
|
||
return {seriesIndex: i, pointIndex:j, gridData:p, data:s.data[j]};
|
||
}
|
||
}
|
||
}
|
||
}
|
||
break;
|
||
}
|
||
}
|
||
|
||
return null;
|
||
}
|
||
|
||
|
||
|
||
this.onClick = function(ev) {
|
||
// Event passed in is normalized and will have data attribute.
|
||
// Event passed out is unnormalized.
|
||
var positions = getEventPosition(ev);
|
||
var p = ev.data.plot;
|
||
var neighbor = checkIntersection(positions.gridPos, p);
|
||
var evt = jQuery.Event('jqplotClick');
|
||
evt.pageX = ev.pageX;
|
||
evt.pageY = ev.pageY;
|
||
$(this).trigger(evt, [positions.gridPos, positions.dataPos, neighbor, p]);
|
||
};
|
||
|
||
this.onDblClick = function(ev) {
|
||
// Event passed in is normalized and will have data attribute.
|
||
// Event passed out is unnormalized.
|
||
var positions = getEventPosition(ev);
|
||
var p = ev.data.plot;
|
||
var neighbor = checkIntersection(positions.gridPos, p);
|
||
var evt = jQuery.Event('jqplotDblClick');
|
||
evt.pageX = ev.pageX;
|
||
evt.pageY = ev.pageY;
|
||
$(this).trigger(evt, [positions.gridPos, positions.dataPos, neighbor, p]);
|
||
};
|
||
|
||
this.onMouseDown = function(ev) {
|
||
var positions = getEventPosition(ev);
|
||
var p = ev.data.plot;
|
||
var neighbor = checkIntersection(positions.gridPos, p);
|
||
var evt = jQuery.Event('jqplotMouseDown');
|
||
evt.pageX = ev.pageX;
|
||
evt.pageY = ev.pageY;
|
||
$(this).trigger(evt, [positions.gridPos, positions.dataPos, neighbor, p]);
|
||
};
|
||
|
||
this.onMouseUp = function(ev) {
|
||
var positions = getEventPosition(ev);
|
||
var evt = jQuery.Event('jqplotMouseUp');
|
||
evt.pageX = ev.pageX;
|
||
evt.pageY = ev.pageY;
|
||
$(this).trigger(evt, [positions.gridPos, positions.dataPos, null, ev.data.plot]);
|
||
};
|
||
|
||
this.onRightClick = function(ev) {
|
||
var positions = getEventPosition(ev);
|
||
var p = ev.data.plot;
|
||
var neighbor = checkIntersection(positions.gridPos, p);
|
||
if (p.captureRightClick) {
|
||
if (ev.which == 3) {
|
||
var evt = jQuery.Event('jqplotRightClick');
|
||
evt.pageX = ev.pageX;
|
||
evt.pageY = ev.pageY;
|
||
$(this).trigger(evt, [positions.gridPos, positions.dataPos, neighbor, p]);
|
||
}
|
||
else {
|
||
var evt = jQuery.Event('jqplotMouseUp');
|
||
evt.pageX = ev.pageX;
|
||
evt.pageY = ev.pageY;
|
||
$(this).trigger(evt, [positions.gridPos, positions.dataPos, neighbor, p]);
|
||
}
|
||
}
|
||
};
|
||
|
||
this.onMouseMove = function(ev) {
|
||
var positions = getEventPosition(ev);
|
||
var p = ev.data.plot;
|
||
var neighbor = checkIntersection(positions.gridPos, p);
|
||
var evt = jQuery.Event('jqplotMouseMove');
|
||
evt.pageX = ev.pageX;
|
||
evt.pageY = ev.pageY;
|
||
$(this).trigger(evt, [positions.gridPos, positions.dataPos, neighbor, p]);
|
||
};
|
||
|
||
this.onMouseEnter = function(ev) {
|
||
var positions = getEventPosition(ev);
|
||
var p = ev.data.plot;
|
||
var evt = jQuery.Event('jqplotMouseEnter');
|
||
evt.pageX = ev.pageX;
|
||
evt.pageY = ev.pageY;
|
||
evt.relatedTarget = ev.relatedTarget;
|
||
$(this).trigger(evt, [positions.gridPos, positions.dataPos, null, p]);
|
||
};
|
||
|
||
this.onMouseLeave = function(ev) {
|
||
var positions = getEventPosition(ev);
|
||
var p = ev.data.plot;
|
||
var evt = jQuery.Event('jqplotMouseLeave');
|
||
evt.pageX = ev.pageX;
|
||
evt.pageY = ev.pageY;
|
||
evt.relatedTarget = ev.relatedTarget;
|
||
$(this).trigger(evt, [positions.gridPos, positions.dataPos, null, p]);
|
||
};
|
||
|
||
// method: drawSeries
|
||
// Redraws all or just one series on the plot. No axis scaling
|
||
// is performed and no other elements on the plot are redrawn.
|
||
// options is an options object to pass on to the series renderers.
|
||
// It can be an empty object {}. idx is the series index
|
||
// to redraw if only one series is to be redrawn.
|
||
this.drawSeries = function(options, idx){
|
||
var i, series, ctx;
|
||
// if only one argument passed in and it is a number, use it ad idx.
|
||
idx = (typeof(options) === "number" && idx == null) ? options : idx;
|
||
options = (typeof(options) === "object") ? options : {};
|
||
// draw specified series
|
||
if (idx != undefined) {
|
||
series = this.series[idx];
|
||
ctx = series.shadowCanvas._ctx;
|
||
ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
|
||
series.drawShadow(ctx, options, this);
|
||
ctx = series.canvas._ctx;
|
||
ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
|
||
series.draw(ctx, options, this);
|
||
if (series.renderer.constructor == $.jqplot.BezierCurveRenderer) {
|
||
if (idx < this.series.length - 1) {
|
||
this.drawSeries(idx+1);
|
||
}
|
||
}
|
||
}
|
||
|
||
else {
|
||
// if call series drawShadow method first, in case all series shadows
|
||
// should be drawn before any series. This will ensure, like for
|
||
// stacked bar plots, that shadows don't overlap series.
|
||
for (i=0; i<this.series.length; i++) {
|
||
// first clear the canvas
|
||
series = this.series[i];
|
||
ctx = series.shadowCanvas._ctx;
|
||
ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
|
||
series.drawShadow(ctx, options, this);
|
||
ctx = series.canvas._ctx;
|
||
ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
|
||
series.draw(ctx, options, this);
|
||
}
|
||
}
|
||
options = idx = i = series = ctx = null;
|
||
};
|
||
|
||
// method: moveSeriesToFront
|
||
// This method requires jQuery 1.4+
|
||
// Moves the specified series canvas in front of all other series canvases.
|
||
// This effectively "draws" the specified series on top of all other series,
|
||
// although it is performed through DOM manipulation, no redrawing is performed.
|
||
//
|
||
// Parameters:
|
||
// idx - 0 based index of the series to move. This will be the index of the series
|
||
// as it was first passed into the jqplot function.
|
||
this.moveSeriesToFront = function (idx) {
|
||
idx = parseInt(idx, 10);
|
||
var stackIndex = $.inArray(idx, this.seriesStack);
|
||
// if already in front, return
|
||
if (stackIndex == -1) {
|
||
return;
|
||
}
|
||
if (stackIndex == this.seriesStack.length -1) {
|
||
this.previousSeriesStack = this.seriesStack.slice(0);
|
||
return;
|
||
}
|
||
var opidx = this.seriesStack[this.seriesStack.length -1];
|
||
var serelem = this.series[idx].canvas._elem.detach();
|
||
var shadelem = this.series[idx].shadowCanvas._elem.detach();
|
||
this.series[opidx].shadowCanvas._elem.after(shadelem);
|
||
this.series[opidx].canvas._elem.after(serelem);
|
||
this.previousSeriesStack = this.seriesStack.slice(0);
|
||
this.seriesStack.splice(stackIndex, 1);
|
||
this.seriesStack.push(idx);
|
||
};
|
||
|
||
// method: moveSeriesToBack
|
||
// This method requires jQuery 1.4+
|
||
// Moves the specified series canvas behind all other series canvases.
|
||
//
|
||
// Parameters:
|
||
// idx - 0 based index of the series to move. This will be the index of the series
|
||
// as it was first passed into the jqplot function.
|
||
this.moveSeriesToBack = function (idx) {
|
||
idx = parseInt(idx, 10);
|
||
var stackIndex = $.inArray(idx, this.seriesStack);
|
||
// if already in back, return
|
||
if (stackIndex == 0 || stackIndex == -1) {
|
||
return;
|
||
}
|
||
var opidx = this.seriesStack[0];
|
||
var serelem = this.series[idx].canvas._elem.detach();
|
||
var shadelem = this.series[idx].shadowCanvas._elem.detach();
|
||
this.series[opidx].shadowCanvas._elem.before(shadelem);
|
||
this.series[opidx].canvas._elem.before(serelem);
|
||
this.previousSeriesStack = this.seriesStack.slice(0);
|
||
this.seriesStack.splice(stackIndex, 1);
|
||
this.seriesStack.unshift(idx);
|
||
};
|
||
|
||
// method: restorePreviousSeriesOrder
|
||
// This method requires jQuery 1.4+
|
||
// Restore the series canvas order to its previous state.
|
||
// Useful to put a series back where it belongs after moving
|
||
// it to the front.
|
||
this.restorePreviousSeriesOrder = function () {
|
||
var i, j, serelem, shadelem, temp, move, keep;
|
||
// if no change, return.
|
||
if (this.seriesStack == this.previousSeriesStack) {
|
||
return;
|
||
}
|
||
for (i=1; i<this.previousSeriesStack.length; i++) {
|
||
move = this.previousSeriesStack[i];
|
||
keep = this.previousSeriesStack[i-1];
|
||
serelem = this.series[move].canvas._elem.detach();
|
||
shadelem = this.series[move].shadowCanvas._elem.detach();
|
||
this.series[keep].shadowCanvas._elem.after(shadelem);
|
||
this.series[keep].canvas._elem.after(serelem);
|
||
}
|
||
temp = this.seriesStack.slice(0);
|
||
this.seriesStack = this.previousSeriesStack.slice(0);
|
||
this.previousSeriesStack = temp;
|
||
};
|
||
|
||
// method: restoreOriginalSeriesOrder
|
||
// This method requires jQuery 1.4+
|
||
// Restore the series canvas order to its original order
|
||
// when the plot was created.
|
||
this.restoreOriginalSeriesOrder = function () {
|
||
var i, j, arr=[], serelem, shadelem;
|
||
for (i=0; i<this.series.length; i++) {
|
||
arr.push(i);
|
||
}
|
||
if (this.seriesStack == arr) {
|
||
return;
|
||
}
|
||
this.previousSeriesStack = this.seriesStack.slice(0);
|
||
this.seriesStack = arr;
|
||
for (i=1; i<this.seriesStack.length; i++) {
|
||
serelem = this.series[i].canvas._elem.detach();
|
||
shadelem = this.series[i].shadowCanvas._elem.detach();
|
||
this.series[i-1].shadowCanvas._elem.after(shadelem);
|
||
this.series[i-1].canvas._elem.after(serelem);
|
||
}
|
||
};
|
||
|
||
this.activateTheme = function (name) {
|
||
this.themeEngine.activate(this, name);
|
||
};
|
||
}
|
||
|
||
|
||
// conpute a highlight color or array of highlight colors from given colors.
|
||
$.jqplot.computeHighlightColors = function(colors) {
|
||
var ret;
|
||
if (jQuery.isArray(colors)) {
|
||
ret = [];
|
||
for (var i=0; i<colors.length; i++){
|
||
var rgba = $.jqplot.getColorComponents(colors[i]);
|
||
var newrgb = [rgba[0], rgba[1], rgba[2]];
|
||
var sum = newrgb[0] + newrgb[1] + newrgb[2];
|
||
for (var j=0; j<3; j++) {
|
||
// when darkening, lowest color component can be is 60.
|
||
newrgb[j] = (sum > 660) ? newrgb[j] * 0.85 : 0.73 * newrgb[j] + 90;
|
||
newrgb[j] = parseInt(newrgb[j], 10);
|
||
(newrgb[j] > 255) ? 255 : newrgb[j];
|
||
}
|
||
// newrgb[3] = (rgba[3] > 0.4) ? rgba[3] * 0.4 : rgba[3] * 1.5;
|
||
// newrgb[3] = (rgba[3] > 0.5) ? 0.8 * rgba[3] - .1 : rgba[3] + 0.2;
|
||
newrgb[3] = 0.3 + 0.35 * rgba[3];
|
||
ret.push('rgba('+newrgb[0]+','+newrgb[1]+','+newrgb[2]+','+newrgb[3]+')');
|
||
}
|
||
}
|
||
else {
|
||
var rgba = $.jqplot.getColorComponents(colors);
|
||
var newrgb = [rgba[0], rgba[1], rgba[2]];
|
||
var sum = newrgb[0] + newrgb[1] + newrgb[2];
|
||
for (var j=0; j<3; j++) {
|
||
// when darkening, lowest color component can be is 60.
|
||
// newrgb[j] = (sum > 570) ? newrgb[j] * 0.8 : newrgb[j] + 0.3 * (255 - newrgb[j]);
|
||
// newrgb[j] = parseInt(newrgb[j], 10);
|
||
newrgb[j] = (sum > 660) ? newrgb[j] * 0.85 : 0.73 * newrgb[j] + 90;
|
||
newrgb[j] = parseInt(newrgb[j], 10);
|
||
(newrgb[j] > 255) ? 255 : newrgb[j];
|
||
}
|
||
// newrgb[3] = (rgba[3] > 0.4) ? rgba[3] * 0.4 : rgba[3] * 1.5;
|
||
// newrgb[3] = (rgba[3] > 0.5) ? 0.8 * rgba[3] - .1 : rgba[3] + 0.2;
|
||
newrgb[3] = 0.3 + 0.35 * rgba[3];
|
||
ret = 'rgba('+newrgb[0]+','+newrgb[1]+','+newrgb[2]+','+newrgb[3]+')';
|
||
}
|
||
return ret;
|
||
};
|
||
|
||
$.jqplot.ColorGenerator = function(colors) {
|
||
colors = colors || $.jqplot.config.defaultColors;
|
||
var idx = 0;
|
||
|
||
this.next = function () {
|
||
if (idx < colors.length) {
|
||
return colors[idx++];
|
||
}
|
||
else {
|
||
idx = 0;
|
||
return colors[idx++];
|
||
}
|
||
};
|
||
|
||
this.previous = function () {
|
||
if (idx > 0) {
|
||
return colors[idx--];
|
||
}
|
||
else {
|
||
idx = colors.length-1;
|
||
return colors[idx];
|
||
}
|
||
};
|
||
|
||
// get a color by index without advancing pointer.
|
||
this.get = function(i) {
|
||
var idx = i - colors.length * Math.floor(i/colors.length);
|
||
return colors[idx];
|
||
};
|
||
|
||
this.setColors = function(c) {
|
||
colors = c;
|
||
};
|
||
|
||
this.reset = function() {
|
||
idx = 0;
|
||
};
|
||
|
||
this.getIndex = function() {
|
||
return idx;
|
||
};
|
||
|
||
this.setIndex = function(index) {
|
||
idx = index;
|
||
};
|
||
};
|
||
|
||
// convert a hex color string to rgb string.
|
||
// h - 3 or 6 character hex string, with or without leading #
|
||
// a - optional alpha
|
||
$.jqplot.hex2rgb = function(h, a) {
|
||
h = h.replace('#', '');
|
||
if (h.length == 3) {
|
||
h = h.charAt(0)+h.charAt(0)+h.charAt(1)+h.charAt(1)+h.charAt(2)+h.charAt(2);
|
||
}
|
||
var rgb;
|
||
rgb = 'rgba('+parseInt(h.slice(0,2), 16)+', '+parseInt(h.slice(2,4), 16)+', '+parseInt(h.slice(4,6), 16);
|
||
if (a) {
|
||
rgb += ', '+a;
|
||
}
|
||
rgb += ')';
|
||
return rgb;
|
||
};
|
||
|
||
// convert an rgb color spec to a hex spec. ignore any alpha specification.
|
||
$.jqplot.rgb2hex = function(s) {
|
||
var pat = /rgba?\( *([0-9]{1,3}\.?[0-9]*%?) *, *([0-9]{1,3}\.?[0-9]*%?) *, *([0-9]{1,3}\.?[0-9]*%?) *(?:, *[0-9.]*)?\)/;
|
||
var m = s.match(pat);
|
||
var h = '#';
|
||
for (var i=1; i<4; i++) {
|
||
var temp;
|
||
if (m[i].search(/%/) != -1) {
|
||
temp = parseInt(255*m[i]/100, 10).toString(16);
|
||
if (temp.length == 1) {
|
||
temp = '0'+temp;
|
||
}
|
||
}
|
||
else {
|
||
temp = parseInt(m[i], 10).toString(16);
|
||
if (temp.length == 1) {
|
||
temp = '0'+temp;
|
||
}
|
||
}
|
||
h += temp;
|
||
}
|
||
return h;
|
||
};
|
||
|
||
// given a css color spec, return an rgb css color spec
|
||
$.jqplot.normalize2rgb = function(s, a) {
|
||
if (s.search(/^ *rgba?\(/) != -1) {
|
||
return s;
|
||
}
|
||
else if (s.search(/^ *#?[0-9a-fA-F]?[0-9a-fA-F]/) != -1) {
|
||
return $.jqplot.hex2rgb(s, a);
|
||
}
|
||
else {
|
||
throw 'invalid color spec';
|
||
}
|
||
};
|
||
|
||
// extract the r, g, b, a color components out of a css color spec.
|
||
$.jqplot.getColorComponents = function(s) {
|
||
// check to see if a color keyword.
|
||
s = $.jqplot.colorKeywordMap[s] || s;
|
||
var rgb = $.jqplot.normalize2rgb(s);
|
||
var pat = /rgba?\( *([0-9]{1,3}\.?[0-9]*%?) *, *([0-9]{1,3}\.?[0-9]*%?) *, *([0-9]{1,3}\.?[0-9]*%?) *,? *([0-9.]* *)?\)/;
|
||
var m = rgb.match(pat);
|
||
var ret = [];
|
||
for (var i=1; i<4; i++) {
|
||
if (m[i].search(/%/) != -1) {
|
||
ret[i-1] = parseInt(255*m[i]/100, 10);
|
||
}
|
||
else {
|
||
ret[i-1] = parseInt(m[i], 10);
|
||
}
|
||
}
|
||
ret[3] = parseFloat(m[4]) ? parseFloat(m[4]) : 1.0;
|
||
return ret;
|
||
};
|
||
|
||
$.jqplot.colorKeywordMap = {
|
||
aliceblue: 'rgb(240, 248, 255)',
|
||
antiquewhite: 'rgb(250, 235, 215)',
|
||
aqua: 'rgb( 0, 255, 255)',
|
||
aquamarine: 'rgb(127, 255, 212)',
|
||
azure: 'rgb(240, 255, 255)',
|
||
beige: 'rgb(245, 245, 220)',
|
||
bisque: 'rgb(255, 228, 196)',
|
||
black: 'rgb( 0, 0, 0)',
|
||
blanchedalmond: 'rgb(255, 235, 205)',
|
||
blue: 'rgb( 0, 0, 255)',
|
||
blueviolet: 'rgb(138, 43, 226)',
|
||
brown: 'rgb(165, 42, 42)',
|
||
burlywood: 'rgb(222, 184, 135)',
|
||
cadetblue: 'rgb( 95, 158, 160)',
|
||
chartreuse: 'rgb(127, 255, 0)',
|
||
chocolate: 'rgb(210, 105, 30)',
|
||
coral: 'rgb(255, 127, 80)',
|
||
cornflowerblue: 'rgb(100, 149, 237)',
|
||
cornsilk: 'rgb(255, 248, 220)',
|
||
crimson: 'rgb(220, 20, 60)',
|
||
cyan: 'rgb( 0, 255, 255)',
|
||
darkblue: 'rgb( 0, 0, 139)',
|
||
darkcyan: 'rgb( 0, 139, 139)',
|
||
darkgoldenrod: 'rgb(184, 134, 11)',
|
||
darkgray: 'rgb(169, 169, 169)',
|
||
darkgreen: 'rgb( 0, 100, 0)',
|
||
darkgrey: 'rgb(169, 169, 169)',
|
||
darkkhaki: 'rgb(189, 183, 107)',
|
||
darkmagenta: 'rgb(139, 0, 139)',
|
||
darkolivegreen: 'rgb( 85, 107, 47)',
|
||
darkorange: 'rgb(255, 140, 0)',
|
||
darkorchid: 'rgb(153, 50, 204)',
|
||
darkred: 'rgb(139, 0, 0)',
|
||
darksalmon: 'rgb(233, 150, 122)',
|
||
darkseagreen: 'rgb(143, 188, 143)',
|
||
darkslateblue: 'rgb( 72, 61, 139)',
|
||
darkslategray: 'rgb( 47, 79, 79)',
|
||
darkslategrey: 'rgb( 47, 79, 79)',
|
||
darkturquoise: 'rgb( 0, 206, 209)',
|
||
darkviolet: 'rgb(148, 0, 211)',
|
||
deeppink: 'rgb(255, 20, 147)',
|
||
deepskyblue: 'rgb( 0, 191, 255)',
|
||
dimgray: 'rgb(105, 105, 105)',
|
||
dimgrey: 'rgb(105, 105, 105)',
|
||
dodgerblue: 'rgb( 30, 144, 255)',
|
||
firebrick: 'rgb(178, 34, 34)',
|
||
floralwhite: 'rgb(255, 250, 240)',
|
||
forestgreen: 'rgb( 34, 139, 34)',
|
||
fuchsia: 'rgb(255, 0, 255)',
|
||
gainsboro: 'rgb(220, 220, 220)',
|
||
ghostwhite: 'rgb(248, 248, 255)',
|
||
gold: 'rgb(255, 215, 0)',
|
||
goldenrod: 'rgb(218, 165, 32)',
|
||
gray: 'rgb(128, 128, 128)',
|
||
grey: 'rgb(128, 128, 128)',
|
||
green: 'rgb( 0, 128, 0)',
|
||
greenyellow: 'rgb(173, 255, 47)',
|
||
honeydew: 'rgb(240, 255, 240)',
|
||
hotpink: 'rgb(255, 105, 180)',
|
||
indianred: 'rgb(205, 92, 92)',
|
||
indigo: 'rgb( 75, 0, 130)',
|
||
ivory: 'rgb(255, 255, 240)',
|
||
khaki: 'rgb(240, 230, 140)',
|
||
lavender: 'rgb(230, 230, 250)',
|
||
lavenderblush: 'rgb(255, 240, 245)',
|
||
lawngreen: 'rgb(124, 252, 0)',
|
||
lemonchiffon: 'rgb(255, 250, 205)',
|
||
lightblue: 'rgb(173, 216, 230)',
|
||
lightcoral: 'rgb(240, 128, 128)',
|
||
lightcyan: 'rgb(224, 255, 255)',
|
||
lightgoldenrodyellow: 'rgb(250, 250, 210)',
|
||
lightgray: 'rgb(211, 211, 211)',
|
||
lightgreen: 'rgb(144, 238, 144)',
|
||
lightgrey: 'rgb(211, 211, 211)',
|
||
lightpink: 'rgb(255, 182, 193)',
|
||
lightsalmon: 'rgb(255, 160, 122)',
|
||
lightseagreen: 'rgb( 32, 178, 170)',
|
||
lightskyblue: 'rgb(135, 206, 250)',
|
||
lightslategray: 'rgb(119, 136, 153)',
|
||
lightslategrey: 'rgb(119, 136, 153)',
|
||
lightsteelblue: 'rgb(176, 196, 222)',
|
||
lightyellow: 'rgb(255, 255, 224)',
|
||
lime: 'rgb( 0, 255, 0)',
|
||
limegreen: 'rgb( 50, 205, 50)',
|
||
linen: 'rgb(250, 240, 230)',
|
||
magenta: 'rgb(255, 0, 255)',
|
||
maroon: 'rgb(128, 0, 0)',
|
||
mediumaquamarine: 'rgb(102, 205, 170)',
|
||
mediumblue: 'rgb( 0, 0, 205)',
|
||
mediumorchid: 'rgb(186, 85, 211)',
|
||
mediumpurple: 'rgb(147, 112, 219)',
|
||
mediumseagreen: 'rgb( 60, 179, 113)',
|
||
mediumslateblue: 'rgb(123, 104, 238)',
|
||
mediumspringgreen: 'rgb( 0, 250, 154)',
|
||
mediumturquoise: 'rgb( 72, 209, 204)',
|
||
mediumvioletred: 'rgb(199, 21, 133)',
|
||
midnightblue: 'rgb( 25, 25, 112)',
|
||
mintcream: 'rgb(245, 255, 250)',
|
||
mistyrose: 'rgb(255, 228, 225)',
|
||
moccasin: 'rgb(255, 228, 181)',
|
||
navajowhite: 'rgb(255, 222, 173)',
|
||
navy: 'rgb( 0, 0, 128)',
|
||
oldlace: 'rgb(253, 245, 230)',
|
||
olive: 'rgb(128, 128, 0)',
|
||
olivedrab: 'rgb(107, 142, 35)',
|
||
orange: 'rgb(255, 165, 0)',
|
||
orangered: 'rgb(255, 69, 0)',
|
||
orchid: 'rgb(218, 112, 214)',
|
||
palegoldenrod: 'rgb(238, 232, 170)',
|
||
palegreen: 'rgb(152, 251, 152)',
|
||
paleturquoise: 'rgb(175, 238, 238)',
|
||
palevioletred: 'rgb(219, 112, 147)',
|
||
papayawhip: 'rgb(255, 239, 213)',
|
||
peachpuff: 'rgb(255, 218, 185)',
|
||
peru: 'rgb(205, 133, 63)',
|
||
pink: 'rgb(255, 192, 203)',
|
||
plum: 'rgb(221, 160, 221)',
|
||
powderblue: 'rgb(176, 224, 230)',
|
||
purple: 'rgb(128, 0, 128)',
|
||
red: 'rgb(255, 0, 0)',
|
||
rosybrown: 'rgb(188, 143, 143)',
|
||
royalblue: 'rgb( 65, 105, 225)',
|
||
saddlebrown: 'rgb(139, 69, 19)',
|
||
salmon: 'rgb(250, 128, 114)',
|
||
sandybrown: 'rgb(244, 164, 96)',
|
||
seagreen: 'rgb( 46, 139, 87)',
|
||
seashell: 'rgb(255, 245, 238)',
|
||
sienna: 'rgb(160, 82, 45)',
|
||
silver: 'rgb(192, 192, 192)',
|
||
skyblue: 'rgb(135, 206, 235)',
|
||
slateblue: 'rgb(106, 90, 205)',
|
||
slategray: 'rgb(112, 128, 144)',
|
||
slategrey: 'rgb(112, 128, 144)',
|
||
snow: 'rgb(255, 250, 250)',
|
||
springgreen: 'rgb( 0, 255, 127)',
|
||
steelblue: 'rgb( 70, 130, 180)',
|
||
tan: 'rgb(210, 180, 140)',
|
||
teal: 'rgb( 0, 128, 128)',
|
||
thistle: 'rgb(216, 191, 216)',
|
||
tomato: 'rgb(255, 99, 71)',
|
||
turquoise: 'rgb( 64, 224, 208)',
|
||
violet: 'rgb(238, 130, 238)',
|
||
wheat: 'rgb(245, 222, 179)',
|
||
white: 'rgb(255, 255, 255)',
|
||
whitesmoke: 'rgb(245, 245, 245)',
|
||
yellow: 'rgb(255, 255, 0)',
|
||
yellowgreen: 'rgb(154, 205, 50)'
|
||
};
|
||
|
||
|
||
|
||
// class: $.jqplot.AxisLabelRenderer
|
||
// Renderer to place labels on the axes.
|
||
$.jqplot.AxisLabelRenderer = function(options) {
|
||
// Group: Properties
|
||
$.jqplot.ElemContainer.call(this);
|
||
// name of the axis associated with this tick
|
||
this.axis;
|
||
// prop: show
|
||
// wether or not to show the tick (mark and label).
|
||
this.show = true;
|
||
// prop: label
|
||
// The text or html for the label.
|
||
this.label = '';
|
||
this.fontFamily = null;
|
||
this.fontSize = null;
|
||
this.textColor = null;
|
||
this._elem;
|
||
// prop: escapeHTML
|
||
// true to escape HTML entities in the label.
|
||
this.escapeHTML = false;
|
||
|
||
$.extend(true, this, options);
|
||
};
|
||
|
||
$.jqplot.AxisLabelRenderer.prototype = new $.jqplot.ElemContainer();
|
||
$.jqplot.AxisLabelRenderer.prototype.constructor = $.jqplot.AxisLabelRenderer;
|
||
|
||
$.jqplot.AxisLabelRenderer.prototype.init = function(options) {
|
||
$.extend(true, this, options);
|
||
};
|
||
|
||
$.jqplot.AxisLabelRenderer.prototype.draw = function(ctx, plot) {
|
||
// Memory Leaks patch
|
||
if (this._elem) {
|
||
this._elem.emptyForce();
|
||
this._elem = null;
|
||
}
|
||
|
||
this._elem = $('<div style="position:absolute;" class="jqplot-'+this.axis+'-label"></div>');
|
||
|
||
if (Number(this.label)) {
|
||
this._elem.css('white-space', 'nowrap');
|
||
}
|
||
|
||
if (!this.escapeHTML) {
|
||
this._elem.html(this.label);
|
||
}
|
||
else {
|
||
this._elem.text(this.label);
|
||
}
|
||
if (this.fontFamily) {
|
||
this._elem.css('font-family', this.fontFamily);
|
||
}
|
||
if (this.fontSize) {
|
||
this._elem.css('font-size', this.fontSize);
|
||
}
|
||
if (this.textColor) {
|
||
this._elem.css('color', this.textColor);
|
||
}
|
||
|
||
return this._elem;
|
||
};
|
||
|
||
$.jqplot.AxisLabelRenderer.prototype.pack = function() {
|
||
};
|
||
|
||
// class: $.jqplot.AxisTickRenderer
|
||
// A "tick" object showing the value of a tick/gridline on the plot.
|
||
$.jqplot.AxisTickRenderer = function(options) {
|
||
// Group: Properties
|
||
$.jqplot.ElemContainer.call(this);
|
||
// prop: mark
|
||
// tick mark on the axis. One of 'inside', 'outside', 'cross', '' or null.
|
||
this.mark = 'outside';
|
||
// name of the axis associated with this tick
|
||
this.axis;
|
||
// prop: showMark
|
||
// wether or not to show the mark on the axis.
|
||
this.showMark = true;
|
||
// prop: showGridline
|
||
// wether or not to draw the gridline on the grid at this tick.
|
||
this.showGridline = true;
|
||
// prop: isMinorTick
|
||
// if this is a minor tick.
|
||
this.isMinorTick = false;
|
||
// prop: size
|
||
// Length of the tick beyond the grid in pixels.
|
||
// DEPRECATED: This has been superceeded by markSize
|
||
this.size = 4;
|
||
// prop: markSize
|
||
// Length of the tick marks in pixels. For 'cross' style, length
|
||
// will be stoked above and below axis, so total length will be twice this.
|
||
this.markSize = 6;
|
||
// prop: show
|
||
// wether or not to show the tick (mark and label).
|
||
// Setting this to false requires more testing. It is recommended
|
||
// to set showLabel and showMark to false instead.
|
||
this.show = true;
|
||
// prop: showLabel
|
||
// wether or not to show the label.
|
||
this.showLabel = true;
|
||
this.label = null;
|
||
this.value = null;
|
||
this._styles = {};
|
||
// prop: formatter
|
||
// A class of a formatter for the tick text. sprintf by default.
|
||
this.formatter = $.jqplot.DefaultTickFormatter;
|
||
// prop: prefix
|
||
// String to prepend to the tick label.
|
||
// Prefix is prepended to the formatted tick label.
|
||
this.prefix = '';
|
||
// prop: formatString
|
||
// string passed to the formatter.
|
||
this.formatString = '';
|
||
// prop: fontFamily
|
||
// css spec for the font-family css attribute.
|
||
this.fontFamily;
|
||
// prop: fontSize
|
||
// css spec for the font-size css attribute.
|
||
this.fontSize;
|
||
// prop: textColor
|
||
// css spec for the color attribute.
|
||
this.textColor;
|
||
// prop: escapeHTML
|
||
// true to escape HTML entities in the label.
|
||
this.escapeHTML = false;
|
||
this._elem;
|
||
this._breakTick = false;
|
||
|
||
$.extend(true, this, options);
|
||
};
|
||
|
||
$.jqplot.AxisTickRenderer.prototype.init = function(options) {
|
||
$.extend(true, this, options);
|
||
};
|
||
|
||
$.jqplot.AxisTickRenderer.prototype = new $.jqplot.ElemContainer();
|
||
$.jqplot.AxisTickRenderer.prototype.constructor = $.jqplot.AxisTickRenderer;
|
||
|
||
$.jqplot.AxisTickRenderer.prototype.setTick = function(value, axisName, isMinor) {
|
||
this.value = value;
|
||
this.axis = axisName;
|
||
if (isMinor) {
|
||
this.isMinorTick = true;
|
||
}
|
||
return this;
|
||
};
|
||
|
||
$.jqplot.AxisTickRenderer.prototype.draw = function() {
|
||
if (this.label === null) {
|
||
this.label = this.prefix + this.formatter(this.formatString, this.value);
|
||
}
|
||
var style = {position: 'absolute'};
|
||
if (Number(this.label)) {
|
||
style['whitSpace'] = 'nowrap';
|
||
}
|
||
|
||
// Memory Leaks patch
|
||
if (this._elem) {
|
||
this._elem.emptyForce();
|
||
this._elem = null;
|
||
}
|
||
|
||
this._elem = $(document.createElement('div'));
|
||
this._elem.addClass("jqplot-"+this.axis+"-tick");
|
||
|
||
if (!this.escapeHTML) {
|
||
this._elem.html(this.label);
|
||
}
|
||
else {
|
||
this._elem.text(this.label);
|
||
}
|
||
|
||
this._elem.css(style);
|
||
|
||
for (var s in this._styles) {
|
||
this._elem.css(s, this._styles[s]);
|
||
}
|
||
if (this.fontFamily) {
|
||
this._elem.css('font-family', this.fontFamily);
|
||
}
|
||
if (this.fontSize) {
|
||
this._elem.css('font-size', this.fontSize);
|
||
}
|
||
if (this.textColor) {
|
||
this._elem.css('color', this.textColor);
|
||
}
|
||
if (this._breakTick) {
|
||
this._elem.addClass('jqplot-breakTick');
|
||
}
|
||
|
||
return this._elem;
|
||
};
|
||
|
||
$.jqplot.DefaultTickFormatter = function (format, val) {
|
||
if (typeof val == 'number') {
|
||
if (!format) {
|
||
format = $.jqplot.config.defaultTickFormatString;
|
||
}
|
||
return $.jqplot.sprintf(format, val);
|
||
}
|
||
else {
|
||
return String(val);
|
||
}
|
||
};
|
||
|
||
$.jqplot.AxisTickRenderer.prototype.pack = function() {
|
||
};
|
||
|
||
// Class: $.jqplot.CanvasGridRenderer
|
||
// The default jqPlot grid renderer, creating a grid on a canvas element.
|
||
// The renderer has no additional options beyond the <Grid> class.
|
||
$.jqplot.CanvasGridRenderer = function(){
|
||
this.shadowRenderer = new $.jqplot.ShadowRenderer();
|
||
};
|
||
|
||
// called with context of Grid object
|
||
$.jqplot.CanvasGridRenderer.prototype.init = function(options) {
|
||
this._ctx;
|
||
$.extend(true, this, options);
|
||
// set the shadow renderer options
|
||
var sopts = {lineJoin:'miter', lineCap:'round', fill:false, isarc:false, angle:this.shadowAngle, offset:this.shadowOffset, alpha:this.shadowAlpha, depth:this.shadowDepth, lineWidth:this.shadowWidth, closePath:false, strokeStyle:this.shadowColor};
|
||
this.renderer.shadowRenderer.init(sopts);
|
||
};
|
||
|
||
// called with context of Grid.
|
||
$.jqplot.CanvasGridRenderer.prototype.createElement = function(plot) {
|
||
var elem;
|
||
// Memory Leaks patch
|
||
if (this._elem) {
|
||
if ($.jqplot.use_excanvas && window.G_vmlCanvasManager.uninitElement !== undefined) {
|
||
elem = this._elem.get(0);
|
||
window.G_vmlCanvasManager.uninitElement(elem);
|
||
elem = null;
|
||
}
|
||
|
||
this._elem.emptyForce();
|
||
this._elem = null;
|
||
}
|
||
|
||
elem = plot.canvasManager.getCanvas();
|
||
|
||
var w = this._plotDimensions.width;
|
||
var h = this._plotDimensions.height;
|
||
elem.width = w;
|
||
elem.height = h;
|
||
this._elem = $(elem);
|
||
this._elem.addClass('jqplot-grid-canvas');
|
||
this._elem.css({ position: 'absolute', left: 0, top: 0 });
|
||
|
||
elem = plot.canvasManager.initCanvas(elem);
|
||
|
||
this._top = this._offsets.top;
|
||
this._bottom = h - this._offsets.bottom;
|
||
this._left = this._offsets.left;
|
||
this._right = w - this._offsets.right;
|
||
this._width = this._right - this._left;
|
||
this._height = this._bottom - this._top;
|
||
// avoid memory leak
|
||
elem = null;
|
||
return this._elem;
|
||
};
|
||
|
||
$.jqplot.CanvasGridRenderer.prototype.draw = function() {
|
||
this._ctx = this._elem.get(0).getContext("2d");
|
||
var ctx = this._ctx;
|
||
var axes = this._axes;
|
||
// Add the grid onto the grid canvas. This is the bottom most layer.
|
||
ctx.save();
|
||
ctx.clearRect(0, 0, this._plotDimensions.width, this._plotDimensions.height);
|
||
ctx.fillStyle = this.backgroundColor || this.background;
|
||
ctx.fillRect(this._left, this._top, this._width, this._height);
|
||
|
||
ctx.save();
|
||
ctx.lineJoin = 'miter';
|
||
ctx.lineCap = 'butt';
|
||
ctx.lineWidth = this.gridLineWidth;
|
||
ctx.strokeStyle = this.gridLineColor;
|
||
var b, e, s, m;
|
||
var ax = ['xaxis', 'yaxis', 'x2axis', 'y2axis'];
|
||
for (var i=4; i>0; i--) {
|
||
var name = ax[i-1];
|
||
var axis = axes[name];
|
||
var ticks = axis._ticks;
|
||
var numticks = ticks.length;
|
||
if (axis.show) {
|
||
if (axis.drawBaseline) {
|
||
var bopts = {};
|
||
if (axis.baselineWidth !== null) {
|
||
bopts.lineWidth = axis.baselineWidth;
|
||
}
|
||
if (axis.baselineColor !== null) {
|
||
bopts.strokeStyle = axis.baselineColor;
|
||
}
|
||
switch (name) {
|
||
case 'xaxis':
|
||
drawLine (this._left, this._bottom, this._right, this._bottom, bopts);
|
||
break;
|
||
case 'yaxis':
|
||
drawLine (this._left, this._bottom, this._left, this._top, bopts);
|
||
break;
|
||
case 'x2axis':
|
||
drawLine (this._left, this._bottom, this._right, this._bottom, bopts);
|
||
break;
|
||
case 'y2axis':
|
||
drawLine (this._right, this._bottom, this._right, this._top, bopts);
|
||
break;
|
||
}
|
||
}
|
||
for (var j=numticks; j>0; j--) {
|
||
var t = ticks[j-1];
|
||
if (t.show) {
|
||
var pos = Math.round(axis.u2p(t.value)) + 0.5;
|
||
switch (name) {
|
||
case 'xaxis':
|
||
// draw the grid line if we should
|
||
if (t.showGridline && this.drawGridlines && ((!t.isMinorTick && axis.drawMajorGridlines) || (t.isMinorTick && axis.drawMinorGridlines)) ) {
|
||
drawLine(pos, this._top, pos, this._bottom);
|
||
}
|
||
// draw the mark
|
||
if (t.showMark && t.mark && ((!t.isMinorTick && axis.drawMajorTickMarks) || (t.isMinorTick && axis.drawMinorTickMarks)) ) {
|
||
s = t.markSize;
|
||
m = t.mark;
|
||
var pos = Math.round(axis.u2p(t.value)) + 0.5;
|
||
switch (m) {
|
||
case 'outside':
|
||
b = this._bottom;
|
||
e = this._bottom+s;
|
||
break;
|
||
case 'inside':
|
||
b = this._bottom-s;
|
||
e = this._bottom;
|
||
break;
|
||
case 'cross':
|
||
b = this._bottom-s;
|
||
e = this._bottom+s;
|
||
break;
|
||
default:
|
||
b = this._bottom;
|
||
e = this._bottom+s;
|
||
break;
|
||
}
|
||
// draw the shadow
|
||
if (this.shadow) {
|
||
this.renderer.shadowRenderer.draw(ctx, [[pos,b],[pos,e]], {lineCap:'butt', lineWidth:this.gridLineWidth, offset:this.gridLineWidth*0.75, depth:2, fill:false, closePath:false});
|
||
}
|
||
// draw the line
|
||
drawLine(pos, b, pos, e);
|
||
}
|
||
break;
|
||
case 'yaxis':
|
||
// draw the grid line
|
||
if (t.showGridline && this.drawGridlines && ((!t.isMinorTick && axis.drawMajorGridlines) || (t.isMinorTick && axis.drawMinorGridlines)) ) {
|
||
drawLine(this._right, pos, this._left, pos);
|
||
}
|
||
// draw the mark
|
||
if (t.showMark && t.mark && ((!t.isMinorTick && axis.drawMajorTickMarks) || (t.isMinorTick && axis.drawMinorTickMarks)) ) {
|
||
s = t.markSize;
|
||
m = t.mark;
|
||
var pos = Math.round(axis.u2p(t.value)) + 0.5;
|
||
switch (m) {
|
||
case 'outside':
|
||
b = this._left-s;
|
||
e = this._left;
|
||
break;
|
||
case 'inside':
|
||
b = this._left;
|
||
e = this._left+s;
|
||
break;
|
||
case 'cross':
|
||
b = this._left-s;
|
||
e = this._left+s;
|
||
break;
|
||
default:
|
||
b = this._left-s;
|
||
e = this._left;
|
||
break;
|
||
}
|
||
// draw the shadow
|
||
if (this.shadow) {
|
||
this.renderer.shadowRenderer.draw(ctx, [[b, pos], [e, pos]], {lineCap:'butt', lineWidth:this.gridLineWidth*1.5, offset:this.gridLineWidth*0.75, fill:false, closePath:false});
|
||
}
|
||
drawLine(b, pos, e, pos, {strokeStyle:axis.borderColor});
|
||
}
|
||
break;
|
||
case 'x2axis':
|
||
// draw the grid line
|
||
if (t.showGridline && this.drawGridlines && ((!t.isMinorTick && axis.drawMajorGridlines) || (t.isMinorTick && axis.drawMinorGridlines)) ) {
|
||
drawLine(pos, this._bottom, pos, this._top);
|
||
}
|
||
// draw the mark
|
||
if (t.showMark && t.mark && ((!t.isMinorTick && axis.drawMajorTickMarks) || (t.isMinorTick && axis.drawMinorTickMarks)) ) {
|
||
s = t.markSize;
|
||
m = t.mark;
|
||
var pos = Math.round(axis.u2p(t.value)) + 0.5;
|
||
switch (m) {
|
||
case 'outside':
|
||
b = this._top-s;
|
||
e = this._top;
|
||
break;
|
||
case 'inside':
|
||
b = this._top;
|
||
e = this._top+s;
|
||
break;
|
||
case 'cross':
|
||
b = this._top-s;
|
||
e = this._top+s;
|
||
break;
|
||
default:
|
||
b = this._top-s;
|
||
e = this._top;
|
||
break;
|
||
}
|
||
// draw the shadow
|
||
if (this.shadow) {
|
||
this.renderer.shadowRenderer.draw(ctx, [[pos,b],[pos,e]], {lineCap:'butt', lineWidth:this.gridLineWidth, offset:this.gridLineWidth*0.75, depth:2, fill:false, closePath:false});
|
||
}
|
||
drawLine(pos, b, pos, e);
|
||
}
|
||
break;
|
||
case 'y2axis':
|
||
// draw the grid line
|
||
if (t.showGridline && this.drawGridlines && ((!t.isMinorTick && axis.drawMajorGridlines) || (t.isMinorTick && axis.drawMinorGridlines)) ) {
|
||
drawLine(this._left, pos, this._right, pos);
|
||
}
|
||
// draw the mark
|
||
if (t.showMark && t.mark && ((!t.isMinorTick && axis.drawMajorTickMarks) || (t.isMinorTick && axis.drawMinorTickMarks)) ) {
|
||
s = t.markSize;
|
||
m = t.mark;
|
||
var pos = Math.round(axis.u2p(t.value)) + 0.5;
|
||
switch (m) {
|
||
case 'outside':
|
||
b = this._right;
|
||
e = this._right+s;
|
||
break;
|
||
case 'inside':
|
||
b = this._right-s;
|
||
e = this._right;
|
||
break;
|
||
case 'cross':
|
||
b = this._right-s;
|
||
e = this._right+s;
|
||
break;
|
||
default:
|
||
b = this._right;
|
||
e = this._right+s;
|
||
break;
|
||
}
|
||
// draw the shadow
|
||
if (this.shadow) {
|
||
this.renderer.shadowRenderer.draw(ctx, [[b, pos], [e, pos]], {lineCap:'butt', lineWidth:this.gridLineWidth*1.5, offset:this.gridLineWidth*0.75, fill:false, closePath:false});
|
||
}
|
||
drawLine(b, pos, e, pos, {strokeStyle:axis.borderColor});
|
||
}
|
||
break;
|
||
default:
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
t = null;
|
||
}
|
||
axis = null;
|
||
ticks = null;
|
||
}
|
||
// Now draw grid lines for additional y axes
|
||
//////
|
||
// TO DO: handle yMidAxis
|
||
//////
|
||
ax = ['y3axis', 'y4axis', 'y5axis', 'y6axis', 'y7axis', 'y8axis', 'y9axis', 'yMidAxis'];
|
||
for (var i=7; i>0; i--) {
|
||
var axis = axes[ax[i-1]];
|
||
var ticks = axis._ticks;
|
||
if (axis.show) {
|
||
var tn = ticks[axis.numberTicks-1];
|
||
var t0 = ticks[0];
|
||
var left = axis.getLeft();
|
||
var points = [[left, tn.getTop() + tn.getHeight()/2], [left, t0.getTop() + t0.getHeight()/2 + 1.0]];
|
||
// draw the shadow
|
||
if (this.shadow) {
|
||
this.renderer.shadowRenderer.draw(ctx, points, {lineCap:'butt', fill:false, closePath:false});
|
||
}
|
||
// draw the line
|
||
drawLine(points[0][0], points[0][1], points[1][0], points[1][1], {lineCap:'butt', strokeStyle:axis.borderColor, lineWidth:axis.borderWidth});
|
||
// draw the tick marks
|
||
for (var j=ticks.length; j>0; j--) {
|
||
var t = ticks[j-1];
|
||
s = t.markSize;
|
||
m = t.mark;
|
||
var pos = Math.round(axis.u2p(t.value)) + 0.5;
|
||
if (t.showMark && t.mark) {
|
||
switch (m) {
|
||
case 'outside':
|
||
b = left;
|
||
e = left+s;
|
||
break;
|
||
case 'inside':
|
||
b = left-s;
|
||
e = left;
|
||
break;
|
||
case 'cross':
|
||
b = left-s;
|
||
e = left+s;
|
||
break;
|
||
default:
|
||
b = left;
|
||
e = left+s;
|
||
break;
|
||
}
|
||
points = [[b,pos], [e,pos]];
|
||
// draw the shadow
|
||
if (this.shadow) {
|
||
this.renderer.shadowRenderer.draw(ctx, points, {lineCap:'butt', lineWidth:this.gridLineWidth*1.5, offset:this.gridLineWidth*0.75, fill:false, closePath:false});
|
||
}
|
||
// draw the line
|
||
drawLine(b, pos, e, pos, {strokeStyle:axis.borderColor});
|
||
}
|
||
t = null;
|
||
}
|
||
t0 = null;
|
||
}
|
||
axis = null;
|
||
ticks = null;
|
||
}
|
||
|
||
ctx.restore();
|
||
|
||
function drawLine(bx, by, ex, ey, opts) {
|
||
ctx.save();
|
||
opts = opts || {};
|
||
if (opts.lineWidth == null || opts.lineWidth != 0){
|
||
$.extend(true, ctx, opts);
|
||
ctx.beginPath();
|
||
ctx.moveTo(bx, by);
|
||
ctx.lineTo(ex, ey);
|
||
ctx.stroke();
|
||
ctx.restore();
|
||
}
|
||
}
|
||
|
||
if (this.shadow) {
|
||
var points = [[this._left, this._bottom], [this._right, this._bottom], [this._right, this._top]];
|
||
this.renderer.shadowRenderer.draw(ctx, points);
|
||
}
|
||
// Now draw border around grid. Use axis border definitions. start at
|
||
// upper left and go clockwise.
|
||
if (this.borderWidth != 0 && this.drawBorder) {
|
||
drawLine (this._left, this._top, this._right, this._top, {lineCap:'round', strokeStyle:axes.x2axis.borderColor, lineWidth:axes.x2axis.borderWidth});
|
||
drawLine (this._right, this._top, this._right, this._bottom, {lineCap:'round', strokeStyle:axes.y2axis.borderColor, lineWidth:axes.y2axis.borderWidth});
|
||
drawLine (this._right, this._bottom, this._left, this._bottom, {lineCap:'round', strokeStyle:axes.xaxis.borderColor, lineWidth:axes.xaxis.borderWidth});
|
||
drawLine (this._left, this._bottom, this._left, this._top, {lineCap:'round', strokeStyle:axes.yaxis.borderColor, lineWidth:axes.yaxis.borderWidth});
|
||
}
|
||
// ctx.lineWidth = this.borderWidth;
|
||
// ctx.strokeStyle = this.borderColor;
|
||
// ctx.strokeRect(this._left, this._top, this._width, this._height);
|
||
|
||
ctx.restore();
|
||
ctx = null;
|
||
axes = null;
|
||
};
|
||
|
||
// Class: $.jqplot.DivTitleRenderer
|
||
// The default title renderer for jqPlot. This class has no options beyond the <Title> class.
|
||
$.jqplot.DivTitleRenderer = function() {
|
||
};
|
||
|
||
$.jqplot.DivTitleRenderer.prototype.init = function(options) {
|
||
$.extend(true, this, options);
|
||
};
|
||
|
||
$.jqplot.DivTitleRenderer.prototype.draw = function() {
|
||
// Memory Leaks patch
|
||
if (this._elem) {
|
||
this._elem.emptyForce();
|
||
this._elem = null;
|
||
}
|
||
|
||
var r = this.renderer;
|
||
var elem = document.createElement('div');
|
||
this._elem = $(elem);
|
||
this._elem.addClass('jqplot-title');
|
||
|
||
if (!this.text) {
|
||
this.show = false;
|
||
this._elem.height(0);
|
||
this._elem.width(0);
|
||
}
|
||
else if (this.text) {
|
||
var color;
|
||
if (this.color) {
|
||
color = this.color;
|
||
}
|
||
else if (this.textColor) {
|
||
color = this.textColor;
|
||
}
|
||
|
||
// don't trust that a stylesheet is present, set the position.
|
||
var styles = {position:'absolute', top:'0px', left:'0px'};
|
||
|
||
if (this._plotWidth) {
|
||
styles['width'] = this._plotWidth+'px';
|
||
}
|
||
if (this.fontSize) {
|
||
styles['fontSize'] = this.fontSize;
|
||
}
|
||
if (typeof this.textAlign === 'string') {
|
||
styles['textAlign'] = this.textAlign;
|
||
}
|
||
else {
|
||
styles['textAlign'] = 'center';
|
||
}
|
||
if (color) {
|
||
styles['color'] = color;
|
||
}
|
||
if (this.paddingBottom) {
|
||
styles['paddingBottom'] = this.paddingBottom;
|
||
}
|
||
if (this.fontFamily) {
|
||
styles['fontFamily'] = this.fontFamily;
|
||
}
|
||
|
||
this._elem.css(styles);
|
||
if (this.escapeHtml) {
|
||
this._elem.text(this.text);
|
||
}
|
||
else {
|
||
this._elem.html(this.text);
|
||
}
|
||
|
||
|
||
// styletext += (this._plotWidth) ? 'width:'+this._plotWidth+'px;' : '';
|
||
// styletext += (this.fontSize) ? 'font-size:'+this.fontSize+';' : '';
|
||
// styletext += (this.textAlign) ? 'text-align:'+this.textAlign+';' : 'text-align:center;';
|
||
// styletext += (color) ? 'color:'+color+';' : '';
|
||
// styletext += (this.paddingBottom) ? 'padding-bottom:'+this.paddingBottom+';' : '';
|
||
// this._elem = $('<div class="jqplot-title" style="'+styletext+'">'+this.text+'</div>');
|
||
// if (this.fontFamily) {
|
||
// this._elem.css('font-family', this.fontFamily);
|
||
// }
|
||
}
|
||
|
||
elem = null;
|
||
|
||
return this._elem;
|
||
};
|
||
|
||
$.jqplot.DivTitleRenderer.prototype.pack = function() {
|
||
// nothing to do here
|
||
};
|
||
|
||
|
||
var dotlen = 0.1;
|
||
|
||
$.jqplot.LinePattern = function (ctx, pattern) {
|
||
|
||
var defaultLinePatterns = {
|
||
dotted: [ dotlen, $.jqplot.config.dotGapLength ],
|
||
dashed: [ $.jqplot.config.dashLength, $.jqplot.config.gapLength ],
|
||
solid: null
|
||
};
|
||
|
||
if (typeof pattern === 'string') {
|
||
if (pattern[0] === '.' || pattern[0] === '-') {
|
||
var s = pattern;
|
||
pattern = [];
|
||
for (var i=0, imax=s.length; i<imax; i++) {
|
||
if (s[i] === '.') {
|
||
pattern.push( dotlen );
|
||
}
|
||
else if (s[i] === '-') {
|
||
pattern.push( $.jqplot.config.dashLength );
|
||
}
|
||
else {
|
||
continue;
|
||
}
|
||
pattern.push( $.jqplot.config.gapLength );
|
||
}
|
||
}
|
||
else {
|
||
pattern = defaultLinePatterns[pattern];
|
||
}
|
||
}
|
||
|
||
if (!(pattern && pattern.length)) {
|
||
return ctx;
|
||
}
|
||
|
||
var patternIndex = 0;
|
||
var patternDistance = pattern[0];
|
||
var px = 0;
|
||
var py = 0;
|
||
var pathx0 = 0;
|
||
var pathy0 = 0;
|
||
|
||
var moveTo = function (x, y) {
|
||
ctx.moveTo( x, y );
|
||
px = x;
|
||
py = y;
|
||
pathx0 = x;
|
||
pathy0 = y;
|
||
};
|
||
|
||
var lineTo = function (x, y) {
|
||
var scale = ctx.lineWidth;
|
||
var dx = x - px;
|
||
var dy = y - py;
|
||
var dist = Math.sqrt(dx*dx+dy*dy);
|
||
if ((dist > 0) && (scale > 0)) {
|
||
dx /= dist;
|
||
dy /= dist;
|
||
while (true) {
|
||
var dp = scale * patternDistance;
|
||
if (dp < dist) {
|
||
px += dp * dx;
|
||
py += dp * dy;
|
||
if ((patternIndex & 1) == 0) {
|
||
ctx.lineTo( px, py );
|
||
}
|
||
else {
|
||
ctx.moveTo( px, py );
|
||
}
|
||
dist -= dp;
|
||
patternIndex++;
|
||
if (patternIndex >= pattern.length) {
|
||
patternIndex = 0;
|
||
}
|
||
patternDistance = pattern[patternIndex];
|
||
}
|
||
else {
|
||
px = x;
|
||
py = y;
|
||
if ((patternIndex & 1) == 0) {
|
||
ctx.lineTo( px, py );
|
||
}
|
||
else {
|
||
ctx.moveTo( px, py );
|
||
}
|
||
patternDistance -= dist / scale;
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
};
|
||
|
||
var beginPath = function () {
|
||
ctx.beginPath();
|
||
};
|
||
|
||
var closePath = function () {
|
||
lineTo( pathx0, pathy0 );
|
||
};
|
||
|
||
return {
|
||
moveTo: moveTo,
|
||
lineTo: lineTo,
|
||
beginPath: beginPath,
|
||
closePath: closePath
|
||
};
|
||
};
|
||
|
||
// Class: $.jqplot.LineRenderer
|
||
// The default line renderer for jqPlot, this class has no options beyond the <Series> class.
|
||
// Draws series as a line.
|
||
$.jqplot.LineRenderer = function(){
|
||
this.shapeRenderer = new $.jqplot.ShapeRenderer();
|
||
this.shadowRenderer = new $.jqplot.ShadowRenderer();
|
||
};
|
||
|
||
// called with scope of series.
|
||
$.jqplot.LineRenderer.prototype.init = function(options, plot) {
|
||
// Group: Properties
|
||
//
|
||
options = options || {};
|
||
this._type='line';
|
||
// prop: smooth
|
||
// True to draw a smoothed (interpolated) line through the data points
|
||
// with automatically computed number of smoothing points.
|
||
// Set to an integer number > 2 to specify number of smoothing points
|
||
// to use between each data point.
|
||
this.renderer.smooth = false; // true or a number > 2 for smoothing.
|
||
this.renderer.tension = null; // null to auto compute or a number typically > 6. Fewer points requires higher tension.
|
||
// prop: constrainSmoothing
|
||
// True to use a more accurate smoothing algorithm that will
|
||
// not overshoot any data points. False to allow overshoot but
|
||
// produce a smoother looking line.
|
||
this.renderer.constrainSmoothing = true;
|
||
// this is smoothed data in grid coordinates, like gridData
|
||
this.renderer._smoothedData = [];
|
||
// this is smoothed data in plot units (plot coordinates), like plotData.
|
||
this.renderer._smoothedPlotData = [];
|
||
this.renderer._hiBandGridData = [];
|
||
this.renderer._lowBandGridData = [];
|
||
this.renderer._hiBandSmoothedData = [];
|
||
this.renderer._lowBandSmoothedData = [];
|
||
|
||
// prop: bandData
|
||
// Data used to draw error bands or confidence intervals above/below a line.
|
||
//
|
||
// bandData can be input in 3 forms. jqPlot will figure out which is the
|
||
// low band line and which is the high band line for all forms:
|
||
//
|
||
// A 2 dimensional array like [[yl1, yl2, ...], [yu1, yu2, ...]] where
|
||
// [yl1, yl2, ...] are y values of the lower line and
|
||
// [yu1, yu2, ...] are y values of the upper line.
|
||
// In this case there must be the same number of y data points as data points
|
||
// in the series and the bands will inherit the x values of the series.
|
||
//
|
||
// A 2 dimensional array like [[[xl1, yl1], [xl2, yl2], ...], [[xh1, yh1], [xh2, yh2], ...]]
|
||
// where [xl1, yl1] are x,y data points for the lower line and
|
||
// [xh1, yh1] are x,y data points for the high line.
|
||
// x values do not have to correspond to the x values of the series and can
|
||
// be of any arbitrary length.
|
||
//
|
||
// Can be of form [[yl1, yu1], [yl2, yu2], [yl3, yu3], ...] where
|
||
// there must be 3 or more arrays and there must be the same number of arrays
|
||
// as there are data points in the series. In this case,
|
||
// [yl1, yu1] specifies the lower and upper y values for the 1st
|
||
// data point and so on. The bands will inherit the x
|
||
// values from the series.
|
||
this.renderer.bandData = [];
|
||
|
||
// Group: bands
|
||
// Banding around line, e.g error bands or confidence intervals.
|
||
this.renderer.bands = {
|
||
// prop: show
|
||
// true to show the bands. If bandData or interval is
|
||
// supplied, show will be set to true by default.
|
||
show: false,
|
||
hiData: [],
|
||
lowData: [],
|
||
// prop: color
|
||
// color of lines at top and bottom of bands [default: series color].
|
||
color: this.color,
|
||
// prop: showLines
|
||
// True to show lines at top and bottom of bands [default: false].
|
||
showLines: false,
|
||
// prop: fill
|
||
// True to fill area between bands [default: true].
|
||
fill: true,
|
||
// prop: fillColor
|
||
// css color spec for filled area. [default: series color].
|
||
fillColor: null,
|
||
_min: null,
|
||
_max: null,
|
||
// prop: interval
|
||
// User specified interval above and below line for bands [default: '3%''].
|
||
// Can be a value like 3 or a string like '3%'
|
||
// or an upper/lower array like [1, -2] or ['2%', '-1.5%']
|
||
interval: '3%'
|
||
};
|
||
|
||
|
||
var lopts = {highlightMouseOver: options.highlightMouseOver, highlightMouseDown: options.highlightMouseDown, highlightColor: options.highlightColor};
|
||
|
||
delete (options.highlightMouseOver);
|
||
delete (options.highlightMouseDown);
|
||
delete (options.highlightColor);
|
||
|
||
$.extend(true, this.renderer, options);
|
||
|
||
this.renderer.options = options;
|
||
|
||
// if we are given some band data, and bands aren't explicity set to false in options, turn them on.
|
||
if (this.renderer.bandData.length > 1 && (!options.bands || options.bands.show == null)) {
|
||
this.renderer.bands.show = true;
|
||
}
|
||
|
||
// if we are given an interval, and bands aren't explicity set to false in options, turn them on.
|
||
else if (options.bands && options.bands.show == null && options.bands.interval != null) {
|
||
this.renderer.bands.show = true;
|
||
}
|
||
|
||
// if plot is filled, turn off bands.
|
||
if (this.fill) {
|
||
this.renderer.bands.show = false;
|
||
}
|
||
|
||
if (this.renderer.bands.show) {
|
||
this.renderer.initBands.call(this, this.renderer.options, plot);
|
||
}
|
||
|
||
|
||
// smoothing is not compatible with stacked lines, disable
|
||
if (this._stack) {
|
||
this.renderer.smooth = false;
|
||
}
|
||
|
||
// set the shape renderer options
|
||
var opts = {lineJoin:this.lineJoin, lineCap:this.lineCap, fill:this.fill, isarc:false, strokeStyle:this.color, fillStyle:this.fillColor, lineWidth:this.lineWidth, linePattern:this.linePattern, closePath:this.fill};
|
||
this.renderer.shapeRenderer.init(opts);
|
||
|
||
var shadow_offset = options.shadowOffset;
|
||
// set the shadow renderer options
|
||
if (shadow_offset == null) {
|
||
// scale the shadowOffset to the width of the line.
|
||
if (this.lineWidth > 2.5) {
|
||
shadow_offset = 1.25 * (1 + (Math.atan((this.lineWidth/2.5))/0.785398163 - 1)*0.6);
|
||
// var shadow_offset = this.shadowOffset;
|
||
}
|
||
// for skinny lines, don't make such a big shadow.
|
||
else {
|
||
shadow_offset = 1.25 * Math.atan((this.lineWidth/2.5))/0.785398163;
|
||
}
|
||
}
|
||
|
||
var sopts = {lineJoin:this.lineJoin, lineCap:this.lineCap, fill:this.fill, isarc:false, angle:this.shadowAngle, offset:shadow_offset, alpha:this.shadowAlpha, depth:this.shadowDepth, lineWidth:this.lineWidth, linePattern:this.linePattern, closePath:this.fill};
|
||
this.renderer.shadowRenderer.init(sopts);
|
||
this._areaPoints = [];
|
||
this._boundingBox = [[],[]];
|
||
|
||
if (!this.isTrendline && this.fill || this.renderer.bands.show) {
|
||
// Group: Properties
|
||
//
|
||
// prop: highlightMouseOver
|
||
// True to highlight area on a filled plot when moused over.
|
||
// This must be false to enable highlightMouseDown to highlight when clicking on an area on a filled plot.
|
||
this.highlightMouseOver = true;
|
||
// prop: highlightMouseDown
|
||
// True to highlight when a mouse button is pressed over an area on a filled plot.
|
||
// This will be disabled if highlightMouseOver is true.
|
||
this.highlightMouseDown = false;
|
||
// prop: highlightColor
|
||
// color to use when highlighting an area on a filled plot.
|
||
this.highlightColor = null;
|
||
// if user has passed in highlightMouseDown option and not set highlightMouseOver, disable highlightMouseOver
|
||
if (lopts.highlightMouseDown && lopts.highlightMouseOver == null) {
|
||
lopts.highlightMouseOver = false;
|
||
}
|
||
|
||
$.extend(true, this, {highlightMouseOver: lopts.highlightMouseOver, highlightMouseDown: lopts.highlightMouseDown, highlightColor: lopts.highlightColor});
|
||
|
||
if (!this.highlightColor) {
|
||
var fc = (this.renderer.bands.show) ? this.renderer.bands.fillColor : this.fillColor;
|
||
this.highlightColor = $.jqplot.computeHighlightColors(fc);
|
||
}
|
||
// turn off (disable) the highlighter plugin
|
||
if (this.highlighter) {
|
||
this.highlighter.show = false;
|
||
}
|
||
}
|
||
|
||
if (!this.isTrendline && plot) {
|
||
plot.plugins.lineRenderer = {};
|
||
plot.postInitHooks.addOnce(postInit);
|
||
plot.postDrawHooks.addOnce(postPlotDraw);
|
||
plot.eventListenerHooks.addOnce('jqplotMouseMove', handleMove);
|
||
plot.eventListenerHooks.addOnce('jqplotMouseDown', handleMouseDown);
|
||
plot.eventListenerHooks.addOnce('jqplotMouseUp', handleMouseUp);
|
||
plot.eventListenerHooks.addOnce('jqplotClick', handleClick);
|
||
plot.eventListenerHooks.addOnce('jqplotRightClick', handleRightClick);
|
||
}
|
||
|
||
};
|
||
|
||
$.jqplot.LineRenderer.prototype.initBands = function(options, plot) {
|
||
// use bandData if no data specified in bands option
|
||
//var bd = this.renderer.bandData;
|
||
var bd = options.bandData || [];
|
||
var bands = this.renderer.bands;
|
||
bands.hiData = [];
|
||
bands.lowData = [];
|
||
var data = this.data;
|
||
bands._max = null;
|
||
bands._min = null;
|
||
// If 2 arrays, and each array greater than 2 elements, assume it is hi and low data bands of y values.
|
||
if (bd.length == 2) {
|
||
// Do we have an array of x,y values?
|
||
// like [[[1,1], [2,4], [3,3]], [[1,3], [2,6], [3,5]]]
|
||
if ($.isArray(bd[0][0])) {
|
||
// since an arbitrary array of points, spin through all of them to determine max and min lines.
|
||
|
||
var p;
|
||
var bdminidx = 0, bdmaxidx = 0;
|
||
for (var i = 0, l = bd[0].length; i<l; i++) {
|
||
p = bd[0][i];
|
||
if ((p[1] != null && p[1] > bands._max) || bands._max == null) {
|
||
bands._max = p[1];
|
||
}
|
||
if ((p[1] != null && p[1] < bands._min) || bands._min == null) {
|
||
bands._min = p[1];
|
||
}
|
||
}
|
||
for (var i = 0, l = bd[1].length; i<l; i++) {
|
||
p = bd[1][i];
|
||
if ((p[1] != null && p[1] > bands._max) || bands._max == null) {
|
||
bands._max = p[1];
|
||
bdmaxidx = 1;
|
||
}
|
||
if ((p[1] != null && p[1] < bands._min) || bands._min == null) {
|
||
bands._min = p[1];
|
||
bdminidx = 1;
|
||
}
|
||
}
|
||
|
||
if (bdmaxidx === bdminidx) {
|
||
bands.show = false;
|
||
}
|
||
|
||
bands.hiData = bd[bdmaxidx];
|
||
bands.lowData = bd[bdminidx];
|
||
}
|
||
// else data is arrays of y values
|
||
// like [[1,4,3], [3,6,5]]
|
||
// must have same number of band data points as points in series
|
||
else if (bd[0].length === data.length && bd[1].length === data.length) {
|
||
var hi = (bd[0][0] > bd[1][0]) ? 0 : 1;
|
||
var low = (hi) ? 0 : 1;
|
||
for (var i=0, l=data.length; i < l; i++) {
|
||
bands.hiData.push([data[i][0], bd[hi][i]]);
|
||
bands.lowData.push([data[i][0], bd[low][i]]);
|
||
}
|
||
}
|
||
|
||
// we don't have proper data array, don't show bands.
|
||
else {
|
||
bands.show = false;
|
||
}
|
||
}
|
||
|
||
// if more than 2 arrays, have arrays of [ylow, yhi] values.
|
||
// note, can't distinguish case of [[ylow, yhi], [ylow, yhi]] from [[ylow, ylow], [yhi, yhi]]
|
||
// this is assumed to be of the latter form.
|
||
else if (bd.length > 2 && !$.isArray(bd[0][0])) {
|
||
var hi = (bd[0][0] > bd[0][1]) ? 0 : 1;
|
||
var low = (hi) ? 0 : 1;
|
||
for (var i=0, l=bd.length; i<l; i++) {
|
||
bands.hiData.push([data[i][0], bd[i][hi]]);
|
||
bands.lowData.push([data[i][0], bd[i][low]]);
|
||
}
|
||
}
|
||
|
||
// don't have proper data, auto calculate
|
||
else {
|
||
var intrv = bands.interval;
|
||
var a = null;
|
||
var b = null;
|
||
var afunc = null;
|
||
var bfunc = null;
|
||
|
||
if ($.isArray(intrv)) {
|
||
a = intrv[0];
|
||
b = intrv[1];
|
||
}
|
||
else {
|
||
a = intrv;
|
||
}
|
||
|
||
if (isNaN(a)) {
|
||
// we have a string
|
||
if (a.charAt(a.length - 1) === '%') {
|
||
afunc = 'multiply';
|
||
a = parseFloat(a)/100 + 1;
|
||
}
|
||
}
|
||
|
||
else {
|
||
a = parseFloat(a);
|
||
afunc = 'add';
|
||
}
|
||
|
||
if (b !== null && isNaN(b)) {
|
||
// we have a string
|
||
if (b.charAt(b.length - 1) === '%') {
|
||
bfunc = 'multiply';
|
||
b = parseFloat(b)/100 + 1;
|
||
}
|
||
}
|
||
|
||
else if (b !== null) {
|
||
b = parseFloat(b);
|
||
bfunc = 'add';
|
||
}
|
||
|
||
if (a !== null) {
|
||
if (b === null) {
|
||
b = -a;
|
||
bfunc = afunc;
|
||
if (bfunc === 'multiply') {
|
||
b += 2;
|
||
}
|
||
}
|
||
|
||
// make sure a always applies to hi band.
|
||
if (a < b) {
|
||
var temp = a;
|
||
a = b;
|
||
b = temp;
|
||
temp = afunc;
|
||
afunc = bfunc;
|
||
bfunc = temp;
|
||
}
|
||
|
||
for (var i=0, l = data.length; i < l; i++) {
|
||
switch (afunc) {
|
||
case 'add':
|
||
bands.hiData.push([data[i][0], data[i][1] + a]);
|
||
break;
|
||
case 'multiply':
|
||
bands.hiData.push([data[i][0], data[i][1] * a]);
|
||
break;
|
||
}
|
||
switch (bfunc) {
|
||
case 'add':
|
||
bands.lowData.push([data[i][0], data[i][1] + b]);
|
||
break;
|
||
case 'multiply':
|
||
bands.lowData.push([data[i][0], data[i][1] * b]);
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
|
||
else {
|
||
bands.show = false;
|
||
}
|
||
}
|
||
|
||
var hd = bands.hiData;
|
||
var ld = bands.lowData;
|
||
for (var i = 0, l = hd.length; i<l; i++) {
|
||
if ((hd[i][1] != null && hd[i][1] > bands._max) || bands._max == null) {
|
||
bands._max = hd[i][1];
|
||
}
|
||
}
|
||
for (var i = 0, l = ld.length; i<l; i++) {
|
||
if ((ld[i][1] != null && ld[i][1] < bands._min) || bands._min == null) {
|
||
bands._min = ld[i][1];
|
||
}
|
||
}
|
||
|
||
// one last check for proper data
|
||
// these don't apply any more since allowing arbitrary x,y values
|
||
// if (bands.hiData.length != bands.lowData.length) {
|
||
// bands.show = false;
|
||
// }
|
||
|
||
// if (bands.hiData.length != this.data.length) {
|
||
// bands.show = false;
|
||
// }
|
||
|
||
if (bands.fillColor === null) {
|
||
var c = $.jqplot.getColorComponents(bands.color);
|
||
// now adjust alpha to differentiate fill
|
||
c[3] = c[3] * 0.5;
|
||
bands.fillColor = 'rgba(' + c[0] +', '+ c[1] +', '+ c[2] +', '+ c[3] + ')';
|
||
}
|
||
};
|
||
|
||
function getSteps (d, f) {
|
||
return (3.4182054+f) * Math.pow(d, -0.3534992);
|
||
}
|
||
|
||
function computeSteps (d1, d2) {
|
||
var s = Math.sqrt(Math.pow((d2[0]- d1[0]), 2) + Math.pow ((d2[1] - d1[1]), 2));
|
||
return 5.7648 * Math.log(s) + 7.4456;
|
||
}
|
||
|
||
function tanh (x) {
|
||
var a = (Math.exp(2*x) - 1) / (Math.exp(2*x) + 1);
|
||
return a;
|
||
}
|
||
|
||
//////////
|
||
// computeConstrainedSmoothedData
|
||
// An implementation of the constrained cubic spline interpolation
|
||
// method as presented in:
|
||
//
|
||
// Kruger, CJC, Constrained Cubic Spine Interpolation for Chemical Engineering Applications
|
||
// http://www.korf.co.uk/spline.pdf
|
||
//
|
||
// The implementation below borrows heavily from the sample Visual Basic
|
||
// implementation by CJC Kruger found in http://www.korf.co.uk/spline.xls
|
||
//
|
||
/////////
|
||
|
||
// called with scope of series
|
||
function computeConstrainedSmoothedData (gd) {
|
||
var smooth = this.renderer.smooth;
|
||
var dim = this.canvas.getWidth();
|
||
var xp = this._xaxis.series_p2u;
|
||
var yp = this._yaxis.series_p2u;
|
||
var steps =null;
|
||
var _steps = null;
|
||
var dist = gd.length/dim;
|
||
var _smoothedData = [];
|
||
var _smoothedPlotData = [];
|
||
|
||
if (!isNaN(parseFloat(smooth))) {
|
||
steps = parseFloat(smooth);
|
||
}
|
||
else {
|
||
steps = getSteps(dist, 0.5);
|
||
}
|
||
|
||
var yy = [];
|
||
var xx = [];
|
||
|
||
for (var i=0, l = gd.length; i<l; i++) {
|
||
yy.push(gd[i][1]);
|
||
xx.push(gd[i][0]);
|
||
}
|
||
|
||
function dxx(x1, x0) {
|
||
if (x1 - x0 == 0) {
|
||
return Math.pow(10,10);
|
||
}
|
||
else {
|
||
return x1 - x0;
|
||
}
|
||
}
|
||
|
||
var A, B, C, D;
|
||
// loop through each line segment. Have # points - 1 line segments. Nmber segments starting at 1.
|
||
var nmax = gd.length - 1;
|
||
for (var num = 1, gdl = gd.length; num<gdl; num++) {
|
||
var gxx = [];
|
||
var ggxx = [];
|
||
// point at each end of segment.
|
||
for (var j = 0; j < 2; j++) {
|
||
var i = num - 1 + j; // point number, 0 to # points.
|
||
|
||
if (i == 0 || i == nmax) {
|
||
gxx[j] = Math.pow(10, 10);
|
||
}
|
||
else if (yy[i+1] - yy[i] == 0 || yy[i] - yy[i-1] == 0) {
|
||
gxx[j] = 0;
|
||
}
|
||
else if (((xx[i+1] - xx[i]) / (yy[i+1] - yy[i]) + (xx[i] - xx[i-1]) / (yy[i] - yy[i-1])) == 0 ) {
|
||
gxx[j] = 0;
|
||
}
|
||
else if ( (yy[i+1] - yy[i]) * (yy[i] - yy[i-1]) < 0 ) {
|
||
gxx[j] = 0;
|
||
}
|
||
|
||
else {
|
||
gxx[j] = 2 / (dxx(xx[i + 1], xx[i]) / (yy[i + 1] - yy[i]) + dxx(xx[i], xx[i - 1]) / (yy[i] - yy[i - 1]));
|
||
}
|
||
}
|
||
|
||
// Reset first derivative (slope) at first and last point
|
||
if (num == 1) {
|
||
// First point has 0 2nd derivative
|
||
gxx[0] = 3 / 2 * (yy[1] - yy[0]) / dxx(xx[1], xx[0]) - gxx[1] / 2;
|
||
}
|
||
else if (num == nmax) {
|
||
// Last point has 0 2nd derivative
|
||
gxx[1] = 3 / 2 * (yy[nmax] - yy[nmax - 1]) / dxx(xx[nmax], xx[nmax - 1]) - gxx[0] / 2;
|
||
}
|
||
|
||
// Calc second derivative at points
|
||
ggxx[0] = -2 * (gxx[1] + 2 * gxx[0]) / dxx(xx[num], xx[num - 1]) + 6 * (yy[num] - yy[num - 1]) / Math.pow(dxx(xx[num], xx[num - 1]), 2);
|
||
ggxx[1] = 2 * (2 * gxx[1] + gxx[0]) / dxx(xx[num], xx[num - 1]) - 6 * (yy[num] - yy[num - 1]) / Math.pow(dxx(xx[num], xx[num - 1]), 2);
|
||
|
||
// Calc constants for cubic interpolation
|
||
D = 1 / 6 * (ggxx[1] - ggxx[0]) / dxx(xx[num], xx[num - 1]);
|
||
C = 1 / 2 * (xx[num] * ggxx[0] - xx[num - 1] * ggxx[1]) / dxx(xx[num], xx[num - 1]);
|
||
B = (yy[num] - yy[num - 1] - C * (Math.pow(xx[num], 2) - Math.pow(xx[num - 1], 2)) - D * (Math.pow(xx[num], 3) - Math.pow(xx[num - 1], 3))) / dxx(xx[num], xx[num - 1]);
|
||
A = yy[num - 1] - B * xx[num - 1] - C * Math.pow(xx[num - 1], 2) - D * Math.pow(xx[num - 1], 3);
|
||
|
||
var increment = (xx[num] - xx[num - 1]) / steps;
|
||
var temp, tempx;
|
||
|
||
for (var j = 0, l = steps; j < l; j++) {
|
||
temp = [];
|
||
tempx = xx[num - 1] + j * increment;
|
||
temp.push(tempx);
|
||
temp.push(A + B * tempx + C * Math.pow(tempx, 2) + D * Math.pow(tempx, 3));
|
||
_smoothedData.push(temp);
|
||
_smoothedPlotData.push([xp(temp[0]), yp(temp[1])]);
|
||
}
|
||
}
|
||
|
||
_smoothedData.push(gd[i]);
|
||
_smoothedPlotData.push([xp(gd[i][0]), yp(gd[i][1])]);
|
||
|
||
return [_smoothedData, _smoothedPlotData];
|
||
}
|
||
|
||
///////
|
||
// computeHermiteSmoothedData
|
||
// A hermite spline smoothing of the plot data.
|
||
// This implementation is derived from the one posted
|
||
// by krypin on the jqplot-users mailing list:
|
||
//
|
||
// http://groups.google.com/group/jqplot-users/browse_thread/thread/748be6a445723cea?pli=1
|
||
//
|
||
// with a blog post:
|
||
//
|
||
// http://blog.statscollector.com/a-plugin-renderer-for-jqplot-to-draw-a-hermite-spline/
|
||
//
|
||
// and download of the original plugin:
|
||
//
|
||
// http://blog.statscollector.com/wp-content/uploads/2010/02/jqplot.hermiteSplineRenderer.js
|
||
//////////
|
||
|
||
// called with scope of series
|
||
function computeHermiteSmoothedData (gd) {
|
||
var smooth = this.renderer.smooth;
|
||
var tension = this.renderer.tension;
|
||
var dim = this.canvas.getWidth();
|
||
var xp = this._xaxis.series_p2u;
|
||
var yp = this._yaxis.series_p2u;
|
||
var steps =null;
|
||
var _steps = null;
|
||
var a = null;
|
||
var a1 = null;
|
||
var a2 = null;
|
||
var slope = null;
|
||
var slope2 = null;
|
||
var temp = null;
|
||
var t, s, h1, h2, h3, h4;
|
||
var TiX, TiY, Ti1X, Ti1Y;
|
||
var pX, pY, p;
|
||
var sd = [];
|
||
var spd = [];
|
||
var dist = gd.length/dim;
|
||
var min, max, stretch, scale, shift;
|
||
var _smoothedData = [];
|
||
var _smoothedPlotData = [];
|
||
if (!isNaN(parseFloat(smooth))) {
|
||
steps = parseFloat(smooth);
|
||
}
|
||
else {
|
||
steps = getSteps(dist, 0.5);
|
||
}
|
||
if (!isNaN(parseFloat(tension))) {
|
||
tension = parseFloat(tension);
|
||
}
|
||
|
||
for (var i=0, l = gd.length-1; i < l; i++) {
|
||
|
||
if (tension === null) {
|
||
slope = Math.abs((gd[i+1][1] - gd[i][1]) / (gd[i+1][0] - gd[i][0]));
|
||
|
||
min = 0.3;
|
||
max = 0.6;
|
||
stretch = (max - min)/2.0;
|
||
scale = 2.5;
|
||
shift = -1.4;
|
||
|
||
temp = slope/scale + shift;
|
||
|
||
a1 = stretch * tanh(temp) - stretch * tanh(shift) + min;
|
||
|
||
// if have both left and right line segments, will use minimum tension.
|
||
if (i > 0) {
|
||
slope2 = Math.abs((gd[i][1] - gd[i-1][1]) / (gd[i][0] - gd[i-1][0]));
|
||
}
|
||
temp = slope2/scale + shift;
|
||
|
||
a2 = stretch * tanh(temp) - stretch * tanh(shift) + min;
|
||
|
||
a = (a1 + a2)/2.0;
|
||
|
||
}
|
||
else {
|
||
a = tension;
|
||
}
|
||
for (t=0; t < steps; t++) {
|
||
s = t / steps;
|
||
h1 = (1 + 2*s)*Math.pow((1-s),2);
|
||
h2 = s*Math.pow((1-s),2);
|
||
h3 = Math.pow(s,2)*(3-2*s);
|
||
h4 = Math.pow(s,2)*(s-1);
|
||
|
||
if (gd[i-1]) {
|
||
TiX = a * (gd[i+1][0] - gd[i-1][0]);
|
||
TiY = a * (gd[i+1][1] - gd[i-1][1]);
|
||
} else {
|
||
TiX = a * (gd[i+1][0] - gd[i][0]);
|
||
TiY = a * (gd[i+1][1] - gd[i][1]);
|
||
}
|
||
if (gd[i+2]) {
|
||
Ti1X = a * (gd[i+2][0] - gd[i][0]);
|
||
Ti1Y = a * (gd[i+2][1] - gd[i][1]);
|
||
} else {
|
||
Ti1X = a * (gd[i+1][0] - gd[i][0]);
|
||
Ti1Y = a * (gd[i+1][1] - gd[i][1]);
|
||
}
|
||
|
||
pX = h1*gd[i][0] + h3*gd[i+1][0] + h2*TiX + h4*Ti1X;
|
||
pY = h1*gd[i][1] + h3*gd[i+1][1] + h2*TiY + h4*Ti1Y;
|
||
p = [pX, pY];
|
||
|
||
_smoothedData.push(p);
|
||
_smoothedPlotData.push([xp(pX), yp(pY)]);
|
||
}
|
||
}
|
||
_smoothedData.push(gd[l]);
|
||
_smoothedPlotData.push([xp(gd[l][0]), yp(gd[l][1])]);
|
||
|
||
return [_smoothedData, _smoothedPlotData];
|
||
}
|
||
|
||
// setGridData
|
||
// converts the user data values to grid coordinates and stores them
|
||
// in the gridData array.
|
||
// Called with scope of a series.
|
||
$.jqplot.LineRenderer.prototype.setGridData = function(plot) {
|
||
// recalculate the grid data
|
||
var xp = this._xaxis.series_u2p;
|
||
var yp = this._yaxis.series_u2p;
|
||
var data = this._plotData;
|
||
var pdata = this._prevPlotData;
|
||
this.gridData = [];
|
||
this._prevGridData = [];
|
||
this.renderer._smoothedData = [];
|
||
this.renderer._smoothedPlotData = [];
|
||
this.renderer._hiBandGridData = [];
|
||
this.renderer._lowBandGridData = [];
|
||
this.renderer._hiBandSmoothedData = [];
|
||
this.renderer._lowBandSmoothedData = [];
|
||
var bands = this.renderer.bands;
|
||
var hasNull = false;
|
||
for (var i=0, l=this.data.length; i < l; i++) {
|
||
// if not a line series or if no nulls in data, push the converted point onto the array.
|
||
if (data[i][0] != null && data[i][1] != null) {
|
||
this.gridData.push([xp.call(this._xaxis, data[i][0]), yp.call(this._yaxis, data[i][1])]);
|
||
}
|
||
// else if there is a null, preserve it.
|
||
else if (data[i][0] == null) {
|
||
hasNull = true;
|
||
this.gridData.push([null, yp.call(this._yaxis, data[i][1])]);
|
||
}
|
||
else if (data[i][1] == null) {
|
||
hasNull = true;
|
||
this.gridData.push([xp.call(this._xaxis, data[i][0]), null]);
|
||
}
|
||
// if not a line series or if no nulls in data, push the converted point onto the array.
|
||
if (pdata[i] != null && pdata[i][0] != null && pdata[i][1] != null) {
|
||
this._prevGridData.push([xp.call(this._xaxis, pdata[i][0]), yp.call(this._yaxis, pdata[i][1])]);
|
||
}
|
||
// else if there is a null, preserve it.
|
||
else if (pdata[i] != null && pdata[i][0] == null) {
|
||
this._prevGridData.push([null, yp.call(this._yaxis, pdata[i][1])]);
|
||
}
|
||
else if (pdata[i] != null && pdata[i][0] != null && pdata[i][1] == null) {
|
||
this._prevGridData.push([xp.call(this._xaxis, pdata[i][0]), null]);
|
||
}
|
||
}
|
||
|
||
// don't do smoothing or bands on broken lines.
|
||
if (hasNull) {
|
||
this.renderer.smooth = false;
|
||
if (this._type === 'line') {
|
||
bands.show = false;
|
||
}
|
||
}
|
||
|
||
if (this._type === 'line' && bands.show) {
|
||
for (var i=0, l=bands.hiData.length; i<l; i++) {
|
||
this.renderer._hiBandGridData.push([xp.call(this._xaxis, bands.hiData[i][0]), yp.call(this._yaxis, bands.hiData[i][1])]);
|
||
}
|
||
for (var i=0, l=bands.lowData.length; i<l; i++) {
|
||
this.renderer._lowBandGridData.push([xp.call(this._xaxis, bands.lowData[i][0]), yp.call(this._yaxis, bands.lowData[i][1])]);
|
||
}
|
||
}
|
||
|
||
// calculate smoothed data if enough points and no nulls
|
||
if (this._type === 'line' && this.renderer.smooth && this.gridData.length > 2) {
|
||
var ret;
|
||
if (this.renderer.constrainSmoothing) {
|
||
ret = computeConstrainedSmoothedData.call(this, this.gridData);
|
||
this.renderer._smoothedData = ret[0];
|
||
this.renderer._smoothedPlotData = ret[1];
|
||
|
||
if (bands.show) {
|
||
ret = computeConstrainedSmoothedData.call(this, this.renderer._hiBandGridData);
|
||
this.renderer._hiBandSmoothedData = ret[0];
|
||
ret = computeConstrainedSmoothedData.call(this, this.renderer._lowBandGridData);
|
||
this.renderer._lowBandSmoothedData = ret[0];
|
||
}
|
||
|
||
ret = null;
|
||
}
|
||
else {
|
||
ret = computeHermiteSmoothedData.call(this, this.gridData);
|
||
this.renderer._smoothedData = ret[0];
|
||
this.renderer._smoothedPlotData = ret[1];
|
||
|
||
if (bands.show) {
|
||
ret = computeHermiteSmoothedData.call(this, this.renderer._hiBandGridData);
|
||
this.renderer._hiBandSmoothedData = ret[0];
|
||
ret = computeHermiteSmoothedData.call(this, this.renderer._lowBandGridData);
|
||
this.renderer._lowBandSmoothedData = ret[0];
|
||
}
|
||
|
||
ret = null;
|
||
}
|
||
}
|
||
};
|
||
|
||
// makeGridData
|
||
// converts any arbitrary data values to grid coordinates and
|
||
// returns them. This method exists so that plugins can use a series'
|
||
// linerenderer to generate grid data points without overwriting the
|
||
// grid data associated with that series.
|
||
// Called with scope of a series.
|
||
$.jqplot.LineRenderer.prototype.makeGridData = function(data, plot) {
|
||
// recalculate the grid data
|
||
var xp = this._xaxis.series_u2p;
|
||
var yp = this._yaxis.series_u2p;
|
||
var gd = [];
|
||
var pgd = [];
|
||
this.renderer._smoothedData = [];
|
||
this.renderer._smoothedPlotData = [];
|
||
this.renderer._hiBandGridData = [];
|
||
this.renderer._lowBandGridData = [];
|
||
this.renderer._hiBandSmoothedData = [];
|
||
this.renderer._lowBandSmoothedData = [];
|
||
var bands = this.renderer.bands;
|
||
var hasNull = false;
|
||
for (var i=0; i<data.length; i++) {
|
||
// if not a line series or if no nulls in data, push the converted point onto the array.
|
||
if (data[i][0] != null && data[i][1] != null) {
|
||
gd.push([xp.call(this._xaxis, data[i][0]), yp.call(this._yaxis, data[i][1])]);
|
||
}
|
||
// else if there is a null, preserve it.
|
||
else if (data[i][0] == null) {
|
||
hasNull = true;
|
||
gd.push([null, yp.call(this._yaxis, data[i][1])]);
|
||
}
|
||
else if (data[i][1] == null) {
|
||
hasNull = true;
|
||
gd.push([xp.call(this._xaxis, data[i][0]), null]);
|
||
}
|
||
}
|
||
|
||
// don't do smoothing or bands on broken lines.
|
||
if (hasNull) {
|
||
this.renderer.smooth = false;
|
||
if (this._type === 'line') {
|
||
bands.show = false;
|
||
}
|
||
}
|
||
|
||
if (this._type === 'line' && bands.show) {
|
||
for (var i=0, l=bands.hiData.length; i<l; i++) {
|
||
this.renderer._hiBandGridData.push([xp.call(this._xaxis, bands.hiData[i][0]), yp.call(this._yaxis, bands.hiData[i][1])]);
|
||
}
|
||
for (var i=0, l=bands.lowData.length; i<l; i++) {
|
||
this.renderer._lowBandGridData.push([xp.call(this._xaxis, bands.lowData[i][0]), yp.call(this._yaxis, bands.lowData[i][1])]);
|
||
}
|
||
}
|
||
|
||
if (this._type === 'line' && this.renderer.smooth && gd.length > 2) {
|
||
var ret;
|
||
if (this.renderer.constrainSmoothing) {
|
||
ret = computeConstrainedSmoothedData.call(this, gd);
|
||
this.renderer._smoothedData = ret[0];
|
||
this.renderer._smoothedPlotData = ret[1];
|
||
|
||
if (bands.show) {
|
||
ret = computeConstrainedSmoothedData.call(this, this.renderer._hiBandGridData);
|
||
this.renderer._hiBandSmoothedData = ret[0];
|
||
ret = computeConstrainedSmoothedData.call(this, this.renderer._lowBandGridData);
|
||
this.renderer._lowBandSmoothedData = ret[0];
|
||
}
|
||
|
||
ret = null;
|
||
}
|
||
else {
|
||
ret = computeHermiteSmoothedData.call(this, gd);
|
||
this.renderer._smoothedData = ret[0];
|
||
this.renderer._smoothedPlotData = ret[1];
|
||
|
||
if (bands.show) {
|
||
ret = computeHermiteSmoothedData.call(this, this.renderer._hiBandGridData);
|
||
this.renderer._hiBandSmoothedData = ret[0];
|
||
ret = computeHermiteSmoothedData.call(this, this.renderer._lowBandGridData);
|
||
this.renderer._lowBandSmoothedData = ret[0];
|
||
}
|
||
|
||
ret = null;
|
||
}
|
||
}
|
||
return gd;
|
||
};
|
||
|
||
|
||
// called within scope of series.
|
||
$.jqplot.LineRenderer.prototype.draw = function(ctx, gd, options, plot) {
|
||
var i;
|
||
// get a copy of the options, so we don't modify the original object.
|
||
var opts = $.extend(true, {}, options);
|
||
var shadow = (opts.shadow != undefined) ? opts.shadow : this.shadow;
|
||
var showLine = (opts.showLine != undefined) ? opts.showLine : this.showLine;
|
||
var fill = (opts.fill != undefined) ? opts.fill : this.fill;
|
||
var fillAndStroke = (opts.fillAndStroke != undefined) ? opts.fillAndStroke : this.fillAndStroke;
|
||
var xmin, ymin, xmax, ymax;
|
||
ctx.save();
|
||
if (gd.length) {
|
||
if (showLine) {
|
||
// if we fill, we'll have to add points to close the curve.
|
||
if (fill) {
|
||
if (this.fillToZero) {
|
||
// have to break line up into shapes at axis crossings
|
||
var negativeColor = this.negativeColor;
|
||
if (! this.useNegativeColors) {
|
||
negativeColor = opts.fillStyle;
|
||
}
|
||
var isnegative = false;
|
||
var posfs = opts.fillStyle;
|
||
|
||
// if stoking line as well as filling, get a copy of line data.
|
||
if (fillAndStroke) {
|
||
var fasgd = gd.slice(0);
|
||
}
|
||
// if not stacked, fill down to axis
|
||
if (this.index == 0 || !this._stack) {
|
||
|
||
var tempgd = [];
|
||
var pd = (this.renderer.smooth) ? this.renderer._smoothedPlotData : this._plotData;
|
||
this._areaPoints = [];
|
||
var pyzero = this._yaxis.series_u2p(this.fillToValue);
|
||
var pxzero = this._xaxis.series_u2p(this.fillToValue);
|
||
|
||
opts.closePath = true;
|
||
|
||
if (this.fillAxis == 'y') {
|
||
tempgd.push([gd[0][0], pyzero]);
|
||
this._areaPoints.push([gd[0][0], pyzero]);
|
||
|
||
for (var i=0; i<gd.length-1; i++) {
|
||
tempgd.push(gd[i]);
|
||
this._areaPoints.push(gd[i]);
|
||
// do we have an axis crossing?
|
||
if (pd[i][1] * pd[i+1][1] < 0) {
|
||
if (pd[i][1] < 0) {
|
||
isnegative = true;
|
||
opts.fillStyle = negativeColor;
|
||
}
|
||
else {
|
||
isnegative = false;
|
||
opts.fillStyle = posfs;
|
||
}
|
||
|
||
var xintercept = gd[i][0] + (gd[i+1][0] - gd[i][0]) * (pyzero-gd[i][1])/(gd[i+1][1] - gd[i][1]);
|
||
tempgd.push([xintercept, pyzero]);
|
||
this._areaPoints.push([xintercept, pyzero]);
|
||
// now draw this shape and shadow.
|
||
if (shadow) {
|
||
this.renderer.shadowRenderer.draw(ctx, tempgd, opts);
|
||
}
|
||
this.renderer.shapeRenderer.draw(ctx, tempgd, opts);
|
||
// now empty temp array and continue
|
||
tempgd = [[xintercept, pyzero]];
|
||
// this._areaPoints = [[xintercept, pyzero]];
|
||
}
|
||
}
|
||
if (pd[gd.length-1][1] < 0) {
|
||
isnegative = true;
|
||
opts.fillStyle = negativeColor;
|
||
}
|
||
else {
|
||
isnegative = false;
|
||
opts.fillStyle = posfs;
|
||
}
|
||
tempgd.push(gd[gd.length-1]);
|
||
this._areaPoints.push(gd[gd.length-1]);
|
||
tempgd.push([gd[gd.length-1][0], pyzero]);
|
||
this._areaPoints.push([gd[gd.length-1][0], pyzero]);
|
||
}
|
||
// now draw the last area.
|
||
if (shadow) {
|
||
this.renderer.shadowRenderer.draw(ctx, tempgd, opts);
|
||
}
|
||
this.renderer.shapeRenderer.draw(ctx, tempgd, opts);
|
||
|
||
|
||
// var gridymin = this._yaxis.series_u2p(0);
|
||
// // IE doesn't return new length on unshift
|
||
// gd.unshift([gd[0][0], gridymin]);
|
||
// len = gd.length;
|
||
// gd.push([gd[len - 1][0], gridymin]);
|
||
}
|
||
// if stacked, fill to line below
|
||
else {
|
||
var prev = this._prevGridData;
|
||
for (var i=prev.length; i>0; i--) {
|
||
gd.push(prev[i-1]);
|
||
// this._areaPoints.push(prev[i-1]);
|
||
}
|
||
if (shadow) {
|
||
this.renderer.shadowRenderer.draw(ctx, gd, opts);
|
||
}
|
||
this._areaPoints = gd;
|
||
this.renderer.shapeRenderer.draw(ctx, gd, opts);
|
||
}
|
||
}
|
||
/////////////////////////
|
||
// Not filled to zero
|
||
////////////////////////
|
||
else {
|
||
// if stoking line as well as filling, get a copy of line data.
|
||
if (fillAndStroke) {
|
||
var fasgd = gd.slice(0);
|
||
}
|
||
// if not stacked, fill down to axis
|
||
if (this.index == 0 || !this._stack) {
|
||
// var gridymin = this._yaxis.series_u2p(this._yaxis.min) - this.gridBorderWidth / 2;
|
||
var gridymin = ctx.canvas.height;
|
||
// IE doesn't return new length on unshift
|
||
gd.unshift([gd[0][0], gridymin]);
|
||
var len = gd.length;
|
||
gd.push([gd[len - 1][0], gridymin]);
|
||
}
|
||
// if stacked, fill to line below
|
||
else {
|
||
var prev = this._prevGridData;
|
||
for (var i=prev.length; i>0; i--) {
|
||
gd.push(prev[i-1]);
|
||
}
|
||
}
|
||
this._areaPoints = gd;
|
||
|
||
if (shadow) {
|
||
this.renderer.shadowRenderer.draw(ctx, gd, opts);
|
||
}
|
||
|
||
this.renderer.shapeRenderer.draw(ctx, gd, opts);
|
||
}
|
||
if (fillAndStroke) {
|
||
var fasopts = $.extend(true, {}, opts, {fill:false, closePath:false});
|
||
this.renderer.shapeRenderer.draw(ctx, fasgd, fasopts);
|
||
//////////
|
||
// TODO: figure out some way to do shadows nicely
|
||
// if (shadow) {
|
||
// this.renderer.shadowRenderer.draw(ctx, fasgd, fasopts);
|
||
// }
|
||
// now draw the markers
|
||
if (this.markerRenderer.show) {
|
||
if (this.renderer.smooth) {
|
||
fasgd = this.gridData;
|
||
}
|
||
for (i=0; i<fasgd.length; i++) {
|
||
this.markerRenderer.draw(fasgd[i][0], fasgd[i][1], ctx, opts.markerOptions);
|
||
}
|
||
}
|
||
}
|
||
}
|
||
else {
|
||
|
||
if (this.renderer.bands.show) {
|
||
var bdat;
|
||
var bopts = $.extend(true, {}, opts);
|
||
if (this.renderer.bands.showLines) {
|
||
bdat = (this.renderer.smooth) ? this.renderer._hiBandSmoothedData : this.renderer._hiBandGridData;
|
||
this.renderer.shapeRenderer.draw(ctx, bdat, opts);
|
||
bdat = (this.renderer.smooth) ? this.renderer._lowBandSmoothedData : this.renderer._lowBandGridData;
|
||
this.renderer.shapeRenderer.draw(ctx, bdat, bopts);
|
||
}
|
||
|
||
if (this.renderer.bands.fill) {
|
||
if (this.renderer.smooth) {
|
||
bdat = this.renderer._hiBandSmoothedData.concat(this.renderer._lowBandSmoothedData.reverse());
|
||
}
|
||
else {
|
||
bdat = this.renderer._hiBandGridData.concat(this.renderer._lowBandGridData.reverse());
|
||
}
|
||
this._areaPoints = bdat;
|
||
bopts.closePath = true;
|
||
bopts.fill = true;
|
||
bopts.fillStyle = this.renderer.bands.fillColor;
|
||
this.renderer.shapeRenderer.draw(ctx, bdat, bopts);
|
||
}
|
||
}
|
||
|
||
if (shadow) {
|
||
this.renderer.shadowRenderer.draw(ctx, gd, opts);
|
||
}
|
||
|
||
this.renderer.shapeRenderer.draw(ctx, gd, opts);
|
||
}
|
||
}
|
||
// calculate the bounding box
|
||
var xmin = xmax = ymin = ymax = null;
|
||
for (i=0; i<this._areaPoints.length; i++) {
|
||
var p = this._areaPoints[i];
|
||
if (xmin > p[0] || xmin == null) {
|
||
xmin = p[0];
|
||
}
|
||
if (ymax < p[1] || ymax == null) {
|
||
ymax = p[1];
|
||
}
|
||
if (xmax < p[0] || xmax == null) {
|
||
xmax = p[0];
|
||
}
|
||
if (ymin > p[1] || ymin == null) {
|
||
ymin = p[1];
|
||
}
|
||
}
|
||
|
||
if (this.type === 'line' && this.renderer.bands.show) {
|
||
ymax = this._yaxis.series_u2p(this.renderer.bands._min);
|
||
ymin = this._yaxis.series_u2p(this.renderer.bands._max);
|
||
}
|
||
|
||
this._boundingBox = [[xmin, ymax], [xmax, ymin]];
|
||
|
||
// now draw the markers
|
||
if (this.markerRenderer.show && !fill) {
|
||
if (this.renderer.smooth) {
|
||
gd = this.gridData;
|
||
}
|
||
for (i=0; i<gd.length; i++) {
|
||
if (gd[i][0] != null && gd[i][1] != null) {
|
||
this.markerRenderer.draw(gd[i][0], gd[i][1], ctx, opts.markerOptions);
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
ctx.restore();
|
||
};
|
||
|
||
$.jqplot.LineRenderer.prototype.drawShadow = function(ctx, gd, options) {
|
||
// This is a no-op, shadows drawn with lines.
|
||
};
|
||
|
||
// called with scope of plot.
|
||
// make sure to not leave anything highlighted.
|
||
function postInit(target, data, options) {
|
||
for (var i=0; i<this.series.length; i++) {
|
||
if (this.series[i].renderer.constructor == $.jqplot.LineRenderer) {
|
||
// don't allow mouseover and mousedown at same time.
|
||
if (this.series[i].highlightMouseOver) {
|
||
this.series[i].highlightMouseDown = false;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
// called within context of plot
|
||
// create a canvas which we can draw on.
|
||
// insert it before the eventCanvas, so eventCanvas will still capture events.
|
||
function postPlotDraw() {
|
||
// Memory Leaks patch
|
||
if (this.plugins.lineRenderer && this.plugins.lineRenderer.highlightCanvas) {
|
||
this.plugins.lineRenderer.highlightCanvas.resetCanvas();
|
||
this.plugins.lineRenderer.highlightCanvas = null;
|
||
}
|
||
|
||
this.plugins.lineRenderer.highlightedSeriesIndex = null;
|
||
this.plugins.lineRenderer.highlightCanvas = new $.jqplot.GenericCanvas();
|
||
|
||
this.eventCanvas._elem.before(this.plugins.lineRenderer.highlightCanvas.createElement(this._gridPadding, 'jqplot-lineRenderer-highlight-canvas', this._plotDimensions, this));
|
||
this.plugins.lineRenderer.highlightCanvas.setContext();
|
||
this.eventCanvas._elem.bind('mouseleave', {plot:this}, function (ev) { unhighlight(ev.data.plot); });
|
||
}
|
||
|
||
function highlight (plot, sidx, pidx, points) {
|
||
var s = plot.series[sidx];
|
||
var canvas = plot.plugins.lineRenderer.highlightCanvas;
|
||
canvas._ctx.clearRect(0,0,canvas._ctx.canvas.width, canvas._ctx.canvas.height);
|
||
s._highlightedPoint = pidx;
|
||
plot.plugins.lineRenderer.highlightedSeriesIndex = sidx;
|
||
var opts = {fillStyle: s.highlightColor};
|
||
if (s.type === 'line' && s.renderer.bands.show) {
|
||
opts.fill = true;
|
||
opts.closePath = true;
|
||
}
|
||
s.renderer.shapeRenderer.draw(canvas._ctx, points, opts);
|
||
canvas = null;
|
||
}
|
||
|
||
function unhighlight (plot) {
|
||
var canvas = plot.plugins.lineRenderer.highlightCanvas;
|
||
canvas._ctx.clearRect(0,0, canvas._ctx.canvas.width, canvas._ctx.canvas.height);
|
||
for (var i=0; i<plot.series.length; i++) {
|
||
plot.series[i]._highlightedPoint = null;
|
||
}
|
||
plot.plugins.lineRenderer.highlightedSeriesIndex = null;
|
||
plot.target.trigger('jqplotDataUnhighlight');
|
||
canvas = null;
|
||
}
|
||
|
||
|
||
function handleMove(ev, gridpos, datapos, neighbor, plot) {
|
||
if (neighbor) {
|
||
var ins = [neighbor.seriesIndex, neighbor.pointIndex, neighbor.data];
|
||
var evt1 = jQuery.Event('jqplotDataMouseOver');
|
||
evt1.pageX = ev.pageX;
|
||
evt1.pageY = ev.pageY;
|
||
plot.target.trigger(evt1, ins);
|
||
if (plot.series[ins[0]].highlightMouseOver && !(ins[0] == plot.plugins.lineRenderer.highlightedSeriesIndex)) {
|
||
var evt = jQuery.Event('jqplotDataHighlight');
|
||
evt.pageX = ev.pageX;
|
||
evt.pageY = ev.pageY;
|
||
plot.target.trigger(evt, ins);
|
||
highlight (plot, neighbor.seriesIndex, neighbor.pointIndex, neighbor.points);
|
||
}
|
||
}
|
||
else if (neighbor == null) {
|
||
unhighlight (plot);
|
||
}
|
||
}
|
||
|
||
function handleMouseDown(ev, gridpos, datapos, neighbor, plot) {
|
||
if (neighbor) {
|
||
var ins = [neighbor.seriesIndex, neighbor.pointIndex, neighbor.data];
|
||
if (plot.series[ins[0]].highlightMouseDown && !(ins[0] == plot.plugins.lineRenderer.highlightedSeriesIndex)) {
|
||
var evt = jQuery.Event('jqplotDataHighlight');
|
||
evt.pageX = ev.pageX;
|
||
evt.pageY = ev.pageY;
|
||
plot.target.trigger(evt, ins);
|
||
highlight (plot, neighbor.seriesIndex, neighbor.pointIndex, neighbor.points);
|
||
}
|
||
}
|
||
else if (neighbor == null) {
|
||
unhighlight (plot);
|
||
}
|
||
}
|
||
|
||
function handleMouseUp(ev, gridpos, datapos, neighbor, plot) {
|
||
var idx = plot.plugins.lineRenderer.highlightedSeriesIndex;
|
||
if (idx != null && plot.series[idx].highlightMouseDown) {
|
||
unhighlight(plot);
|
||
}
|
||
}
|
||
|
||
function handleClick(ev, gridpos, datapos, neighbor, plot) {
|
||
if (neighbor) {
|
||
var ins = [neighbor.seriesIndex, neighbor.pointIndex, neighbor.data];
|
||
var evt = jQuery.Event('jqplotDataClick');
|
||
evt.pageX = ev.pageX;
|
||
evt.pageY = ev.pageY;
|
||
plot.target.trigger(evt, ins);
|
||
}
|
||
}
|
||
|
||
function handleRightClick(ev, gridpos, datapos, neighbor, plot) {
|
||
if (neighbor) {
|
||
var ins = [neighbor.seriesIndex, neighbor.pointIndex, neighbor.data];
|
||
var idx = plot.plugins.lineRenderer.highlightedSeriesIndex;
|
||
if (idx != null && plot.series[idx].highlightMouseDown) {
|
||
unhighlight(plot);
|
||
}
|
||
var evt = jQuery.Event('jqplotDataRightClick');
|
||
evt.pageX = ev.pageX;
|
||
evt.pageY = ev.pageY;
|
||
plot.target.trigger(evt, ins);
|
||
}
|
||
}
|
||
|
||
|
||
// class: $.jqplot.LinearAxisRenderer
|
||
// The default jqPlot axis renderer, creating a numeric axis.
|
||
$.jqplot.LinearAxisRenderer = function() {
|
||
};
|
||
|
||
// called with scope of axis object.
|
||
$.jqplot.LinearAxisRenderer.prototype.init = function(options){
|
||
// prop: breakPoints
|
||
// EXPERIMENTAL!! Use at your own risk!
|
||
// Works only with linear axes and the default tick renderer.
|
||
// Array of [start, stop] points to create a broken axis.
|
||
// Broken axes have a "jump" in them, which is an immediate
|
||
// transition from a smaller value to a larger value.
|
||
// Currently, axis ticks MUST be manually assigned if using breakPoints
|
||
// by using the axis ticks array option.
|
||
this.breakPoints = null;
|
||
// prop: breakTickLabel
|
||
// Label to use at the axis break if breakPoints are specified.
|
||
this.breakTickLabel = "≈";
|
||
// prop: drawBaseline
|
||
// True to draw the axis baseline.
|
||
this.drawBaseline = true;
|
||
// prop: baselineWidth
|
||
// width of the baseline in pixels.
|
||
this.baselineWidth = null;
|
||
// prop: baselineColor
|
||
// CSS color spec for the baseline.
|
||
this.baselineColor = null;
|
||
// prop: forceTickAt0
|
||
// This will ensure that there is always a tick mark at 0.
|
||
// If data range is strictly positive or negative,
|
||
// this will force 0 to be inside the axis bounds unless
|
||
// the appropriate axis pad (pad, padMin or padMax) is set
|
||
// to 0, then this will force an axis min or max value at 0.
|
||
// This has know effect when any of the following options
|
||
// are set: autoscale, min, max, numberTicks or tickInterval.
|
||
this.forceTickAt0 = false;
|
||
// prop: forceTickAt100
|
||
// This will ensure that there is always a tick mark at 100.
|
||
// If data range is strictly above or below 100,
|
||
// this will force 100 to be inside the axis bounds unless
|
||
// the appropriate axis pad (pad, padMin or padMax) is set
|
||
// to 0, then this will force an axis min or max value at 100.
|
||
// This has know effect when any of the following options
|
||
// are set: autoscale, min, max, numberTicks or tickInterval.
|
||
this.forceTickAt100 = false;
|
||
// prop: tickInset
|
||
// Controls the amount to inset the first and last ticks from
|
||
// the edges of the grid, in multiples of the tick interval.
|
||
// 0 is no inset, 0.5 is one half a tick interval, 1 is a full
|
||
// tick interval, etc.
|
||
this.tickInset = 0;
|
||
// prop: minorTicks
|
||
// Number of ticks to add between "major" ticks.
|
||
// Major ticks are ticks supplied by user or auto computed.
|
||
// Minor ticks cannot be created by user.
|
||
this.minorTicks = 0;
|
||
this.alignTicks = false;
|
||
this._autoFormatString = '';
|
||
this._overrideFormatString = false;
|
||
this._scalefact = 1.0;
|
||
$.extend(true, this, options);
|
||
if (this.breakPoints) {
|
||
if (!$.isArray(this.breakPoints)) {
|
||
this.breakPoints = null;
|
||
}
|
||
else if (this.breakPoints.length < 2 || this.breakPoints[1] <= this.breakPoints[0]) {
|
||
this.breakPoints = null;
|
||
}
|
||
}
|
||
if (this.numberTicks != null && this.numberTicks < 2) {
|
||
this.numberTicks = 2;
|
||
}
|
||
this.resetDataBounds();
|
||
};
|
||
|
||
// called with scope of axis
|
||
$.jqplot.LinearAxisRenderer.prototype.draw = function(ctx, plot) {
|
||
if (this.show) {
|
||
// populate the axis label and value properties.
|
||
// createTicks is a method on the renderer, but
|
||
// call it within the scope of the axis.
|
||
this.renderer.createTicks.call(this, plot);
|
||
// fill a div with axes labels in the right direction.
|
||
// Need to pregenerate each axis to get it's bounds and
|
||
// position it and the labels correctly on the plot.
|
||
var dim=0;
|
||
var temp;
|
||
// Added for theming.
|
||
if (this._elem) {
|
||
// Memory Leaks patch
|
||
//this._elem.empty();
|
||
this._elem.emptyForce();
|
||
this._elem = null;
|
||
}
|
||
|
||
this._elem = $(document.createElement('div'));
|
||
this._elem.addClass('jqplot-axis jqplot-'+this.name);
|
||
this._elem.css('position', 'absolute');
|
||
|
||
|
||
if (this.name == 'xaxis' || this.name == 'x2axis') {
|
||
this._elem.width(this._plotDimensions.width);
|
||
}
|
||
else {
|
||
this._elem.height(this._plotDimensions.height);
|
||
}
|
||
|
||
// create a _label object.
|
||
this.labelOptions.axis = this.name;
|
||
this._label = new this.labelRenderer(this.labelOptions);
|
||
if (this._label.show) {
|
||
var elem = this._label.draw(ctx, plot);
|
||
elem.appendTo(this._elem);
|
||
elem = null;
|
||
}
|
||
|
||
var t = this._ticks;
|
||
var tick;
|
||
for (var i=0; i<t.length; i++) {
|
||
tick = t[i];
|
||
if (tick.show && tick.showLabel && (!tick.isMinorTick || this.showMinorTicks)) {
|
||
this._elem.append(tick.draw(ctx, plot));
|
||
}
|
||
}
|
||
tick = null;
|
||
t = null;
|
||
}
|
||
return this._elem;
|
||
};
|
||
|
||
// called with scope of an axis
|
||
$.jqplot.LinearAxisRenderer.prototype.reset = function() {
|
||
this.min = this._options.min;
|
||
this.max = this._options.max;
|
||
this.tickInterval = this._options.tickInterval;
|
||
this.numberTicks = this._options.numberTicks;
|
||
this._autoFormatString = '';
|
||
if (this._overrideFormatString && this.tickOptions && this.tickOptions.formatString) {
|
||
this.tickOptions.formatString = '';
|
||
}
|
||
|
||
// this._ticks = this.__ticks;
|
||
};
|
||
|
||
// called with scope of axis
|
||
$.jqplot.LinearAxisRenderer.prototype.set = function() {
|
||
var dim = 0;
|
||
var temp;
|
||
var w = 0;
|
||
var h = 0;
|
||
var lshow = (this._label == null) ? false : this._label.show;
|
||
if (this.show) {
|
||
var t = this._ticks;
|
||
var tick;
|
||
for (var i=0; i<t.length; i++) {
|
||
tick = t[i];
|
||
if (!tick._breakTick && tick.show && tick.showLabel && (!tick.isMinorTick || this.showMinorTicks)) {
|
||
if (this.name == 'xaxis' || this.name == 'x2axis') {
|
||
temp = tick._elem.outerHeight(true);
|
||
}
|
||
else {
|
||
temp = tick._elem.outerWidth(true);
|
||
}
|
||
if (temp > dim) {
|
||
dim = temp;
|
||
}
|
||
}
|
||
}
|
||
tick = null;
|
||
t = null;
|
||
|
||
if (lshow) {
|
||
w = this._label._elem.outerWidth(true);
|
||
h = this._label._elem.outerHeight(true);
|
||
}
|
||
if (this.name == 'xaxis') {
|
||
dim = dim + h;
|
||
this._elem.css({'height':dim+'px', left:'0px', bottom:'0px'});
|
||
}
|
||
else if (this.name == 'x2axis') {
|
||
dim = dim + h;
|
||
this._elem.css({'height':dim+'px', left:'0px', top:'0px'});
|
||
}
|
||
else if (this.name == 'yaxis') {
|
||
dim = dim + w;
|
||
this._elem.css({'width':dim+'px', left:'0px', top:'0px'});
|
||
if (lshow && this._label.constructor == $.jqplot.AxisLabelRenderer) {
|
||
this._label._elem.css('width', w+'px');
|
||
}
|
||
}
|
||
else {
|
||
dim = dim + w;
|
||
this._elem.css({'width':dim+'px', right:'0px', top:'0px'});
|
||
if (lshow && this._label.constructor == $.jqplot.AxisLabelRenderer) {
|
||
this._label._elem.css('width', w+'px');
|
||
}
|
||
}
|
||
}
|
||
};
|
||
|
||
// called with scope of axis
|
||
$.jqplot.LinearAxisRenderer.prototype.createTicks = function(plot) {
|
||
// we're are operating on an axis here
|
||
var ticks = this._ticks;
|
||
var userTicks = this.ticks;
|
||
var name = this.name;
|
||
// databounds were set on axis initialization.
|
||
var db = this._dataBounds;
|
||
var dim, interval;
|
||
var min, max;
|
||
var pos1, pos2;
|
||
var tt, i;
|
||
// get a copy of user's settings for min/max.
|
||
var userMin = this.min;
|
||
var userMax = this.max;
|
||
var userNT = this.numberTicks;
|
||
var userTI = this.tickInterval;
|
||
|
||
// if we already have ticks, use them.
|
||
// ticks must be in order of increasing value.
|
||
|
||
if (userTicks.length) {
|
||
// ticks could be 1D or 2D array of [val, val, ,,,] or [[val, label], [val, label], ...] or mixed
|
||
for (i=0; i<userTicks.length; i++){
|
||
var ut = userTicks[i];
|
||
var t = new this.tickRenderer(this.tickOptions);
|
||
if ($.isArray(ut)) {
|
||
t.value = ut[0];
|
||
if (this.breakPoints) {
|
||
if (ut[0] == this.breakPoints[0]) {
|
||
t.label = this.breakTickLabel;
|
||
t._breakTick = true;
|
||
t.showGridline = false;
|
||
t.showMark = false;
|
||
}
|
||
else if (ut[0] > this.breakPoints[0] && ut[0] <= this.breakPoints[1]) {
|
||
t.show = false;
|
||
t.showGridline = false;
|
||
t.label = ut[1];
|
||
}
|
||
else {
|
||
t.label = ut[1];
|
||
}
|
||
}
|
||
else {
|
||
t.label = ut[1];
|
||
}
|
||
t.setTick(ut[0], this.name);
|
||
this._ticks.push(t);
|
||
}
|
||
|
||
else if ($.isPlainObject(ut)) {
|
||
$.extend(true, t, ut);
|
||
t.axis = this.name;
|
||
this._ticks.push(t);
|
||
}
|
||
|
||
else {
|
||
t.value = ut;
|
||
if (this.breakPoints) {
|
||
if (ut == this.breakPoints[0]) {
|
||
t.label = this.breakTickLabel;
|
||
t._breakTick = true;
|
||
t.showGridline = false;
|
||
t.showMark = false;
|
||
}
|
||
else if (ut > this.breakPoints[0] && ut <= this.breakPoints[1]) {
|
||
t.show = false;
|
||
t.showGridline = false;
|
||
}
|
||
}
|
||
t.setTick(ut, this.name);
|
||
this._ticks.push(t);
|
||
}
|
||
}
|
||
this.numberTicks = userTicks.length;
|
||
this.min = this._ticks[0].value;
|
||
this.max = this._ticks[this.numberTicks-1].value;
|
||
this.tickInterval = (this.max - this.min) / (this.numberTicks - 1);
|
||
}
|
||
|
||
// we don't have any ticks yet, let's make some!
|
||
else {
|
||
if (name == 'xaxis' || name == 'x2axis') {
|
||
dim = this._plotDimensions.width;
|
||
}
|
||
else {
|
||
dim = this._plotDimensions.height;
|
||
}
|
||
|
||
var _numberTicks = this.numberTicks;
|
||
|
||
// if aligning this axis, use number of ticks from previous axis.
|
||
// Do I need to reset somehow if alignTicks is changed and then graph is replotted??
|
||
if (this.alignTicks) {
|
||
if (this.name === 'x2axis' && plot.axes.xaxis.show) {
|
||
_numberTicks = plot.axes.xaxis.numberTicks;
|
||
}
|
||
else if (this.name.charAt(0) === 'y' && this.name !== 'yaxis' && this.name !== 'yMidAxis' && plot.axes.yaxis.show) {
|
||
_numberTicks = plot.axes.yaxis.numberTicks;
|
||
}
|
||
}
|
||
|
||
// // if min, max and number of ticks specified, user can't specify interval.
|
||
// if (!this.autoscale && this.min != null && this.max != null && this.numberTicks != null) {
|
||
// console.log('doing this');
|
||
// this.tickInterval = null;
|
||
// }
|
||
|
||
// if max, min, and interval specified and interval won't fit, ignore interval.
|
||
// if (this.min != null && this.max != null && this.tickInterval != null) {
|
||
// if (parseInt((this.max-this.min)/this.tickInterval, 10) != (this.max-this.min)/this.tickInterval) {
|
||
// this.tickInterval = null;
|
||
// }
|
||
// }
|
||
|
||
min = ((this.min != null) ? this.min : db.min);
|
||
max = ((this.max != null) ? this.max : db.max);
|
||
|
||
var range = max - min;
|
||
var rmin, rmax;
|
||
var temp;
|
||
|
||
if (this.tickOptions == null || !this.tickOptions.formatString) {
|
||
this._overrideFormatString = true;
|
||
}
|
||
|
||
// Doing complete autoscaling
|
||
if (this.min == null && this.max == null && this.tickInterval == null && !this.autoscale) {
|
||
// Check if user must have tick at 0 or 100 and ensure they are in range.
|
||
// The autoscaling algorithm will always place ticks at 0 and 100 if they are in range.
|
||
if (this.forceTickAt0) {
|
||
if (min > 0) {
|
||
min = 0;
|
||
}
|
||
if (max < 0) {
|
||
max = 0;
|
||
}
|
||
}
|
||
|
||
if (this.forceTickAt100) {
|
||
if (min > 100) {
|
||
min = 100;
|
||
}
|
||
if (max < 100) {
|
||
max = 100;
|
||
}
|
||
}
|
||
|
||
var threshold = 30;
|
||
var tdim = Math.max(dim, threshold+1);
|
||
this._scalefact = (tdim-threshold)/300.0;
|
||
var ret = $.jqplot.LinearTickGenerator(min, max, this._scalefact, _numberTicks);
|
||
// calculate a padded max and min, points should be less than these
|
||
// so that they aren't too close to the edges of the plot.
|
||
// User can adjust how much padding is allowed with pad, padMin and PadMax options.
|
||
var tumin = min + range*(this.padMin - 1);
|
||
var tumax = max - range*(this.padMax - 1);
|
||
|
||
// if they're equal, we shouldn't have to do anything, right?
|
||
// if (min <=tumin || max >= tumax) {
|
||
if (min <tumin || max > tumax) {
|
||
tumin = min - range*(this.padMin - 1);
|
||
tumax = max + range*(this.padMax - 1);
|
||
ret = $.jqplot.LinearTickGenerator(tumin, tumax, this._scalefact, _numberTicks);
|
||
}
|
||
|
||
this.min = ret[0];
|
||
this.max = ret[1];
|
||
// if numberTicks specified, it should return the same.
|
||
this.numberTicks = ret[2];
|
||
this._autoFormatString = ret[3];
|
||
this.tickInterval = ret[4];
|
||
}
|
||
|
||
// User has specified some axis scale related option, can use auto algorithm
|
||
else {
|
||
|
||
// if min and max are same, space them out a bit
|
||
if (min == max) {
|
||
var adj = 0.05;
|
||
if (min > 0) {
|
||
adj = Math.max(Math.log(min)/Math.LN10, 0.05);
|
||
}
|
||
min -= adj;
|
||
max += adj;
|
||
}
|
||
|
||
// autoscale. Can't autoscale if min or max is supplied.
|
||
// Will use numberTicks and tickInterval if supplied. Ticks
|
||
// across multiple axes may not line up depending on how
|
||
// bars are to be plotted.
|
||
if (this.autoscale && this.min == null && this.max == null) {
|
||
var rrange, ti, margin;
|
||
var forceMinZero = false;
|
||
var forceZeroLine = false;
|
||
var intervals = {min:null, max:null, average:null, stddev:null};
|
||
// if any series are bars, or if any are fill to zero, and if this
|
||
// is the axis to fill toward, check to see if we can start axis at zero.
|
||
for (var i=0; i<this._series.length; i++) {
|
||
var s = this._series[i];
|
||
var faname = (s.fillAxis == 'x') ? s._xaxis.name : s._yaxis.name;
|
||
// check to see if this is the fill axis
|
||
if (this.name == faname) {
|
||
var vals = s._plotValues[s.fillAxis];
|
||
var vmin = vals[0];
|
||
var vmax = vals[0];
|
||
for (var j=1; j<vals.length; j++) {
|
||
if (vals[j] < vmin) {
|
||
vmin = vals[j];
|
||
}
|
||
else if (vals[j] > vmax) {
|
||
vmax = vals[j];
|
||
}
|
||
}
|
||
var dp = (vmax - vmin) / vmax;
|
||
// is this sries a bar?
|
||
if (s.renderer.constructor == $.jqplot.BarRenderer) {
|
||
// if no negative values and could also check range.
|
||
if (vmin >= 0 && (s.fillToZero || dp > 0.1)) {
|
||
forceMinZero = true;
|
||
}
|
||
else {
|
||
forceMinZero = false;
|
||
if (s.fill && s.fillToZero && vmin < 0 && vmax > 0) {
|
||
forceZeroLine = true;
|
||
}
|
||
else {
|
||
forceZeroLine = false;
|
||
}
|
||
}
|
||
}
|
||
|
||
// if not a bar and filling, use appropriate method.
|
||
else if (s.fill) {
|
||
if (vmin >= 0 && (s.fillToZero || dp > 0.1)) {
|
||
forceMinZero = true;
|
||
}
|
||
else if (vmin < 0 && vmax > 0 && s.fillToZero) {
|
||
forceMinZero = false;
|
||
forceZeroLine = true;
|
||
}
|
||
else {
|
||
forceMinZero = false;
|
||
forceZeroLine = false;
|
||
}
|
||
}
|
||
|
||
// if not a bar and not filling, only change existing state
|
||
// if it doesn't make sense
|
||
else if (vmin < 0) {
|
||
forceMinZero = false;
|
||
}
|
||
}
|
||
}
|
||
|
||
// check if we need make axis min at 0.
|
||
if (forceMinZero) {
|
||
// compute number of ticks
|
||
this.numberTicks = 2 + Math.ceil((dim-(this.tickSpacing-1))/this.tickSpacing);
|
||
this.min = 0;
|
||
userMin = 0;
|
||
// what order is this range?
|
||
// what tick interval does that give us?
|
||
ti = max/(this.numberTicks-1);
|
||
temp = Math.pow(10, Math.abs(Math.floor(Math.log(ti)/Math.LN10)));
|
||
if (ti/temp == parseInt(ti/temp, 10)) {
|
||
ti += temp;
|
||
}
|
||
this.tickInterval = Math.ceil(ti/temp) * temp;
|
||
this.max = this.tickInterval * (this.numberTicks - 1);
|
||
}
|
||
|
||
// check if we need to make sure there is a tick at 0.
|
||
else if (forceZeroLine) {
|
||
// compute number of ticks
|
||
this.numberTicks = 2 + Math.ceil((dim-(this.tickSpacing-1))/this.tickSpacing);
|
||
var ntmin = Math.ceil(Math.abs(min)/range*(this.numberTicks-1));
|
||
var ntmax = this.numberTicks - 1 - ntmin;
|
||
ti = Math.max(Math.abs(min/ntmin), Math.abs(max/ntmax));
|
||
temp = Math.pow(10, Math.abs(Math.floor(Math.log(ti)/Math.LN10)));
|
||
this.tickInterval = Math.ceil(ti/temp) * temp;
|
||
this.max = this.tickInterval * ntmax;
|
||
this.min = -this.tickInterval * ntmin;
|
||
}
|
||
|
||
// if nothing else, do autoscaling which will try to line up ticks across axes.
|
||
else {
|
||
if (this.numberTicks == null){
|
||
if (this.tickInterval) {
|
||
this.numberTicks = 3 + Math.ceil(range / this.tickInterval);
|
||
}
|
||
else {
|
||
this.numberTicks = 2 + Math.ceil((dim-(this.tickSpacing-1))/this.tickSpacing);
|
||
}
|
||
}
|
||
|
||
if (this.tickInterval == null) {
|
||
// get a tick interval
|
||
ti = range/(this.numberTicks - 1);
|
||
|
||
if (ti < 1) {
|
||
temp = Math.pow(10, Math.abs(Math.floor(Math.log(ti)/Math.LN10)));
|
||
}
|
||
else {
|
||
temp = 1;
|
||
}
|
||
this.tickInterval = Math.ceil(ti*temp*this.pad)/temp;
|
||
}
|
||
else {
|
||
temp = 1 / this.tickInterval;
|
||
}
|
||
|
||
// try to compute a nicer, more even tick interval
|
||
// temp = Math.pow(10, Math.floor(Math.log(ti)/Math.LN10));
|
||
// this.tickInterval = Math.ceil(ti/temp) * temp;
|
||
rrange = this.tickInterval * (this.numberTicks - 1);
|
||
margin = (rrange - range)/2;
|
||
|
||
if (this.min == null) {
|
||
this.min = Math.floor(temp*(min-margin))/temp;
|
||
}
|
||
if (this.max == null) {
|
||
this.max = this.min + rrange;
|
||
}
|
||
}
|
||
|
||
// Compute a somewhat decent format string if it is needed.
|
||
// get precision of interval and determine a format string.
|
||
var sf = $.jqplot.getSignificantFigures(this.tickInterval);
|
||
|
||
var fstr;
|
||
|
||
// if we have only a whole number, use integer formatting
|
||
if (sf.digitsLeft >= sf.significantDigits) {
|
||
fstr = '%d';
|
||
}
|
||
|
||
else {
|
||
var temp = Math.max(0, 5 - sf.digitsLeft);
|
||
temp = Math.min(temp, sf.digitsRight);
|
||
fstr = '%.'+ temp + 'f';
|
||
}
|
||
|
||
this._autoFormatString = fstr;
|
||
}
|
||
|
||
// Use the default algorithm which pads each axis to make the chart
|
||
// centered nicely on the grid.
|
||
else {
|
||
|
||
rmin = (this.min != null) ? this.min : min - range*(this.padMin - 1);
|
||
rmax = (this.max != null) ? this.max : max + range*(this.padMax - 1);
|
||
range = rmax - rmin;
|
||
|
||
if (this.numberTicks == null){
|
||
// if tickInterval is specified by user, we will ignore computed maximum.
|
||
// max will be equal or greater to fit even # of ticks.
|
||
if (this.tickInterval != null) {
|
||
this.numberTicks = Math.ceil((rmax - rmin)/this.tickInterval)+1;
|
||
}
|
||
else if (dim > 100) {
|
||
this.numberTicks = parseInt(3+(dim-100)/75, 10);
|
||
}
|
||
else {
|
||
this.numberTicks = 2;
|
||
}
|
||
}
|
||
|
||
if (this.tickInterval == null) {
|
||
this.tickInterval = range / (this.numberTicks-1);
|
||
}
|
||
|
||
if (this.max == null) {
|
||
rmax = rmin + this.tickInterval*(this.numberTicks - 1);
|
||
}
|
||
if (this.min == null) {
|
||
rmin = rmax - this.tickInterval*(this.numberTicks - 1);
|
||
}
|
||
|
||
// get precision of interval and determine a format string.
|
||
var sf = $.jqplot.getSignificantFigures(this.tickInterval);
|
||
|
||
var fstr;
|
||
|
||
// if we have only a whole number, use integer formatting
|
||
if (sf.digitsLeft >= sf.significantDigits) {
|
||
fstr = '%d';
|
||
}
|
||
|
||
else {
|
||
var temp = Math.max(0, 5 - sf.digitsLeft);
|
||
temp = Math.min(temp, sf.digitsRight);
|
||
fstr = '%.'+ temp + 'f';
|
||
}
|
||
|
||
|
||
this._autoFormatString = fstr;
|
||
|
||
this.min = rmin;
|
||
this.max = rmax;
|
||
}
|
||
|
||
if (this.renderer.constructor == $.jqplot.LinearAxisRenderer && this._autoFormatString == '') {
|
||
// fix for misleading tick display with small range and low precision.
|
||
range = this.max - this.min;
|
||
// figure out precision
|
||
var temptick = new this.tickRenderer(this.tickOptions);
|
||
// use the tick formatString or, the default.
|
||
var fs = temptick.formatString || $.jqplot.config.defaultTickFormatString;
|
||
var fs = fs.match($.jqplot.sprintf.regex)[0];
|
||
var precision = 0;
|
||
if (fs) {
|
||
if (fs.search(/[fFeEgGpP]/) > -1) {
|
||
var m = fs.match(/\%\.(\d{0,})?[eEfFgGpP]/);
|
||
if (m) {
|
||
precision = parseInt(m[1], 10);
|
||
}
|
||
else {
|
||
precision = 6;
|
||
}
|
||
}
|
||
else if (fs.search(/[di]/) > -1) {
|
||
precision = 0;
|
||
}
|
||
// fact will be <= 1;
|
||
var fact = Math.pow(10, -precision);
|
||
if (this.tickInterval < fact) {
|
||
// need to correct underrange
|
||
if (userNT == null && userTI == null) {
|
||
this.tickInterval = fact;
|
||
if (userMax == null && userMin == null) {
|
||
// this.min = Math.floor((this._dataBounds.min - this.tickInterval)/fact) * fact;
|
||
this.min = Math.floor(this._dataBounds.min/fact) * fact;
|
||
if (this.min == this._dataBounds.min) {
|
||
this.min = this._dataBounds.min - this.tickInterval;
|
||
}
|
||
// this.max = Math.ceil((this._dataBounds.max + this.tickInterval)/fact) * fact;
|
||
this.max = Math.ceil(this._dataBounds.max/fact) * fact;
|
||
if (this.max == this._dataBounds.max) {
|
||
this.max = this._dataBounds.max + this.tickInterval;
|
||
}
|
||
var n = (this.max - this.min)/this.tickInterval;
|
||
n = n.toFixed(11);
|
||
n = Math.ceil(n);
|
||
this.numberTicks = n + 1;
|
||
}
|
||
else if (userMax == null) {
|
||
// add one tick for top of range.
|
||
var n = (this._dataBounds.max - this.min) / this.tickInterval;
|
||
n = n.toFixed(11);
|
||
this.numberTicks = Math.ceil(n) + 2;
|
||
this.max = this.min + this.tickInterval * (this.numberTicks-1);
|
||
}
|
||
else if (userMin == null) {
|
||
// add one tick for bottom of range.
|
||
var n = (this.max - this._dataBounds.min) / this.tickInterval;
|
||
n = n.toFixed(11);
|
||
this.numberTicks = Math.ceil(n) + 2;
|
||
this.min = this.max - this.tickInterval * (this.numberTicks-1);
|
||
}
|
||
else {
|
||
// calculate a number of ticks so max is within axis scale
|
||
this.numberTicks = Math.ceil((userMax - userMin)/this.tickInterval) + 1;
|
||
// if user's min and max don't fit evenly in ticks, adjust.
|
||
// This takes care of cases such as user min set to 0, max set to 3.5 but tick
|
||
// format string set to %d (integer ticks)
|
||
this.min = Math.floor(userMin*Math.pow(10, precision))/Math.pow(10, precision);
|
||
this.max = Math.ceil(userMax*Math.pow(10, precision))/Math.pow(10, precision);
|
||
// this.max = this.min + this.tickInterval*(this.numberTicks-1);
|
||
this.numberTicks = Math.ceil((this.max - this.min)/this.tickInterval) + 1;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
if (this._overrideFormatString && this._autoFormatString != '') {
|
||
this.tickOptions = this.tickOptions || {};
|
||
this.tickOptions.formatString = this._autoFormatString;
|
||
}
|
||
|
||
var t, to;
|
||
for (var i=0; i<this.numberTicks; i++){
|
||
tt = this.min + i * this.tickInterval;
|
||
t = new this.tickRenderer(this.tickOptions);
|
||
// var t = new $.jqplot.AxisTickRenderer(this.tickOptions);
|
||
|
||
t.setTick(tt, this.name);
|
||
this._ticks.push(t);
|
||
|
||
if (i < this.numberTicks - 1) {
|
||
for (var j=0; j<this.minorTicks; j++) {
|
||
tt += this.tickInterval/(this.minorTicks+1);
|
||
to = $.extend(true, {}, this.tickOptions, {name:this.name, value:tt, label:'', isMinorTick:true});
|
||
t = new this.tickRenderer(to);
|
||
this._ticks.push(t);
|
||
}
|
||
}
|
||
t = null;
|
||
}
|
||
}
|
||
|
||
if (this.tickInset) {
|
||
this.min = this.min - this.tickInset * this.tickInterval;
|
||
this.max = this.max + this.tickInset * this.tickInterval;
|
||
}
|
||
|
||
ticks = null;
|
||
};
|
||
|
||
// Used to reset just the values of the ticks and then repack, which will
|
||
// recalculate the positioning functions. It is assuemd that the
|
||
// number of ticks is the same and the values of the new array are at the
|
||
// proper interval.
|
||
// This method needs to be called with the scope of an axis object, like:
|
||
//
|
||
// > plot.axes.yaxis.renderer.resetTickValues.call(plot.axes.yaxis, yarr);
|
||
//
|
||
$.jqplot.LinearAxisRenderer.prototype.resetTickValues = function(opts) {
|
||
if ($.isArray(opts) && opts.length == this._ticks.length) {
|
||
var t;
|
||
for (var i=0; i<opts.length; i++) {
|
||
t = this._ticks[i];
|
||
t.value = opts[i];
|
||
t.label = t.formatter(t.formatString, opts[i]);
|
||
t.label = t.prefix + t.label;
|
||
t._elem.html(t.label);
|
||
}
|
||
t = null;
|
||
this.min = $.jqplot.arrayMin(opts);
|
||
this.max = $.jqplot.arrayMax(opts);
|
||
this.pack();
|
||
}
|
||
// Not implemented yet.
|
||
// else if ($.isPlainObject(opts)) {
|
||
//
|
||
// }
|
||
};
|
||
|
||
// called with scope of axis
|
||
$.jqplot.LinearAxisRenderer.prototype.pack = function(pos, offsets) {
|
||
// Add defaults for repacking from resetTickValues function.
|
||
pos = pos || {};
|
||
offsets = offsets || this._offsets;
|
||
|
||
var ticks = this._ticks;
|
||
var max = this.max;
|
||
var min = this.min;
|
||
var offmax = offsets.max;
|
||
var offmin = offsets.min;
|
||
var lshow = (this._label == null) ? false : this._label.show;
|
||
|
||
for (var p in pos) {
|
||
this._elem.css(p, pos[p]);
|
||
}
|
||
|
||
this._offsets = offsets;
|
||
// pixellength will be + for x axes and - for y axes becasue pixels always measured from top left.
|
||
var pixellength = offmax - offmin;
|
||
var unitlength = max - min;
|
||
|
||
// point to unit and unit to point conversions references to Plot DOM element top left corner.
|
||
if (this.breakPoints) {
|
||
unitlength = unitlength - this.breakPoints[1] + this.breakPoints[0];
|
||
|
||
this.p2u = function(p){
|
||
return (p - offmin) * unitlength / pixellength + min;
|
||
};
|
||
|
||
this.u2p = function(u){
|
||
if (u > this.breakPoints[0] && u < this.breakPoints[1]){
|
||
u = this.breakPoints[0];
|
||
}
|
||
if (u <= this.breakPoints[0]) {
|
||
return (u - min) * pixellength / unitlength + offmin;
|
||
}
|
||
else {
|
||
return (u - this.breakPoints[1] + this.breakPoints[0] - min) * pixellength / unitlength + offmin;
|
||
}
|
||
};
|
||
|
||
if (this.name.charAt(0) == 'x'){
|
||
this.series_u2p = function(u){
|
||
if (u > this.breakPoints[0] && u < this.breakPoints[1]){
|
||
u = this.breakPoints[0];
|
||
}
|
||
if (u <= this.breakPoints[0]) {
|
||
return (u - min) * pixellength / unitlength;
|
||
}
|
||
else {
|
||
return (u - this.breakPoints[1] + this.breakPoints[0] - min) * pixellength / unitlength;
|
||
}
|
||
};
|
||
this.series_p2u = function(p){
|
||
return p * unitlength / pixellength + min;
|
||
};
|
||
}
|
||
|
||
else {
|
||
this.series_u2p = function(u){
|
||
if (u > this.breakPoints[0] && u < this.breakPoints[1]){
|
||
u = this.breakPoints[0];
|
||
}
|
||
if (u >= this.breakPoints[1]) {
|
||
return (u - max) * pixellength / unitlength;
|
||
}
|
||
else {
|
||
return (u + this.breakPoints[1] - this.breakPoints[0] - max) * pixellength / unitlength;
|
||
}
|
||
};
|
||
this.series_p2u = function(p){
|
||
return p * unitlength / pixellength + max;
|
||
};
|
||
}
|
||
}
|
||
else {
|
||
this.p2u = function(p){
|
||
return (p - offmin) * unitlength / pixellength + min;
|
||
};
|
||
|
||
this.u2p = function(u){
|
||
return (u - min) * pixellength / unitlength + offmin;
|
||
};
|
||
|
||
if (this.name == 'xaxis' || this.name == 'x2axis'){
|
||
this.series_u2p = function(u){
|
||
return (u - min) * pixellength / unitlength;
|
||
};
|
||
this.series_p2u = function(p){
|
||
return p * unitlength / pixellength + min;
|
||
};
|
||
}
|
||
|
||
else {
|
||
this.series_u2p = function(u){
|
||
return (u - max) * pixellength / unitlength;
|
||
};
|
||
this.series_p2u = function(p){
|
||
return p * unitlength / pixellength + max;
|
||
};
|
||
}
|
||
}
|
||
|
||
if (this.show) {
|
||
if (this.name == 'xaxis' || this.name == 'x2axis') {
|
||
for (var i=0; i<ticks.length; i++) {
|
||
var t = ticks[i];
|
||
if (t.show && t.showLabel) {
|
||
var shim;
|
||
|
||
if (t.constructor == $.jqplot.CanvasAxisTickRenderer && t.angle) {
|
||
// will need to adjust auto positioning based on which axis this is.
|
||
var temp = (this.name == 'xaxis') ? 1 : -1;
|
||
switch (t.labelPosition) {
|
||
case 'auto':
|
||
// position at end
|
||
if (temp * t.angle < 0) {
|
||
shim = -t.getWidth() + t._textRenderer.height * Math.sin(-t._textRenderer.angle) / 2;
|
||
}
|
||
// position at start
|
||
else {
|
||
shim = -t._textRenderer.height * Math.sin(t._textRenderer.angle) / 2;
|
||
}
|
||
break;
|
||
case 'end':
|
||
shim = -t.getWidth() + t._textRenderer.height * Math.sin(-t._textRenderer.angle) / 2;
|
||
break;
|
||
case 'start':
|
||
shim = -t._textRenderer.height * Math.sin(t._textRenderer.angle) / 2;
|
||
break;
|
||
case 'middle':
|
||
shim = -t.getWidth()/2 + t._textRenderer.height * Math.sin(-t._textRenderer.angle) / 2;
|
||
break;
|
||
default:
|
||
shim = -t.getWidth()/2 + t._textRenderer.height * Math.sin(-t._textRenderer.angle) / 2;
|
||
break;
|
||
}
|
||
}
|
||
else {
|
||
shim = -t.getWidth()/2;
|
||
}
|
||
var val = this.u2p(t.value) + shim + 'px';
|
||
t._elem.css('left', val);
|
||
t.pack();
|
||
}
|
||
}
|
||
if (lshow) {
|
||
var w = this._label._elem.outerWidth(true);
|
||
this._label._elem.css('left', offmin + pixellength/2 - w/2 + 'px');
|
||
if (this.name == 'xaxis') {
|
||
this._label._elem.css('bottom', '0px');
|
||
}
|
||
else {
|
||
this._label._elem.css('top', '0px');
|
||
}
|
||
this._label.pack();
|
||
}
|
||
}
|
||
else {
|
||
for (var i=0; i<ticks.length; i++) {
|
||
var t = ticks[i];
|
||
if (t.show && t.showLabel) {
|
||
var shim;
|
||
if (t.constructor == $.jqplot.CanvasAxisTickRenderer && t.angle) {
|
||
// will need to adjust auto positioning based on which axis this is.
|
||
var temp = (this.name == 'yaxis') ? 1 : -1;
|
||
switch (t.labelPosition) {
|
||
case 'auto':
|
||
// position at end
|
||
case 'end':
|
||
if (temp * t.angle < 0) {
|
||
shim = -t._textRenderer.height * Math.cos(-t._textRenderer.angle) / 2;
|
||
}
|
||
else {
|
||
shim = -t.getHeight() + t._textRenderer.height * Math.cos(t._textRenderer.angle) / 2;
|
||
}
|
||
break;
|
||
case 'start':
|
||
if (t.angle > 0) {
|
||
shim = -t._textRenderer.height * Math.cos(-t._textRenderer.angle) / 2;
|
||
}
|
||
else {
|
||
shim = -t.getHeight() + t._textRenderer.height * Math.cos(t._textRenderer.angle) / 2;
|
||
}
|
||
break;
|
||
case 'middle':
|
||
// if (t.angle > 0) {
|
||
// shim = -t.getHeight()/2 + t._textRenderer.height * Math.sin(-t._textRenderer.angle) / 2;
|
||
// }
|
||
// else {
|
||
// shim = -t.getHeight()/2 - t._textRenderer.height * Math.sin(t._textRenderer.angle) / 2;
|
||
// }
|
||
shim = -t.getHeight()/2;
|
||
break;
|
||
default:
|
||
shim = -t.getHeight()/2;
|
||
break;
|
||
}
|
||
}
|
||
else {
|
||
shim = -t.getHeight()/2;
|
||
}
|
||
|
||
var val = this.u2p(t.value) + shim + 'px';
|
||
t._elem.css('top', val);
|
||
t.pack();
|
||
}
|
||
}
|
||
if (lshow) {
|
||
var h = this._label._elem.outerHeight(true);
|
||
this._label._elem.css('top', offmax - pixellength/2 - h/2 + 'px');
|
||
if (this.name == 'yaxis') {
|
||
this._label._elem.css('left', '0px');
|
||
}
|
||
else {
|
||
this._label._elem.css('right', '0px');
|
||
}
|
||
this._label.pack();
|
||
}
|
||
}
|
||
}
|
||
|
||
ticks = null;
|
||
};
|
||
|
||
|
||
/**
|
||
* The following code was generaously given to me a while back by Scott Prahl.
|
||
* He did a good job at computing axes min, max and number of ticks for the
|
||
* case where the user has not set any scale related parameters (tickInterval,
|
||
* numberTicks, min or max). I had ignored this use case for a long time,
|
||
* focusing on the more difficult case where user has set some option controlling
|
||
* tick generation. Anyway, about time I got this into jqPlot.
|
||
* Thanks Scott!!
|
||
*/
|
||
|
||
/**
|
||
* Copyright (c) 2010 Scott Prahl
|
||
* The next three routines are currently available for use in all personal
|
||
* or commercial projects under both the MIT and GPL version 2.0 licenses.
|
||
* This means that you can choose the license that best suits your project
|
||
* and use it accordingly.
|
||
*/
|
||
|
||
// A good format string depends on the interval. If the interval is greater
|
||
// than 1 then there is no need to show any decimal digits. If it is < 1.0, then
|
||
// use the magnitude of the interval to determine the number of digits to show.
|
||
function bestFormatString (interval)
|
||
{
|
||
var fstr;
|
||
interval = Math.abs(interval);
|
||
if (interval >= 10) {
|
||
fstr = '%d';
|
||
}
|
||
|
||
else if (interval > 1) {
|
||
if (interval === parseInt(interval)) {
|
||
fstr = '%d';
|
||
}
|
||
else {
|
||
fstr = '%.1f';
|
||
}
|
||
}
|
||
|
||
else {
|
||
var expv = -Math.floor(Math.log(interval)/Math.LN10);
|
||
fstr = '%.' + expv + 'f';
|
||
}
|
||
|
||
return fstr;
|
||
}
|
||
|
||
var _factors = [0.1, 0.2, 0.3, 0.4, 0.5, 0.8, 1, 2, 3, 4, 5];
|
||
|
||
var _getLowerFactor = function(f) {
|
||
var i = _factors.indexOf(f);
|
||
if (i > 0) {
|
||
return _factors[i-1];
|
||
}
|
||
else {
|
||
return _factors[_factors.length - 1] / 100;
|
||
}
|
||
};
|
||
|
||
var _getHigherFactor = function(f) {
|
||
var i = _factors.indexOf(f);
|
||
if (i < _factors.length-1) {
|
||
return _factors[i+1];
|
||
}
|
||
else {
|
||
return _factors[0] * 100;
|
||
}
|
||
};
|
||
|
||
// This will return an interval of form 2 * 10^n, 5 * 10^n or 10 * 10^n
|
||
// it is based soley on the range and number of ticks. So if user specifies
|
||
// number of ticks, use this.
|
||
function bestInterval(range, numberTicks) {
|
||
var minimum = range / (numberTicks - 1);
|
||
var magnitude = Math.pow(10, Math.floor(Math.log(minimum) / Math.LN10));
|
||
var residual = minimum / magnitude;
|
||
var interval;
|
||
// "nicest" ranges are 1, 2, 5 or powers of these.
|
||
// for magnitudes below 1, only allow these.
|
||
if (magnitude < 1) {
|
||
if (residual > 5) {
|
||
interval = 10 * magnitude;
|
||
}
|
||
else if (residual > 2) {
|
||
interval = 5 * magnitude;
|
||
}
|
||
else if (residual > 1) {
|
||
interval = 2 * magnitude;
|
||
}
|
||
else {
|
||
interval = magnitude;
|
||
}
|
||
}
|
||
// for large ranges (whole integers), allow intervals like 3, 4 or powers of these.
|
||
// this helps a lot with poor choices for number of ticks.
|
||
else {
|
||
if (residual > 5) {
|
||
interval = 10 * magnitude;
|
||
}
|
||
else if (residual > 4) {
|
||
interval = 5 * magnitude;
|
||
}
|
||
else if (residual > 3) {
|
||
interval = 4 * magnitude;
|
||
}
|
||
else if (residual > 2) {
|
||
interval = 3 * magnitude;
|
||
}
|
||
else if (residual > 1) {
|
||
interval = 2 * magnitude;
|
||
}
|
||
else {
|
||
interval = magnitude;
|
||
}
|
||
}
|
||
|
||
return interval;
|
||
}
|
||
|
||
// This will return an interval of form 2 * 10^n, 5 * 10^n or 10 * 10^n
|
||
// it is based soley on the range of data, number of ticks must be computed later.
|
||
function bestLinearInterval(range, scalefact) {
|
||
var expv = Math.floor(Math.log(range)/Math.LN10);
|
||
var magnitude = Math.pow(10, expv);
|
||
// 0 < f < 10
|
||
var f = range / magnitude;
|
||
var fact;
|
||
// for large plots, scalefact will decrease f and increase number of ticks.
|
||
// for small plots, scalefact will increase f and decrease number of ticks.
|
||
f = f/scalefact;
|
||
|
||
// for large plots, smaller interval, more ticks.
|
||
if (f<=0.38) {
|
||
fact = 0.1;
|
||
}
|
||
else if (f<=1.6) {
|
||
fact = 0.2;
|
||
}
|
||
else if (f<=4.0) {
|
||
fact = 0.5;
|
||
}
|
||
else if (f<=8.0) {
|
||
fact = 1.0;
|
||
}
|
||
// for very small plots, larger interval, less ticks in number ticks
|
||
else if (f<=16.0) {
|
||
fact = 2;
|
||
}
|
||
else {
|
||
fact = 5;
|
||
}
|
||
|
||
return fact*magnitude;
|
||
}
|
||
|
||
function bestLinearComponents(range, scalefact) {
|
||
var expv = Math.floor(Math.log(range)/Math.LN10);
|
||
var magnitude = Math.pow(10, expv);
|
||
// 0 < f < 10
|
||
var f = range / magnitude;
|
||
var interval;
|
||
var fact;
|
||
// for large plots, scalefact will decrease f and increase number of ticks.
|
||
// for small plots, scalefact will increase f and decrease number of ticks.
|
||
f = f/scalefact;
|
||
|
||
// for large plots, smaller interval, more ticks.
|
||
if (f<=0.38) {
|
||
fact = 0.1;
|
||
}
|
||
else if (f<=1.6) {
|
||
fact = 0.2;
|
||
}
|
||
else if (f<=4.0) {
|
||
fact = 0.5;
|
||
}
|
||
else if (f<=8.0) {
|
||
fact = 1.0;
|
||
}
|
||
// for very small plots, larger interval, less ticks in number ticks
|
||
else if (f<=16.0) {
|
||
fact = 2;
|
||
}
|
||
// else if (f<=20.0) {
|
||
// fact = 3;
|
||
// }
|
||
// else if (f<=24.0) {
|
||
// fact = 4;
|
||
// }
|
||
else {
|
||
fact = 5;
|
||
}
|
||
|
||
interval = fact * magnitude;
|
||
|
||
return [interval, fact, magnitude];
|
||
}
|
||
|
||
// Given the min and max for a dataset, return suitable endpoints
|
||
// for the graphing, a good number for the number of ticks, and a
|
||
// format string so that extraneous digits are not displayed.
|
||
// returned is an array containing [min, max, nTicks, format]
|
||
$.jqplot.LinearTickGenerator = function(axis_min, axis_max, scalefact, numberTicks) {
|
||
// if endpoints are equal try to include zero otherwise include one
|
||
if (axis_min === axis_max) {
|
||
axis_max = (axis_max) ? 0 : 1;
|
||
}
|
||
|
||
scalefact = scalefact || 1.0;
|
||
|
||
// make sure range is positive
|
||
if (axis_max < axis_min) {
|
||
var a = axis_max;
|
||
axis_max = axis_min;
|
||
axis_min = a;
|
||
}
|
||
|
||
var r = [];
|
||
var ss = bestLinearInterval(axis_max - axis_min, scalefact);
|
||
|
||
if (numberTicks == null) {
|
||
|
||
// Figure out the axis min, max and number of ticks
|
||
// the min and max will be some multiple of the tick interval,
|
||
// 1*10^n, 2*10^n or 5*10^n. This gaurantees that, if the
|
||
// axis min is negative, 0 will be a tick.
|
||
r[0] = Math.floor(axis_min / ss) * ss; // min
|
||
r[1] = Math.ceil(axis_max / ss) * ss; // max
|
||
r[2] = Math.round((r[1]-r[0])/ss+1.0); // number of ticks
|
||
r[3] = bestFormatString(ss); // format string
|
||
r[4] = ss; // tick Interval
|
||
}
|
||
|
||
else {
|
||
var tempr = [];
|
||
|
||
// Figure out the axis min, max and number of ticks
|
||
// the min and max will be some multiple of the tick interval,
|
||
// 1*10^n, 2*10^n or 5*10^n. This gaurantees that, if the
|
||
// axis min is negative, 0 will be a tick.
|
||
tempr[0] = Math.floor(axis_min / ss) * ss; // min
|
||
tempr[1] = Math.ceil(axis_max / ss) * ss; // max
|
||
tempr[2] = Math.round((tempr[1]-tempr[0])/ss+1.0); // number of ticks
|
||
tempr[3] = bestFormatString(ss); // format string
|
||
tempr[4] = ss; // tick Interval
|
||
|
||
// first, see if we happen to get the right number of ticks
|
||
if (tempr[2] === numberTicks) {
|
||
r = tempr;
|
||
}
|
||
|
||
else {
|
||
|
||
var newti = bestInterval(tempr[1] - tempr[0], numberTicks);
|
||
|
||
r[0] = tempr[0];
|
||
r[2] = numberTicks;
|
||
r[4] = newti;
|
||
r[3] = bestFormatString(newti);
|
||
r[1] = r[0] + (r[2] - 1) * r[4]; // max
|
||
}
|
||
}
|
||
|
||
return r;
|
||
};
|
||
|
||
$.jqplot.LinearTickGenerator.bestLinearInterval = bestLinearInterval;
|
||
$.jqplot.LinearTickGenerator.bestInterval = bestInterval;
|
||
$.jqplot.LinearTickGenerator.bestLinearComponents = bestLinearComponents;
|
||
|
||
|
||
// class: $.jqplot.MarkerRenderer
|
||
// The default jqPlot marker renderer, rendering the points on the line.
|
||
$.jqplot.MarkerRenderer = function(options){
|
||
// Group: Properties
|
||
|
||
// prop: show
|
||
// wether or not to show the marker.
|
||
this.show = true;
|
||
// prop: style
|
||
// One of diamond, circle, square, x, plus, dash, filledDiamond, filledCircle, filledSquare
|
||
this.style = 'filledCircle';
|
||
// prop: lineWidth
|
||
// size of the line for non-filled markers.
|
||
this.lineWidth = 2;
|
||
// prop: size
|
||
// Size of the marker (diameter or circle, length of edge of square, etc.)
|
||
this.size = 9.0;
|
||
// prop: color
|
||
// color of marker. Will be set to color of series by default on init.
|
||
this.color = '#666666';
|
||
// prop: shadow
|
||
// wether or not to draw a shadow on the line
|
||
this.shadow = true;
|
||
// prop: shadowAngle
|
||
// Shadow angle in degrees
|
||
this.shadowAngle = 45;
|
||
// prop: shadowOffset
|
||
// Shadow offset from line in pixels
|
||
this.shadowOffset = 1;
|
||
// prop: shadowDepth
|
||
// Number of times shadow is stroked, each stroke offset shadowOffset from the last.
|
||
this.shadowDepth = 3;
|
||
// prop: shadowAlpha
|
||
// Alpha channel transparency of shadow. 0 = transparent.
|
||
this.shadowAlpha = '0.07';
|
||
// prop: shadowRenderer
|
||
// Renderer that will draws the shadows on the marker.
|
||
this.shadowRenderer = new $.jqplot.ShadowRenderer();
|
||
// prop: shapeRenderer
|
||
// Renderer that will draw the marker.
|
||
this.shapeRenderer = new $.jqplot.ShapeRenderer();
|
||
|
||
$.extend(true, this, options);
|
||
};
|
||
|
||
$.jqplot.MarkerRenderer.prototype.init = function(options) {
|
||
$.extend(true, this, options);
|
||
var sdopt = {angle:this.shadowAngle, offset:this.shadowOffset, alpha:this.shadowAlpha, lineWidth:this.lineWidth, depth:this.shadowDepth, closePath:true};
|
||
if (this.style.indexOf('filled') != -1) {
|
||
sdopt.fill = true;
|
||
}
|
||
if (this.style.indexOf('ircle') != -1) {
|
||
sdopt.isarc = true;
|
||
sdopt.closePath = false;
|
||
}
|
||
this.shadowRenderer.init(sdopt);
|
||
|
||
var shopt = {fill:false, isarc:false, strokeStyle:this.color, fillStyle:this.color, lineWidth:this.lineWidth, closePath:true};
|
||
if (this.style.indexOf('filled') != -1) {
|
||
shopt.fill = true;
|
||
}
|
||
if (this.style.indexOf('ircle') != -1) {
|
||
shopt.isarc = true;
|
||
shopt.closePath = false;
|
||
}
|
||
this.shapeRenderer.init(shopt);
|
||
};
|
||
|
||
$.jqplot.MarkerRenderer.prototype.drawDiamond = function(x, y, ctx, fill, options) {
|
||
var stretch = 1.2;
|
||
var dx = this.size/2/stretch;
|
||
var dy = this.size/2*stretch;
|
||
var points = [[x-dx, y], [x, y+dy], [x+dx, y], [x, y-dy]];
|
||
if (this.shadow) {
|
||
this.shadowRenderer.draw(ctx, points);
|
||
}
|
||
this.shapeRenderer.draw(ctx, points, options);
|
||
};
|
||
|
||
$.jqplot.MarkerRenderer.prototype.drawPlus = function(x, y, ctx, fill, options) {
|
||
var stretch = 1.0;
|
||
var dx = this.size/2*stretch;
|
||
var dy = this.size/2*stretch;
|
||
var points1 = [[x, y-dy], [x, y+dy]];
|
||
var points2 = [[x+dx, y], [x-dx, y]];
|
||
var opts = $.extend(true, {}, this.options, {closePath:false});
|
||
if (this.shadow) {
|
||
this.shadowRenderer.draw(ctx, points1, {closePath:false});
|
||
this.shadowRenderer.draw(ctx, points2, {closePath:false});
|
||
}
|
||
this.shapeRenderer.draw(ctx, points1, opts);
|
||
this.shapeRenderer.draw(ctx, points2, opts);
|
||
};
|
||
|
||
$.jqplot.MarkerRenderer.prototype.drawX = function(x, y, ctx, fill, options) {
|
||
var stretch = 1.0;
|
||
var dx = this.size/2*stretch;
|
||
var dy = this.size/2*stretch;
|
||
var opts = $.extend(true, {}, this.options, {closePath:false});
|
||
var points1 = [[x-dx, y-dy], [x+dx, y+dy]];
|
||
var points2 = [[x-dx, y+dy], [x+dx, y-dy]];
|
||
if (this.shadow) {
|
||
this.shadowRenderer.draw(ctx, points1, {closePath:false});
|
||
this.shadowRenderer.draw(ctx, points2, {closePath:false});
|
||
}
|
||
this.shapeRenderer.draw(ctx, points1, opts);
|
||
this.shapeRenderer.draw(ctx, points2, opts);
|
||
};
|
||
|
||
$.jqplot.MarkerRenderer.prototype.drawDash = function(x, y, ctx, fill, options) {
|
||
var stretch = 1.0;
|
||
var dx = this.size/2*stretch;
|
||
var dy = this.size/2*stretch;
|
||
var points = [[x-dx, y], [x+dx, y]];
|
||
if (this.shadow) {
|
||
this.shadowRenderer.draw(ctx, points);
|
||
}
|
||
this.shapeRenderer.draw(ctx, points, options);
|
||
};
|
||
|
||
$.jqplot.MarkerRenderer.prototype.drawLine = function(p1, p2, ctx, fill, options) {
|
||
var points = [p1, p2];
|
||
if (this.shadow) {
|
||
this.shadowRenderer.draw(ctx, points);
|
||
}
|
||
this.shapeRenderer.draw(ctx, points, options);
|
||
};
|
||
|
||
$.jqplot.MarkerRenderer.prototype.drawSquare = function(x, y, ctx, fill, options) {
|
||
var stretch = 1.0;
|
||
var dx = this.size/2/stretch;
|
||
var dy = this.size/2*stretch;
|
||
var points = [[x-dx, y-dy], [x-dx, y+dy], [x+dx, y+dy], [x+dx, y-dy]];
|
||
if (this.shadow) {
|
||
this.shadowRenderer.draw(ctx, points);
|
||
}
|
||
this.shapeRenderer.draw(ctx, points, options);
|
||
};
|
||
|
||
$.jqplot.MarkerRenderer.prototype.drawCircle = function(x, y, ctx, fill, options) {
|
||
var radius = this.size/2;
|
||
var end = 2*Math.PI;
|
||
var points = [x, y, radius, 0, end, true];
|
||
if (this.shadow) {
|
||
this.shadowRenderer.draw(ctx, points);
|
||
}
|
||
this.shapeRenderer.draw(ctx, points, options);
|
||
};
|
||
|
||
$.jqplot.MarkerRenderer.prototype.draw = function(x, y, ctx, options) {
|
||
options = options || {};
|
||
// hack here b/c shape renderer uses canvas based color style options
|
||
// and marker uses css style names.
|
||
if (options.show == null || options.show != false) {
|
||
if (options.color && !options.fillStyle) {
|
||
options.fillStyle = options.color;
|
||
}
|
||
if (options.color && !options.strokeStyle) {
|
||
options.strokeStyle = options.color;
|
||
}
|
||
switch (this.style) {
|
||
case 'diamond':
|
||
this.drawDiamond(x,y,ctx, false, options);
|
||
break;
|
||
case 'filledDiamond':
|
||
this.drawDiamond(x,y,ctx, true, options);
|
||
break;
|
||
case 'circle':
|
||
this.drawCircle(x,y,ctx, false, options);
|
||
break;
|
||
case 'filledCircle':
|
||
this.drawCircle(x,y,ctx, true, options);
|
||
break;
|
||
case 'square':
|
||
this.drawSquare(x,y,ctx, false, options);
|
||
break;
|
||
case 'filledSquare':
|
||
this.drawSquare(x,y,ctx, true, options);
|
||
break;
|
||
case 'x':
|
||
this.drawX(x,y,ctx, true, options);
|
||
break;
|
||
case 'plus':
|
||
this.drawPlus(x,y,ctx, true, options);
|
||
break;
|
||
case 'dash':
|
||
this.drawDash(x,y,ctx, true, options);
|
||
break;
|
||
case 'line':
|
||
this.drawLine(x, y, ctx, false, options);
|
||
break;
|
||
default:
|
||
this.drawDiamond(x,y,ctx, false, options);
|
||
break;
|
||
}
|
||
}
|
||
};
|
||
|
||
// class: $.jqplot.shadowRenderer
|
||
// The default jqPlot shadow renderer, rendering shadows behind shapes.
|
||
$.jqplot.ShadowRenderer = function(options){
|
||
// Group: Properties
|
||
|
||
// prop: angle
|
||
// Angle of the shadow in degrees. Measured counter-clockwise from the x axis.
|
||
this.angle = 45;
|
||
// prop: offset
|
||
// Pixel offset at the given shadow angle of each shadow stroke from the last stroke.
|
||
this.offset = 1;
|
||
// prop: alpha
|
||
// alpha transparency of shadow stroke.
|
||
this.alpha = 0.07;
|
||
// prop: lineWidth
|
||
// width of the shadow line stroke.
|
||
this.lineWidth = 1.5;
|
||
// prop: lineJoin
|
||
// How line segments of the shadow are joined.
|
||
this.lineJoin = 'miter';
|
||
// prop: lineCap
|
||
// how ends of the shadow line are rendered.
|
||
this.lineCap = 'round';
|
||
// prop; closePath
|
||
// whether line path segment is closed upon itself.
|
||
this.closePath = false;
|
||
// prop: fill
|
||
// whether to fill the shape.
|
||
this.fill = false;
|
||
// prop: depth
|
||
// how many times the shadow is stroked. Each stroke will be offset by offset at angle degrees.
|
||
this.depth = 3;
|
||
this.strokeStyle = 'rgba(0,0,0,0.1)';
|
||
// prop: isarc
|
||
// wether the shadow is an arc or not.
|
||
this.isarc = false;
|
||
|
||
$.extend(true, this, options);
|
||
};
|
||
|
||
$.jqplot.ShadowRenderer.prototype.init = function(options) {
|
||
$.extend(true, this, options);
|
||
};
|
||
|
||
// function: draw
|
||
// draws an transparent black (i.e. gray) shadow.
|
||
//
|
||
// ctx - canvas drawing context
|
||
// points - array of points or [x, y, radius, start angle (rad), end angle (rad)]
|
||
$.jqplot.ShadowRenderer.prototype.draw = function(ctx, points, options) {
|
||
ctx.save();
|
||
var opts = (options != null) ? options : {};
|
||
var fill = (opts.fill != null) ? opts.fill : this.fill;
|
||
var fillRect = (opts.fillRect != null) ? opts.fillRect : this.fillRect;
|
||
var closePath = (opts.closePath != null) ? opts.closePath : this.closePath;
|
||
var offset = (opts.offset != null) ? opts.offset : this.offset;
|
||
var alpha = (opts.alpha != null) ? opts.alpha : this.alpha;
|
||
var depth = (opts.depth != null) ? opts.depth : this.depth;
|
||
var isarc = (opts.isarc != null) ? opts.isarc : this.isarc;
|
||
var linePattern = (opts.linePattern != null) ? opts.linePattern : this.linePattern;
|
||
ctx.lineWidth = (opts.lineWidth != null) ? opts.lineWidth : this.lineWidth;
|
||
ctx.lineJoin = (opts.lineJoin != null) ? opts.lineJoin : this.lineJoin;
|
||
ctx.lineCap = (opts.lineCap != null) ? opts.lineCap : this.lineCap;
|
||
ctx.strokeStyle = opts.strokeStyle || this.strokeStyle || 'rgba(0,0,0,'+alpha+')';
|
||
ctx.fillStyle = opts.fillStyle || this.fillStyle || 'rgba(0,0,0,'+alpha+')';
|
||
for (var j=0; j<depth; j++) {
|
||
var ctxPattern = $.jqplot.LinePattern(ctx, linePattern);
|
||
ctx.translate(Math.cos(this.angle*Math.PI/180)*offset, Math.sin(this.angle*Math.PI/180)*offset);
|
||
ctxPattern.beginPath();
|
||
if (isarc) {
|
||
ctx.arc(points[0], points[1], points[2], points[3], points[4], true);
|
||
}
|
||
else if (fillRect) {
|
||
if (fillRect) {
|
||
ctx.fillRect(points[0], points[1], points[2], points[3]);
|
||
}
|
||
}
|
||
else if (points && points.length){
|
||
var move = true;
|
||
for (var i=0; i<points.length; i++) {
|
||
// skip to the first non-null point and move to it.
|
||
if (points[i][0] != null && points[i][1] != null) {
|
||
if (move) {
|
||
ctxPattern.moveTo(points[i][0], points[i][1]);
|
||
move = false;
|
||
}
|
||
else {
|
||
ctxPattern.lineTo(points[i][0], points[i][1]);
|
||
}
|
||
}
|
||
else {
|
||
move = true;
|
||
}
|
||
}
|
||
|
||
}
|
||
if (closePath) {
|
||
ctxPattern.closePath();
|
||
}
|
||
if (fill) {
|
||
ctx.fill();
|
||
}
|
||
else {
|
||
ctx.stroke();
|
||
}
|
||
}
|
||
ctx.restore();
|
||
};
|
||
|
||
// class: $.jqplot.shapeRenderer
|
||
// The default jqPlot shape renderer. Given a set of points will
|
||
// plot them and either stroke a line (fill = false) or fill them (fill = true).
|
||
// If a filled shape is desired, closePath = true must also be set to close
|
||
// the shape.
|
||
$.jqplot.ShapeRenderer = function(options){
|
||
|
||
this.lineWidth = 1.5;
|
||
// prop: linePattern
|
||
// line pattern 'dashed', 'dotted', 'solid', some combination
|
||
// of '-' and '.' characters such as '.-.' or a numerical array like
|
||
// [draw, skip, draw, skip, ...] such as [1, 10] to draw a dotted line,
|
||
// [1, 10, 20, 10] to draw a dot-dash line, and so on.
|
||
this.linePattern = 'solid';
|
||
// prop: lineJoin
|
||
// How line segments of the shadow are joined.
|
||
this.lineJoin = 'miter';
|
||
// prop: lineCap
|
||
// how ends of the shadow line are rendered.
|
||
this.lineCap = 'round';
|
||
// prop; closePath
|
||
// whether line path segment is closed upon itself.
|
||
this.closePath = false;
|
||
// prop: fill
|
||
// whether to fill the shape.
|
||
this.fill = false;
|
||
// prop: isarc
|
||
// wether the shadow is an arc or not.
|
||
this.isarc = false;
|
||
// prop: fillRect
|
||
// true to draw shape as a filled rectangle.
|
||
this.fillRect = false;
|
||
// prop: strokeRect
|
||
// true to draw shape as a stroked rectangle.
|
||
this.strokeRect = false;
|
||
// prop: clearRect
|
||
// true to cear a rectangle.
|
||
this.clearRect = false;
|
||
// prop: strokeStyle
|
||
// css color spec for the stoke style
|
||
this.strokeStyle = '#999999';
|
||
// prop: fillStyle
|
||
// css color spec for the fill style.
|
||
this.fillStyle = '#999999';
|
||
|
||
$.extend(true, this, options);
|
||
};
|
||
|
||
$.jqplot.ShapeRenderer.prototype.init = function(options) {
|
||
$.extend(true, this, options);
|
||
};
|
||
|
||
// function: draw
|
||
// draws the shape.
|
||
//
|
||
// ctx - canvas drawing context
|
||
// points - array of points for shapes or
|
||
// [x, y, width, height] for rectangles or
|
||
// [x, y, radius, start angle (rad), end angle (rad)] for circles and arcs.
|
||
$.jqplot.ShapeRenderer.prototype.draw = function(ctx, points, options) {
|
||
ctx.save();
|
||
var opts = (options != null) ? options : {};
|
||
var fill = (opts.fill != null) ? opts.fill : this.fill;
|
||
var closePath = (opts.closePath != null) ? opts.closePath : this.closePath;
|
||
var fillRect = (opts.fillRect != null) ? opts.fillRect : this.fillRect;
|
||
var strokeRect = (opts.strokeRect != null) ? opts.strokeRect : this.strokeRect;
|
||
var clearRect = (opts.clearRect != null) ? opts.clearRect : this.clearRect;
|
||
var isarc = (opts.isarc != null) ? opts.isarc : this.isarc;
|
||
var linePattern = (opts.linePattern != null) ? opts.linePattern : this.linePattern;
|
||
var ctxPattern = $.jqplot.LinePattern(ctx, linePattern);
|
||
ctx.lineWidth = opts.lineWidth || this.lineWidth;
|
||
ctx.lineJoin = opts.lineJoin || this.lineJoin;
|
||
ctx.lineCap = opts.lineCap || this.lineCap;
|
||
ctx.strokeStyle = (opts.strokeStyle || opts.color) || this.strokeStyle;
|
||
ctx.fillStyle = opts.fillStyle || this.fillStyle;
|
||
ctx.beginPath();
|
||
if (isarc) {
|
||
ctx.arc(points[0], points[1], points[2], points[3], points[4], true);
|
||
if (closePath) {
|
||
ctx.closePath();
|
||
}
|
||
if (fill) {
|
||
ctx.fill();
|
||
}
|
||
else {
|
||
ctx.stroke();
|
||
}
|
||
ctx.restore();
|
||
return;
|
||
}
|
||
else if (clearRect) {
|
||
ctx.clearRect(points[0], points[1], points[2], points[3]);
|
||
ctx.restore();
|
||
return;
|
||
}
|
||
else if (fillRect || strokeRect) {
|
||
if (fillRect) {
|
||
ctx.fillRect(points[0], points[1], points[2], points[3]);
|
||
}
|
||
if (strokeRect) {
|
||
ctx.strokeRect(points[0], points[1], points[2], points[3]);
|
||
ctx.restore();
|
||
return;
|
||
}
|
||
}
|
||
else if (points && points.length){
|
||
var move = true;
|
||
for (var i=0; i<points.length; i++) {
|
||
// skip to the first non-null point and move to it.
|
||
if (points[i][0] != null && points[i][1] != null) {
|
||
if (move) {
|
||
ctxPattern.moveTo(points[i][0], points[i][1]);
|
||
move = false;
|
||
}
|
||
else {
|
||
ctxPattern.lineTo(points[i][0], points[i][1]);
|
||
}
|
||
}
|
||
else {
|
||
move = true;
|
||
}
|
||
}
|
||
if (closePath) {
|
||
ctxPattern.closePath();
|
||
}
|
||
if (fill) {
|
||
ctx.fill();
|
||
}
|
||
else {
|
||
ctx.stroke();
|
||
}
|
||
}
|
||
ctx.restore();
|
||
};
|
||
|
||
// class $.jqplot.TableLegendRenderer
|
||
// The default legend renderer for jqPlot.
|
||
$.jqplot.TableLegendRenderer = function(){
|
||
//
|
||
};
|
||
|
||
$.jqplot.TableLegendRenderer.prototype.init = function(options) {
|
||
$.extend(true, this, options);
|
||
};
|
||
|
||
$.jqplot.TableLegendRenderer.prototype.addrow = function (label, color, pad, reverse) {
|
||
var rs = (pad) ? this.rowSpacing+'px' : '0px';
|
||
var tr;
|
||
var td;
|
||
var elem;
|
||
var div0;
|
||
var div1;
|
||
elem = document.createElement('tr');
|
||
tr = $(elem);
|
||
tr.addClass('jqplot-table-legend');
|
||
elem = null;
|
||
|
||
if (reverse){
|
||
tr.prependTo(this._elem);
|
||
}
|
||
|
||
else{
|
||
tr.appendTo(this._elem);
|
||
}
|
||
|
||
if (this.showSwatches) {
|
||
td = $(document.createElement('td'));
|
||
td.addClass('jqplot-table-legend jqplot-table-legend-swatch');
|
||
td.css({textAlign: 'center', paddingTop: rs});
|
||
|
||
div0 = $(document.createElement('div'));
|
||
div0.addClass('jqplot-table-legend-swatch-outline');
|
||
div1 = $(document.createElement('div'));
|
||
div1.addClass('jqplot-table-legend-swatch');
|
||
div1.css({backgroundColor: color, borderColor: color});
|
||
|
||
tr.append(td.append(div0.append(div1)));
|
||
|
||
// $('<td class="jqplot-table-legend" style="text-align:center;padding-top:'+rs+';">'+
|
||
// '<div><div class="jqplot-table-legend-swatch" style="background-color:'+color+';border-color:'+color+';"></div>'+
|
||
// '</div></td>').appendTo(tr);
|
||
}
|
||
if (this.showLabels) {
|
||
td = $(document.createElement('td'));
|
||
td.addClass('jqplot-table-legend jqplot-table-legend-label');
|
||
td.css('paddingTop', rs);
|
||
tr.append(td);
|
||
|
||
// elem = $('<td class="jqplot-table-legend" style="padding-top:'+rs+';"></td>');
|
||
// elem.appendTo(tr);
|
||
if (this.escapeHtml) {
|
||
td.text(label);
|
||
}
|
||
else {
|
||
td.html(label);
|
||
}
|
||
}
|
||
td = null;
|
||
div0 = null;
|
||
div1 = null;
|
||
tr = null;
|
||
elem = null;
|
||
};
|
||
|
||
// called with scope of legend
|
||
$.jqplot.TableLegendRenderer.prototype.draw = function() {
|
||
if (this._elem) {
|
||
this._elem.emptyForce();
|
||
this._elem = null;
|
||
}
|
||
|
||
if (this.show) {
|
||
var series = this._series;
|
||
// make a table. one line label per row.
|
||
var elem = document.createElement('table');
|
||
this._elem = $(elem);
|
||
this._elem.addClass('jqplot-table-legend');
|
||
|
||
var ss = {position:'absolute'};
|
||
if (this.background) {
|
||
ss['background'] = this.background;
|
||
}
|
||
if (this.border) {
|
||
ss['border'] = this.border;
|
||
}
|
||
if (this.fontSize) {
|
||
ss['fontSize'] = this.fontSize;
|
||
}
|
||
if (this.fontFamily) {
|
||
ss['fontFamily'] = this.fontFamily;
|
||
}
|
||
if (this.textColor) {
|
||
ss['textColor'] = this.textColor;
|
||
}
|
||
if (this.marginTop != null) {
|
||
ss['marginTop'] = this.marginTop;
|
||
}
|
||
if (this.marginBottom != null) {
|
||
ss['marginBottom'] = this.marginBottom;
|
||
}
|
||
if (this.marginLeft != null) {
|
||
ss['marginLeft'] = this.marginLeft;
|
||
}
|
||
if (this.marginRight != null) {
|
||
ss['marginRight'] = this.marginRight;
|
||
}
|
||
|
||
|
||
var pad = false,
|
||
reverse = false,
|
||
s;
|
||
for (var i = 0; i< series.length; i++) {
|
||
s = series[i];
|
||
if (s._stack || s.renderer.constructor == $.jqplot.BezierCurveRenderer){
|
||
reverse = true;
|
||
}
|
||
if (s.show && s.showLabel) {
|
||
var lt = this.labels[i] || s.label.toString();
|
||
if (lt) {
|
||
var color = s.color;
|
||
if (reverse && i < series.length - 1){
|
||
pad = true;
|
||
}
|
||
else if (reverse && i == series.length - 1){
|
||
pad = false;
|
||
}
|
||
this.renderer.addrow.call(this, lt, color, pad, reverse);
|
||
pad = true;
|
||
}
|
||
// let plugins add more rows to legend. Used by trend line plugin.
|
||
for (var j=0; j<$.jqplot.addLegendRowHooks.length; j++) {
|
||
var item = $.jqplot.addLegendRowHooks[j].call(this, s);
|
||
if (item) {
|
||
this.renderer.addrow.call(this, item.label, item.color, pad);
|
||
pad = true;
|
||
}
|
||
}
|
||
lt = null;
|
||
}
|
||
}
|
||
}
|
||
return this._elem;
|
||
};
|
||
|
||
$.jqplot.TableLegendRenderer.prototype.pack = function(offsets) {
|
||
if (this.show) {
|
||
if (this.placement == 'insideGrid') {
|
||
switch (this.location) {
|
||
case 'nw':
|
||
var a = offsets.left;
|
||
var b = offsets.top;
|
||
this._elem.css('left', a);
|
||
this._elem.css('top', b);
|
||
break;
|
||
case 'n':
|
||
var a = (offsets.left + (this._plotDimensions.width - offsets.right))/2 - this.getWidth()/2;
|
||
var b = offsets.top;
|
||
this._elem.css('left', a);
|
||
this._elem.css('top', b);
|
||
break;
|
||
case 'ne':
|
||
var a = offsets.right;
|
||
var b = offsets.top;
|
||
this._elem.css({right:a, top:b});
|
||
break;
|
||
case 'e':
|
||
var a = offsets.right;
|
||
var b = (offsets.top + (this._plotDimensions.height - offsets.bottom))/2 - this.getHeight()/2;
|
||
this._elem.css({right:a, top:b});
|
||
break;
|
||
case 'se':
|
||
var a = offsets.right;
|
||
var b = offsets.bottom;
|
||
this._elem.css({right:a, bottom:b});
|
||
break;
|
||
case 's':
|
||
var a = (offsets.left + (this._plotDimensions.width - offsets.right))/2 - this.getWidth()/2;
|
||
var b = offsets.bottom;
|
||
this._elem.css({left:a, bottom:b});
|
||
break;
|
||
case 'sw':
|
||
var a = offsets.left;
|
||
var b = offsets.bottom;
|
||
this._elem.css({left:a, bottom:b});
|
||
break;
|
||
case 'w':
|
||
var a = offsets.left;
|
||
var b = (offsets.top + (this._plotDimensions.height - offsets.bottom))/2 - this.getHeight()/2;
|
||
this._elem.css({left:a, top:b});
|
||
break;
|
||
default: // same as 'se'
|
||
var a = offsets.right;
|
||
var b = offsets.bottom;
|
||
this._elem.css({right:a, bottom:b});
|
||
break;
|
||
}
|
||
|
||
}
|
||
else if (this.placement == 'outside'){
|
||
switch (this.location) {
|
||
case 'nw':
|
||
var a = this._plotDimensions.width - offsets.left;
|
||
var b = offsets.top;
|
||
this._elem.css('right', a);
|
||
this._elem.css('top', b);
|
||
break;
|
||
case 'n':
|
||
var a = (offsets.left + (this._plotDimensions.width - offsets.right))/2 - this.getWidth()/2;
|
||
var b = this._plotDimensions.height - offsets.top;
|
||
this._elem.css('left', a);
|
||
this._elem.css('bottom', b);
|
||
break;
|
||
case 'ne':
|
||
var a = this._plotDimensions.width - offsets.right;
|
||
var b = offsets.top;
|
||
this._elem.css({left:a, top:b});
|
||
break;
|
||
case 'e':
|
||
var a = this._plotDimensions.width - offsets.right;
|
||
var b = (offsets.top + (this._plotDimensions.height - offsets.bottom))/2 - this.getHeight()/2;
|
||
this._elem.css({left:a, top:b});
|
||
break;
|
||
case 'se':
|
||
var a = this._plotDimensions.width - offsets.right;
|
||
var b = offsets.bottom;
|
||
this._elem.css({left:a, bottom:b});
|
||
break;
|
||
case 's':
|
||
var a = (offsets.left + (this._plotDimensions.width - offsets.right))/2 - this.getWidth()/2;
|
||
var b = this._plotDimensions.height - offsets.bottom;
|
||
this._elem.css({left:a, top:b});
|
||
break;
|
||
case 'sw':
|
||
var a = this._plotDimensions.width - offsets.left;
|
||
var b = offsets.bottom;
|
||
this._elem.css({right:a, bottom:b});
|
||
break;
|
||
case 'w':
|
||
var a = this._plotDimensions.width - offsets.left;
|
||
var b = (offsets.top + (this._plotDimensions.height - offsets.bottom))/2 - this.getHeight()/2;
|
||
this._elem.css({right:a, top:b});
|
||
break;
|
||
default: // same as 'se'
|
||
var a = offsets.right;
|
||
var b = offsets.bottom;
|
||
this._elem.css({right:a, bottom:b});
|
||
break;
|
||
}
|
||
}
|
||
else {
|
||
switch (this.location) {
|
||
case 'nw':
|
||
this._elem.css({left:0, top:offsets.top});
|
||
break;
|
||
case 'n':
|
||
var a = (offsets.left + (this._plotDimensions.width - offsets.right))/2 - this.getWidth()/2;
|
||
this._elem.css({left: a, top:offsets.top});
|
||
break;
|
||
case 'ne':
|
||
this._elem.css({right:0, top:offsets.top});
|
||
break;
|
||
case 'e':
|
||
var b = (offsets.top + (this._plotDimensions.height - offsets.bottom))/2 - this.getHeight()/2;
|
||
this._elem.css({right:offsets.right, top:b});
|
||
break;
|
||
case 'se':
|
||
this._elem.css({right:offsets.right, bottom:offsets.bottom});
|
||
break;
|
||
case 's':
|
||
var a = (offsets.left + (this._plotDimensions.width - offsets.right))/2 - this.getWidth()/2;
|
||
this._elem.css({left: a, bottom:offsets.bottom});
|
||
break;
|
||
case 'sw':
|
||
this._elem.css({left:offsets.left, bottom:offsets.bottom});
|
||
break;
|
||
case 'w':
|
||
var b = (offsets.top + (this._plotDimensions.height - offsets.bottom))/2 - this.getHeight()/2;
|
||
this._elem.css({left:offsets.left, top:b});
|
||
break;
|
||
default: // same as 'se'
|
||
this._elem.css({right:offsets.right, bottom:offsets.bottom});
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
};
|
||
|
||
/**
|
||
* Class: $.jqplot.ThemeEngine
|
||
* Theme Engine provides a programatic way to change some of the more
|
||
* common jqplot styling options such as fonts, colors and grid options.
|
||
* A theme engine instance is created with each plot. The theme engine
|
||
* manages a collection of themes which can be modified, added to, or
|
||
* applied to the plot.
|
||
*
|
||
* The themeEngine class is not instantiated directly.
|
||
* When a plot is initialized, the current plot options are scanned
|
||
* an a default theme named "Default" is created. This theme is
|
||
* used as the basis for other themes added to the theme engine and
|
||
* is always available.
|
||
*
|
||
* A theme is a simple javascript object with styling parameters for
|
||
* various entities of the plot. A theme has the form:
|
||
*
|
||
*
|
||
* > {
|
||
* > _name:f "Default",
|
||
* > target: {
|
||
* > backgroundColor: "transparent"
|
||
* > },
|
||
* > legend: {
|
||
* > textColor: null,
|
||
* > fontFamily: null,
|
||
* > fontSize: null,
|
||
* > border: null,
|
||
* > background: null
|
||
* > },
|
||
* > title: {
|
||
* > textColor: "rgb(102, 102, 102)",
|
||
* > fontFamily: "'Trebuchet MS',Arial,Helvetica,sans-serif",
|
||
* > fontSize: "19.2px",
|
||
* > textAlign: "center"
|
||
* > },
|
||
* > seriesStyles: {},
|
||
* > series: [{
|
||
* > color: "#4bb2c5",
|
||
* > lineWidth: 2.5,
|
||
* > linePattern: "solid",
|
||
* > shadow: true,
|
||
* > fillColor: "#4bb2c5",
|
||
* > showMarker: true,
|
||
* > markerOptions: {
|
||
* > color: "#4bb2c5",
|
||
* > show: true,
|
||
* > style: 'filledCircle',
|
||
* > lineWidth: 1.5,
|
||
* > size: 4,
|
||
* > shadow: true
|
||
* > }
|
||
* > }],
|
||
* > grid: {
|
||
* > drawGridlines: true,
|
||
* > gridLineColor: "#cccccc",
|
||
* > gridLineWidth: 1,
|
||
* > backgroundColor: "#fffdf6",
|
||
* > borderColor: "#999999",
|
||
* > borderWidth: 2,
|
||
* > shadow: true
|
||
* > },
|
||
* > axesStyles: {
|
||
* > label: {},
|
||
* > ticks: {}
|
||
* > },
|
||
* > axes: {
|
||
* > xaxis: {
|
||
* > borderColor: "#999999",
|
||
* > borderWidth: 2,
|
||
* > ticks: {
|
||
* > show: true,
|
||
* > showGridline: true,
|
||
* > showLabel: true,
|
||
* > showMark: true,
|
||
* > size: 4,
|
||
* > textColor: "",
|
||
* > whiteSpace: "nowrap",
|
||
* > fontSize: "12px",
|
||
* > fontFamily: "'Trebuchet MS',Arial,Helvetica,sans-serif"
|
||
* > },
|
||
* > label: {
|
||
* > textColor: "rgb(102, 102, 102)",
|
||
* > whiteSpace: "normal",
|
||
* > fontSize: "14.6667px",
|
||
* > fontFamily: "'Trebuchet MS',Arial,Helvetica,sans-serif",
|
||
* > fontWeight: "400"
|
||
* > }
|
||
* > },
|
||
* > yaxis: {
|
||
* > borderColor: "#999999",
|
||
* > borderWidth: 2,
|
||
* > ticks: {
|
||
* > show: true,
|
||
* > showGridline: true,
|
||
* > showLabel: true,
|
||
* > showMark: true,
|
||
* > size: 4,
|
||
* > textColor: "",
|
||
* > whiteSpace: "nowrap",
|
||
* > fontSize: "12px",
|
||
* > fontFamily: "'Trebuchet MS',Arial,Helvetica,sans-serif"
|
||
* > },
|
||
* > label: {
|
||
* > textColor: null,
|
||
* > whiteSpace: null,
|
||
* > fontSize: null,
|
||
* > fontFamily: null,
|
||
* > fontWeight: null
|
||
* > }
|
||
* > },
|
||
* > x2axis: {...
|
||
* > },
|
||
* > ...
|
||
* > y9axis: {...
|
||
* > }
|
||
* > }
|
||
* > }
|
||
*
|
||
* "seriesStyles" is a style object that will be applied to all series in the plot.
|
||
* It will forcibly override any styles applied on the individual series. "axesStyles" is
|
||
* a style object that will be applied to all axes in the plot. It will also forcibly
|
||
* override any styles on the individual axes.
|
||
*
|
||
* The example shown above has series options for a line series. Options for other
|
||
* series types are shown below:
|
||
*
|
||
* Bar Series:
|
||
*
|
||
* > {
|
||
* > color: "#4bb2c5",
|
||
* > seriesColors: ["#4bb2c5", "#EAA228", "#c5b47f", "#579575", "#839557", "#958c12", "#953579", "#4b5de4", "#d8b83f", "#ff5800", "#0085cc", "#c747a3", "#cddf54", "#FBD178", "#26B4E3", "#bd70c7"],
|
||
* > lineWidth: 2.5,
|
||
* > shadow: true,
|
||
* > barPadding: 2,
|
||
* > barMargin: 10,
|
||
* > barWidth: 15.09375,
|
||
* > highlightColors: ["rgb(129,201,214)", "rgb(129,201,214)", "rgb(129,201,214)", "rgb(129,201,214)", "rgb(129,201,214)", "rgb(129,201,214)", "rgb(129,201,214)", "rgb(129,201,214)"]
|
||
* > }
|
||
*
|
||
* Pie Series:
|
||
*
|
||
* > {
|
||
* > seriesColors: ["#4bb2c5", "#EAA228", "#c5b47f", "#579575", "#839557", "#958c12", "#953579", "#4b5de4", "#d8b83f", "#ff5800", "#0085cc", "#c747a3", "#cddf54", "#FBD178", "#26B4E3", "#bd70c7"],
|
||
* > padding: 20,
|
||
* > sliceMargin: 0,
|
||
* > fill: true,
|
||
* > shadow: true,
|
||
* > startAngle: 0,
|
||
* > lineWidth: 2.5,
|
||
* > highlightColors: ["rgb(129,201,214)", "rgb(240,189,104)", "rgb(214,202,165)", "rgb(137,180,158)", "rgb(168,180,137)", "rgb(180,174,89)", "rgb(180,113,161)", "rgb(129,141,236)", "rgb(227,205,120)", "rgb(255,138,76)", "rgb(76,169,219)", "rgb(215,126,190)", "rgb(220,232,135)", "rgb(200,167,96)", "rgb(103,202,235)", "rgb(208,154,215)"]
|
||
* > }
|
||
*
|
||
* Funnel Series:
|
||
*
|
||
* > {
|
||
* > color: "#4bb2c5",
|
||
* > lineWidth: 2,
|
||
* > shadow: true,
|
||
* > padding: {
|
||
* > top: 20,
|
||
* > right: 20,
|
||
* > bottom: 20,
|
||
* > left: 20
|
||
* > },
|
||
* > sectionMargin: 6,
|
||
* > seriesColors: ["#4bb2c5", "#EAA228", "#c5b47f", "#579575", "#839557", "#958c12", "#953579", "#4b5de4", "#d8b83f", "#ff5800", "#0085cc", "#c747a3", "#cddf54", "#FBD178", "#26B4E3", "#bd70c7"],
|
||
* > highlightColors: ["rgb(147,208,220)", "rgb(242,199,126)", "rgb(220,210,178)", "rgb(154,191,172)", "rgb(180,191,154)", "rgb(191,186,112)", "rgb(191,133,174)", "rgb(147,157,238)", "rgb(231,212,139)", "rgb(255,154,102)", "rgb(102,181,224)", "rgb(221,144,199)", "rgb(225,235,152)", "rgb(200,167,96)", "rgb(124,210,238)", "rgb(215,169,221)"]
|
||
* > }
|
||
*
|
||
*/
|
||
$.jqplot.ThemeEngine = function(){
|
||
// Group: Properties
|
||
//
|
||
// prop: themes
|
||
// hash of themes managed by the theme engine.
|
||
// Indexed by theme name.
|
||
this.themes = {};
|
||
// prop: activeTheme
|
||
// Pointer to currently active theme
|
||
this.activeTheme=null;
|
||
|
||
};
|
||
|
||
// called with scope of plot
|
||
$.jqplot.ThemeEngine.prototype.init = function() {
|
||
// get the Default theme from the current plot settings.
|
||
var th = new $.jqplot.Theme({_name:'Default'});
|
||
var n, i, nn;
|
||
|
||
for (n in th.target) {
|
||
if (n == "textColor") {
|
||
th.target[n] = this.target.css('color');
|
||
}
|
||
else {
|
||
th.target[n] = this.target.css(n);
|
||
}
|
||
}
|
||
|
||
if (this.title.show && this.title._elem) {
|
||
for (n in th.title) {
|
||
if (n == "textColor") {
|
||
th.title[n] = this.title._elem.css('color');
|
||
}
|
||
else {
|
||
th.title[n] = this.title._elem.css(n);
|
||
}
|
||
}
|
||
}
|
||
|
||
for (n in th.grid) {
|
||
th.grid[n] = this.grid[n];
|
||
}
|
||
if (th.grid.backgroundColor == null && this.grid.background != null) {
|
||
th.grid.backgroundColor = this.grid.background;
|
||
}
|
||
if (this.legend.show && this.legend._elem) {
|
||
for (n in th.legend) {
|
||
if (n == 'textColor') {
|
||
th.legend[n] = this.legend._elem.css('color');
|
||
}
|
||
else {
|
||
th.legend[n] = this.legend._elem.css(n);
|
||
}
|
||
}
|
||
}
|
||
var s;
|
||
|
||
for (i=0; i<this.series.length; i++) {
|
||
s = this.series[i];
|
||
if (s.renderer.constructor == $.jqplot.LineRenderer) {
|
||
th.series.push(new LineSeriesProperties());
|
||
}
|
||
else if (s.renderer.constructor == $.jqplot.BarRenderer) {
|
||
th.series.push(new BarSeriesProperties());
|
||
}
|
||
else if (s.renderer.constructor == $.jqplot.PieRenderer) {
|
||
th.series.push(new PieSeriesProperties());
|
||
}
|
||
else if (s.renderer.constructor == $.jqplot.DonutRenderer) {
|
||
th.series.push(new DonutSeriesProperties());
|
||
}
|
||
else if (s.renderer.constructor == $.jqplot.FunnelRenderer) {
|
||
th.series.push(new FunnelSeriesProperties());
|
||
}
|
||
else if (s.renderer.constructor == $.jqplot.MeterGaugeRenderer) {
|
||
th.series.push(new MeterSeriesProperties());
|
||
}
|
||
else {
|
||
th.series.push({});
|
||
}
|
||
for (n in th.series[i]) {
|
||
th.series[i][n] = s[n];
|
||
}
|
||
}
|
||
var a, ax;
|
||
for (n in this.axes) {
|
||
ax = this.axes[n];
|
||
a = th.axes[n] = new AxisProperties();
|
||
a.borderColor = ax.borderColor;
|
||
a.borderWidth = ax.borderWidth;
|
||
if (ax._ticks && ax._ticks[0]) {
|
||
for (nn in a.ticks) {
|
||
if (ax._ticks[0].hasOwnProperty(nn)) {
|
||
a.ticks[nn] = ax._ticks[0][nn];
|
||
}
|
||
else if (ax._ticks[0]._elem){
|
||
a.ticks[nn] = ax._ticks[0]._elem.css(nn);
|
||
}
|
||
}
|
||
}
|
||
if (ax._label && ax._label.show) {
|
||
for (nn in a.label) {
|
||
// a.label[nn] = ax._label._elem.css(nn);
|
||
if (ax._label[nn]) {
|
||
a.label[nn] = ax._label[nn];
|
||
}
|
||
else if (ax._label._elem){
|
||
if (nn == 'textColor') {
|
||
a.label[nn] = ax._label._elem.css('color');
|
||
}
|
||
else {
|
||
a.label[nn] = ax._label._elem.css(nn);
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
this.themeEngine._add(th);
|
||
this.themeEngine.activeTheme = this.themeEngine.themes[th._name];
|
||
};
|
||
/**
|
||
* Group: methods
|
||
*
|
||
* method: get
|
||
*
|
||
* Get and return the named theme or the active theme if no name given.
|
||
*
|
||
* parameter:
|
||
*
|
||
* name - name of theme to get.
|
||
*
|
||
* returns:
|
||
*
|
||
* Theme instance of given name.
|
||
*/
|
||
$.jqplot.ThemeEngine.prototype.get = function(name) {
|
||
if (!name) {
|
||
// return the active theme
|
||
return this.activeTheme;
|
||
}
|
||
else {
|
||
return this.themes[name];
|
||
}
|
||
};
|
||
|
||
function numericalOrder(a,b) { return a-b; }
|
||
|
||
/**
|
||
* method: getThemeNames
|
||
*
|
||
* Return the list of theme names in this manager in alpha-numerical order.
|
||
*
|
||
* parameter:
|
||
*
|
||
* None
|
||
*
|
||
* returns:
|
||
*
|
||
* A the list of theme names in this manager in alpha-numerical order.
|
||
*/
|
||
$.jqplot.ThemeEngine.prototype.getThemeNames = function() {
|
||
var tn = [];
|
||
for (var n in this.themes) {
|
||
tn.push(n);
|
||
}
|
||
return tn.sort(numericalOrder);
|
||
};
|
||
|
||
/**
|
||
* method: getThemes
|
||
*
|
||
* Return a list of themes in alpha-numerical order by name.
|
||
*
|
||
* parameter:
|
||
*
|
||
* None
|
||
*
|
||
* returns:
|
||
*
|
||
* A list of themes in alpha-numerical order by name.
|
||
*/
|
||
$.jqplot.ThemeEngine.prototype.getThemes = function() {
|
||
var tn = [];
|
||
var themes = [];
|
||
for (var n in this.themes) {
|
||
tn.push(n);
|
||
}
|
||
tn.sort(numericalOrder);
|
||
for (var i=0; i<tn.length; i++) {
|
||
themes.push(this.themes[tn[i]]);
|
||
}
|
||
return themes;
|
||
};
|
||
|
||
$.jqplot.ThemeEngine.prototype.activate = function(plot, name) {
|
||
// sometimes need to redraw whole plot.
|
||
var redrawPlot = false;
|
||
if (!name && this.activeTheme && this.activeTheme._name) {
|
||
name = this.activeTheme._name;
|
||
}
|
||
if (!this.themes.hasOwnProperty(name)) {
|
||
throw new Error("No theme of that name");
|
||
}
|
||
else {
|
||
var th = this.themes[name];
|
||
this.activeTheme = th;
|
||
var val, checkBorderColor = false, checkBorderWidth = false;
|
||
var arr = ['xaxis', 'x2axis', 'yaxis', 'y2axis'];
|
||
|
||
for (i=0; i<arr.length; i++) {
|
||
var ax = arr[i];
|
||
if (th.axesStyles.borderColor != null) {
|
||
plot.axes[ax].borderColor = th.axesStyles.borderColor;
|
||
}
|
||
if (th.axesStyles.borderWidth != null) {
|
||
plot.axes[ax].borderWidth = th.axesStyles.borderWidth;
|
||
}
|
||
}
|
||
|
||
for (var axname in plot.axes) {
|
||
var axis = plot.axes[axname];
|
||
if (axis.show) {
|
||
var thaxis = th.axes[axname] || {};
|
||
var thaxstyle = th.axesStyles;
|
||
var thax = $.jqplot.extend(true, {}, thaxis, thaxstyle);
|
||
val = (th.axesStyles.borderColor != null) ? th.axesStyles.borderColor : thax.borderColor;
|
||
if (thax.borderColor != null) {
|
||
axis.borderColor = thax.borderColor;
|
||
redrawPlot = true;
|
||
}
|
||
val = (th.axesStyles.borderWidth != null) ? th.axesStyles.borderWidth : thax.borderWidth;
|
||
if (thax.borderWidth != null) {
|
||
axis.borderWidth = thax.borderWidth;
|
||
redrawPlot = true;
|
||
}
|
||
if (axis._ticks && axis._ticks[0]) {
|
||
for (var nn in thax.ticks) {
|
||
// val = null;
|
||
// if (th.axesStyles.ticks && th.axesStyles.ticks[nn] != null) {
|
||
// val = th.axesStyles.ticks[nn];
|
||
// }
|
||
// else if (thax.ticks[nn] != null){
|
||
// val = thax.ticks[nn]
|
||
// }
|
||
val = thax.ticks[nn];
|
||
if (val != null) {
|
||
axis.tickOptions[nn] = val;
|
||
axis._ticks = [];
|
||
redrawPlot = true;
|
||
}
|
||
}
|
||
}
|
||
if (axis._label && axis._label.show) {
|
||
for (var nn in thax.label) {
|
||
// val = null;
|
||
// if (th.axesStyles.label && th.axesStyles.label[nn] != null) {
|
||
// val = th.axesStyles.label[nn];
|
||
// }
|
||
// else if (thax.label && thax.label[nn] != null){
|
||
// val = thax.label[nn]
|
||
// }
|
||
val = thax.label[nn];
|
||
if (val != null) {
|
||
axis.labelOptions[nn] = val;
|
||
redrawPlot = true;
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
for (var n in th.grid) {
|
||
if (th.grid[n] != null) {
|
||
plot.grid[n] = th.grid[n];
|
||
}
|
||
}
|
||
if (!redrawPlot) {
|
||
plot.grid.draw();
|
||
}
|
||
|
||
if (plot.legend.show) {
|
||
for (n in th.legend) {
|
||
if (th.legend[n] != null) {
|
||
plot.legend[n] = th.legend[n];
|
||
}
|
||
}
|
||
}
|
||
if (plot.title.show) {
|
||
for (n in th.title) {
|
||
if (th.title[n] != null) {
|
||
plot.title[n] = th.title[n];
|
||
}
|
||
}
|
||
}
|
||
|
||
var i;
|
||
for (i=0; i<th.series.length; i++) {
|
||
var opts = {};
|
||
var redrawSeries = false;
|
||
for (n in th.series[i]) {
|
||
val = (th.seriesStyles[n] != null) ? th.seriesStyles[n] : th.series[i][n];
|
||
if (val != null) {
|
||
opts[n] = val;
|
||
if (n == 'color') {
|
||
plot.series[i].renderer.shapeRenderer.fillStyle = val;
|
||
plot.series[i].renderer.shapeRenderer.strokeStyle = val;
|
||
plot.series[i][n] = val;
|
||
}
|
||
else if ((n == 'lineWidth') || (n == 'linePattern')) {
|
||
plot.series[i].renderer.shapeRenderer[n] = val;
|
||
plot.series[i][n] = val;
|
||
}
|
||
else if (n == 'markerOptions') {
|
||
merge (plot.series[i].markerOptions, val);
|
||
merge (plot.series[i].markerRenderer, val);
|
||
}
|
||
else {
|
||
plot.series[i][n] = val;
|
||
}
|
||
redrawPlot = true;
|
||
}
|
||
}
|
||
}
|
||
|
||
if (redrawPlot) {
|
||
plot.target.empty();
|
||
plot.draw();
|
||
}
|
||
|
||
for (n in th.target) {
|
||
if (th.target[n] != null) {
|
||
plot.target.css(n, th.target[n]);
|
||
}
|
||
}
|
||
}
|
||
|
||
};
|
||
|
||
$.jqplot.ThemeEngine.prototype._add = function(theme, name) {
|
||
if (name) {
|
||
theme._name = name;
|
||
}
|
||
if (!theme._name) {
|
||
theme._name = Date.parse(new Date());
|
||
}
|
||
if (!this.themes.hasOwnProperty(theme._name)) {
|
||
this.themes[theme._name] = theme;
|
||
}
|
||
else {
|
||
throw new Error("jqplot.ThemeEngine Error: Theme already in use");
|
||
}
|
||
};
|
||
|
||
// method remove
|
||
// Delete the named theme, return true on success, false on failure.
|
||
|
||
|
||
/**
|
||
* method: remove
|
||
*
|
||
* Remove the given theme from the themeEngine.
|
||
*
|
||
* parameters:
|
||
*
|
||
* name - name of the theme to remove.
|
||
*
|
||
* returns:
|
||
*
|
||
* true on success, false on failure.
|
||
*/
|
||
$.jqplot.ThemeEngine.prototype.remove = function(name) {
|
||
if (name == 'Default') {
|
||
return false;
|
||
}
|
||
return delete this.themes[name];
|
||
};
|
||
|
||
/**
|
||
* method: newTheme
|
||
*
|
||
* Create a new theme based on the default theme, adding it the themeEngine.
|
||
*
|
||
* parameters:
|
||
*
|
||
* name - name of the new theme.
|
||
* obj - optional object of styles to be applied to this new theme.
|
||
*
|
||
* returns:
|
||
*
|
||
* new Theme object.
|
||
*/
|
||
$.jqplot.ThemeEngine.prototype.newTheme = function(name, obj) {
|
||
if (typeof(name) == 'object') {
|
||
obj = obj || name;
|
||
name = null;
|
||
}
|
||
if (obj && obj._name) {
|
||
name = obj._name;
|
||
}
|
||
else {
|
||
name = name || Date.parse(new Date());
|
||
}
|
||
// var th = new $.jqplot.Theme(name);
|
||
var th = this.copy(this.themes['Default']._name, name);
|
||
$.jqplot.extend(th, obj);
|
||
return th;
|
||
};
|
||
|
||
// function clone(obj) {
|
||
// return eval(obj.toSource());
|
||
// }
|
||
|
||
function clone(obj){
|
||
if(obj == null || typeof(obj) != 'object'){
|
||
return obj;
|
||
}
|
||
|
||
var temp = new obj.constructor();
|
||
for(var key in obj){
|
||
temp[key] = clone(obj[key]);
|
||
}
|
||
return temp;
|
||
}
|
||
|
||
$.jqplot.clone = clone;
|
||
|
||
function merge(obj1, obj2) {
|
||
if (obj2 == null || typeof(obj2) != 'object') {
|
||
return;
|
||
}
|
||
for (var key in obj2) {
|
||
if (key == 'highlightColors') {
|
||
obj1[key] = clone(obj2[key]);
|
||
}
|
||
if (obj2[key] != null && typeof(obj2[key]) == 'object') {
|
||
if (!obj1.hasOwnProperty(key)) {
|
||
obj1[key] = {};
|
||
}
|
||
merge(obj1[key], obj2[key]);
|
||
}
|
||
else {
|
||
obj1[key] = obj2[key];
|
||
}
|
||
}
|
||
}
|
||
|
||
$.jqplot.merge = merge;
|
||
|
||
// Use the jQuery 1.3.2 extend function since behaviour in jQuery 1.4 seems problematic
|
||
$.jqplot.extend = function() {
|
||
// copy reference to target object
|
||
var target = arguments[0] || {}, i = 1, length = arguments.length, deep = false, options;
|
||
|
||
// Handle a deep copy situation
|
||
if ( typeof target === "boolean" ) {
|
||
deep = target;
|
||
target = arguments[1] || {};
|
||
// skip the boolean and the target
|
||
i = 2;
|
||
}
|
||
|
||
// Handle case when target is a string or something (possible in deep copy)
|
||
if ( typeof target !== "object" && !toString.call(target) === "[object Function]" ) {
|
||
target = {};
|
||
}
|
||
|
||
for ( ; i < length; i++ ){
|
||
// Only deal with non-null/undefined values
|
||
if ( (options = arguments[ i ]) != null ) {
|
||
// Extend the base object
|
||
for ( var name in options ) {
|
||
var src = target[ name ], copy = options[ name ];
|
||
|
||
// Prevent never-ending loop
|
||
if ( target === copy ) {
|
||
continue;
|
||
}
|
||
|
||
// Recurse if we're merging object values
|
||
if ( deep && copy && typeof copy === "object" && !copy.nodeType ) {
|
||
target[ name ] = $.jqplot.extend( deep,
|
||
// Never move original objects, clone them
|
||
src || ( copy.length != null ? [ ] : { } )
|
||
, copy );
|
||
}
|
||
// Don't bring in undefined values
|
||
else if ( copy !== undefined ) {
|
||
target[ name ] = copy;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
// Return the modified object
|
||
return target;
|
||
};
|
||
|
||
/**
|
||
* method: rename
|
||
*
|
||
* Rename a theme.
|
||
*
|
||
* parameters:
|
||
*
|
||
* oldName - current name of the theme.
|
||
* newName - desired name of the theme.
|
||
*
|
||
* returns:
|
||
*
|
||
* new Theme object.
|
||
*/
|
||
$.jqplot.ThemeEngine.prototype.rename = function (oldName, newName) {
|
||
if (oldName == 'Default' || newName == 'Default') {
|
||
throw new Error ("jqplot.ThemeEngine Error: Cannot rename from/to Default");
|
||
}
|
||
if (this.themes.hasOwnProperty(newName)) {
|
||
throw new Error ("jqplot.ThemeEngine Error: New name already in use.");
|
||
}
|
||
else if (this.themes.hasOwnProperty(oldName)) {
|
||
var th = this.copy (oldName, newName);
|
||
this.remove(oldName);
|
||
return th;
|
||
}
|
||
throw new Error("jqplot.ThemeEngine Error: Old name or new name invalid");
|
||
};
|
||
|
||
/**
|
||
* method: copy
|
||
*
|
||
* Create a copy of an existing theme in the themeEngine, adding it the themeEngine.
|
||
*
|
||
* parameters:
|
||
*
|
||
* sourceName - name of the existing theme.
|
||
* targetName - name of the copy.
|
||
* obj - optional object of style parameter to apply to the new theme.
|
||
*
|
||
* returns:
|
||
*
|
||
* new Theme object.
|
||
*/
|
||
$.jqplot.ThemeEngine.prototype.copy = function (sourceName, targetName, obj) {
|
||
if (targetName == 'Default') {
|
||
throw new Error ("jqplot.ThemeEngine Error: Cannot copy over Default theme");
|
||
}
|
||
if (!this.themes.hasOwnProperty(sourceName)) {
|
||
var s = "jqplot.ThemeEngine Error: Source name invalid";
|
||
throw new Error(s);
|
||
}
|
||
if (this.themes.hasOwnProperty(targetName)) {
|
||
var s = "jqplot.ThemeEngine Error: Target name invalid";
|
||
throw new Error(s);
|
||
}
|
||
else {
|
||
var th = clone(this.themes[sourceName]);
|
||
th._name = targetName;
|
||
$.jqplot.extend(true, th, obj);
|
||
this._add(th);
|
||
return th;
|
||
}
|
||
};
|
||
|
||
|
||
$.jqplot.Theme = function(name, obj) {
|
||
if (typeof(name) == 'object') {
|
||
obj = obj || name;
|
||
name = null;
|
||
}
|
||
name = name || Date.parse(new Date());
|
||
this._name = name;
|
||
this.target = {
|
||
backgroundColor: null
|
||
};
|
||
this.legend = {
|
||
textColor: null,
|
||
fontFamily: null,
|
||
fontSize: null,
|
||
border: null,
|
||
background: null
|
||
};
|
||
this.title = {
|
||
textColor: null,
|
||
fontFamily: null,
|
||
fontSize: null,
|
||
textAlign: null
|
||
};
|
||
this.seriesStyles = {};
|
||
this.series = [];
|
||
this.grid = {
|
||
drawGridlines: null,
|
||
gridLineColor: null,
|
||
gridLineWidth: null,
|
||
backgroundColor: null,
|
||
borderColor: null,
|
||
borderWidth: null,
|
||
shadow: null
|
||
};
|
||
this.axesStyles = {label:{}, ticks:{}};
|
||
this.axes = {};
|
||
if (typeof(obj) == 'string') {
|
||
this._name = obj;
|
||
}
|
||
else if(typeof(obj) == 'object') {
|
||
$.jqplot.extend(true, this, obj);
|
||
}
|
||
};
|
||
|
||
var AxisProperties = function() {
|
||
this.borderColor = null;
|
||
this.borderWidth = null;
|
||
this.ticks = new AxisTicks();
|
||
this.label = new AxisLabel();
|
||
};
|
||
|
||
var AxisTicks = function() {
|
||
this.show = null;
|
||
this.showGridline = null;
|
||
this.showLabel = null;
|
||
this.showMark = null;
|
||
this.size = null;
|
||
this.textColor = null;
|
||
this.whiteSpace = null;
|
||
this.fontSize = null;
|
||
this.fontFamily = null;
|
||
};
|
||
|
||
var AxisLabel = function() {
|
||
this.textColor = null;
|
||
this.whiteSpace = null;
|
||
this.fontSize = null;
|
||
this.fontFamily = null;
|
||
this.fontWeight = null;
|
||
};
|
||
|
||
var LineSeriesProperties = function() {
|
||
this.color=null;
|
||
this.lineWidth=null;
|
||
this.linePattern=null;
|
||
this.shadow=null;
|
||
this.fillColor=null;
|
||
this.showMarker=null;
|
||
this.markerOptions = new MarkerOptions();
|
||
};
|
||
|
||
var MarkerOptions = function() {
|
||
this.show = null;
|
||
this.style = null;
|
||
this.lineWidth = null;
|
||
this.size = null;
|
||
this.color = null;
|
||
this.shadow = null;
|
||
};
|
||
|
||
var BarSeriesProperties = function() {
|
||
this.color=null;
|
||
this.seriesColors=null;
|
||
this.lineWidth=null;
|
||
this.shadow=null;
|
||
this.barPadding=null;
|
||
this.barMargin=null;
|
||
this.barWidth=null;
|
||
this.highlightColors=null;
|
||
};
|
||
|
||
var PieSeriesProperties = function() {
|
||
this.seriesColors=null;
|
||
this.padding=null;
|
||
this.sliceMargin=null;
|
||
this.fill=null;
|
||
this.shadow=null;
|
||
this.startAngle=null;
|
||
this.lineWidth=null;
|
||
this.highlightColors=null;
|
||
};
|
||
|
||
var DonutSeriesProperties = function() {
|
||
this.seriesColors=null;
|
||
this.padding=null;
|
||
this.sliceMargin=null;
|
||
this.fill=null;
|
||
this.shadow=null;
|
||
this.startAngle=null;
|
||
this.lineWidth=null;
|
||
this.innerDiameter=null;
|
||
this.thickness=null;
|
||
this.ringMargin=null;
|
||
this.highlightColors=null;
|
||
};
|
||
|
||
var FunnelSeriesProperties = function() {
|
||
this.color=null;
|
||
this.lineWidth=null;
|
||
this.shadow=null;
|
||
this.padding=null;
|
||
this.sectionMargin=null;
|
||
this.seriesColors=null;
|
||
this.highlightColors=null;
|
||
};
|
||
|
||
var MeterSeriesProperties = function() {
|
||
this.padding=null;
|
||
this.backgroundColor=null;
|
||
this.ringColor=null;
|
||
this.tickColor=null;
|
||
this.ringWidth=null;
|
||
this.intervalColors=null;
|
||
this.intervalInnerRadius=null;
|
||
this.intervalOuterRadius=null;
|
||
this.hubRadius=null;
|
||
this.needleThickness=null;
|
||
this.needlePad=null;
|
||
};
|
||
|
||
|
||
|
||
|
||
$.fn.jqplotChildText = function() {
|
||
return $(this).contents().filter(function() {
|
||
return this.nodeType == 3; // Node.TEXT_NODE not defined in I7
|
||
}).text();
|
||
};
|
||
|
||
// Returns font style as abbreviation for "font" property.
|
||
$.fn.jqplotGetComputedFontStyle = function() {
|
||
var css = window.getComputedStyle ? window.getComputedStyle(this[0]) : this[0].currentStyle;
|
||
var attrs = css['font-style'] ? ['font-style', 'font-weight', 'font-size', 'font-family'] : ['fontStyle', 'fontWeight', 'fontSize', 'fontFamily'];
|
||
var style = [];
|
||
|
||
for (var i=0 ; i < attrs.length; ++i) {
|
||
var attr = String(css[attrs[i]]);
|
||
|
||
if (attr && attr != 'normal') {
|
||
style.push(attr);
|
||
}
|
||
}
|
||
return style.join(' ');
|
||
};
|
||
|
||
/**
|
||
* Namespace: $.fn
|
||
* jQuery namespace to attach functions to jQuery elements.
|
||
*
|
||
*/
|
||
|
||
$.fn.jqplotToImageCanvas = function(options) {
|
||
|
||
options = options || {};
|
||
var x_offset = (options.x_offset == null) ? 0 : options.x_offset;
|
||
var y_offset = (options.y_offset == null) ? 0 : options.y_offset;
|
||
var backgroundColor = (options.backgroundColor == null) ? 'rgb(255,255,255)' : options.backgroundColor;
|
||
|
||
if ($(this).width() == 0 || $(this).height() == 0) {
|
||
return null;
|
||
}
|
||
|
||
// excanvas and hence IE < 9 do not support toDataURL and cannot export images.
|
||
if (!$.jqplot.support_canvas) {
|
||
return null;
|
||
}
|
||
|
||
var newCanvas = document.createElement("canvas");
|
||
var h = $(this).outerHeight(true);
|
||
var w = $(this).outerWidth(true);
|
||
var offs = $(this).offset();
|
||
var plotleft = offs.left;
|
||
var plottop = offs.top;
|
||
var transx = 0, transy = 0;
|
||
|
||
// have to check if any elements are hanging outside of plot area before rendering,
|
||
// since changing width of canvas will erase canvas.
|
||
|
||
var clses = ['jqplot-table-legend', 'jqplot-xaxis-tick', 'jqplot-x2axis-tick', 'jqplot-yaxis-tick', 'jqplot-y2axis-tick', 'jqplot-y3axis-tick',
|
||
'jqplot-y4axis-tick', 'jqplot-y5axis-tick', 'jqplot-y6axis-tick', 'jqplot-y7axis-tick', 'jqplot-y8axis-tick', 'jqplot-y9axis-tick',
|
||
'jqplot-xaxis-label', 'jqplot-x2axis-label', 'jqplot-yaxis-label', 'jqplot-y2axis-label', 'jqplot-y3axis-label', 'jqplot-y4axis-label',
|
||
'jqplot-y5axis-label', 'jqplot-y6axis-label', 'jqplot-y7axis-label', 'jqplot-y8axis-label', 'jqplot-y9axis-label' ];
|
||
|
||
var temptop, templeft, tempbottom, tempright;
|
||
|
||
for (var i in clses) {
|
||
$(this).find('.'+clses[i]).each(function() {
|
||
temptop = $(this).offset().top - plottop;
|
||
templeft = $(this).offset().left - plotleft;
|
||
tempright = templeft + $(this).outerWidth(true) + transx;
|
||
tempbottom = temptop + $(this).outerHeight(true) + transy;
|
||
if (templeft < -transx) {
|
||
w = w - transx - templeft;
|
||
transx = -templeft;
|
||
}
|
||
if (temptop < -transy) {
|
||
h = h - transy - temptop;
|
||
transy = - temptop;
|
||
}
|
||
if (tempright > w) {
|
||
w = tempright;
|
||
}
|
||
if (tempbottom > h) {
|
||
h = tempbottom;
|
||
}
|
||
});
|
||
}
|
||
|
||
newCanvas.width = w + Number(x_offset);
|
||
newCanvas.height = h + Number(y_offset);
|
||
|
||
var newContext = newCanvas.getContext("2d");
|
||
|
||
newContext.save();
|
||
newContext.fillStyle = backgroundColor;
|
||
newContext.fillRect(0,0, newCanvas.width, newCanvas.height);
|
||
newContext.restore();
|
||
|
||
newContext.translate(transx, transy);
|
||
newContext.textAlign = 'left';
|
||
newContext.textBaseline = 'top';
|
||
|
||
function getLineheight(el) {
|
||
var lineheight = parseInt($(el).css('line-height'));
|
||
|
||
if (isNaN(lineheight)) {
|
||
lineheight = parseInt($(el).css('font-size')) * 1.2;
|
||
}
|
||
return lineheight;
|
||
}
|
||
|
||
function writeWrappedText (el, context, text, left, top, canvasWidth) {
|
||
var lineheight = getLineheight(el);
|
||
var tagwidth = $(el).innerWidth();
|
||
var tagheight = $(el).innerHeight();
|
||
var words = text.split(/\s+/);
|
||
var wl = words.length;
|
||
var w = '';
|
||
var breaks = [];
|
||
var temptop = top;
|
||
var templeft = left;
|
||
|
||
for (var i=0; i<wl; i++) {
|
||
w += words[i];
|
||
if (context.measureText(w).width > tagwidth) {
|
||
breaks.push(i);
|
||
w = '';
|
||
}
|
||
}
|
||
if (breaks.length === 0) {
|
||
// center text if necessary
|
||
if ($(el).css('textAlign') === 'center') {
|
||
templeft = left + (canvasWidth - context.measureText(w).width)/2 - transx;
|
||
}
|
||
context.fillText(text, templeft, top);
|
||
}
|
||
else {
|
||
w = words.slice(0, breaks[0]).join(' ');
|
||
// center text if necessary
|
||
if ($(el).css('textAlign') === 'center') {
|
||
templeft = left + (canvasWidth - context.measureText(w).width)/2 - transx;
|
||
}
|
||
context.fillText(w, templeft, temptop);
|
||
temptop += lineheight;
|
||
for (var i=1, l=breaks.length; i<l; i++) {
|
||
w = words.slice(breaks[i-1], breaks[i]).join(' ');
|
||
// center text if necessary
|
||
if ($(el).css('textAlign') === 'center') {
|
||
templeft = left + (canvasWidth - context.measureText(w).width)/2 - transx;
|
||
}
|
||
context.fillText(w, templeft, temptop);
|
||
temptop += lineheight;
|
||
}
|
||
w = words.slice(breaks[i-1], words.length).join(' ');
|
||
// center text if necessary
|
||
if ($(el).css('textAlign') === 'center') {
|
||
templeft = left + (canvasWidth - context.measureText(w).width)/2 - transx;
|
||
}
|
||
context.fillText(w, templeft, temptop);
|
||
}
|
||
|
||
}
|
||
|
||
function _jqpToImage(el, x_offset, y_offset) {
|
||
var tagname = el.tagName.toLowerCase();
|
||
var p = $(el).position();
|
||
var css = window.getComputedStyle ? window.getComputedStyle(el) : el.currentStyle; // for IE < 9
|
||
var left = x_offset + p.left + parseInt(css.marginLeft) + parseInt(css.borderLeftWidth) + parseInt(css.paddingLeft);
|
||
var top = y_offset + p.top + parseInt(css.marginTop) + parseInt(css.borderTopWidth)+ parseInt(css.paddingTop);
|
||
var w = newCanvas.width;
|
||
// var left = x_offset + p.left + $(el).css('marginLeft') + $(el).css('borderLeftWidth')
|
||
|
||
if ((tagname == 'div' || tagname == 'span') && !$(el).hasClass('jqplot-highlighter-tooltip')) {
|
||
$(el).children().each(function() {
|
||
_jqpToImage(this, left, top);
|
||
});
|
||
var text = $(el).jqplotChildText();
|
||
|
||
if (text) {
|
||
newContext.font = $(el).jqplotGetComputedFontStyle();
|
||
newContext.fillStyle = $(el).css('color');
|
||
|
||
writeWrappedText(el, newContext, text, left, top, w);
|
||
}
|
||
}
|
||
|
||
// handle the standard table legend
|
||
|
||
else if (tagname === 'table' && $(el).hasClass('jqplot-table-legend')) {
|
||
newContext.strokeStyle = $(el).css('border-top-color');
|
||
newContext.fillStyle = $(el).css('background-color');
|
||
newContext.fillRect(left, top, $(el).innerWidth(), $(el).innerHeight());
|
||
if (parseInt($(el).css('border-top-width')) > 0) {
|
||
newContext.strokeRect(left, top, $(el).innerWidth(), $(el).innerHeight());
|
||
}
|
||
|
||
// find all the swatches
|
||
$(el).find('div.jqplot-table-legend-swatch-outline').each(function() {
|
||
// get the first div and stroke it
|
||
var elem = $(this);
|
||
newContext.strokeStyle = elem.css('border-top-color');
|
||
var l = left + elem.position().left;
|
||
var t = top + elem.position().top;
|
||
newContext.strokeRect(l, t, elem.innerWidth(), elem.innerHeight());
|
||
|
||
// now fill the swatch
|
||
|
||
l += parseInt(elem.css('padding-left'));
|
||
t += parseInt(elem.css('padding-top'));
|
||
var h = elem.innerHeight() - 2 * parseInt(elem.css('padding-top'));
|
||
var w = elem.innerWidth() - 2 * parseInt(elem.css('padding-left'));
|
||
|
||
var swatch = elem.children('div.jqplot-table-legend-swatch');
|
||
newContext.fillStyle = swatch.css('background-color');
|
||
newContext.fillRect(l, t, w, h);
|
||
});
|
||
|
||
// now add text
|
||
|
||
$(el).find('td.jqplot-table-legend-label').each(function(){
|
||
var elem = $(this);
|
||
var l = left + elem.position().left;
|
||
var t = top + elem.position().top + parseInt(elem.css('padding-top'));
|
||
newContext.font = elem.jqplotGetComputedFontStyle();
|
||
newContext.fillStyle = elem.css('color');
|
||
newContext.fillText(elem.text(), l, t);
|
||
});
|
||
|
||
var elem = null;
|
||
}
|
||
|
||
else if (tagname == 'canvas') {
|
||
newContext.drawImage(el, left, top);
|
||
}
|
||
}
|
||
$(this).children().each(function() {
|
||
_jqpToImage(this, x_offset, y_offset);
|
||
});
|
||
return newCanvas;
|
||
};
|
||
|
||
$.fn.jqplotToImageStr = function(options) {
|
||
var imgCanvas = $(this).jqplotToImageCanvas(options);
|
||
if (imgCanvas) {
|
||
return imgCanvas.toDataURL("image/png");
|
||
}
|
||
else {
|
||
return null;
|
||
}
|
||
};
|
||
|
||
// create an <img> element and return it.
|
||
// Should work on canvas supporting browsers.
|
||
$.fn.jqplotToImageElem = function(options) {
|
||
var elem = document.createElement("img");
|
||
var str = $(this).jqplotToImageStr(options);
|
||
elem.src = str;
|
||
return elem;
|
||
};
|
||
|
||
// create an <img> element and return it.
|
||
// Should work on canvas supporting browsers.
|
||
$.fn.jqplotToImageElemStr = function(options) {
|
||
var str = '<img src='+$(this).jqplotToImageStr(options)+' />';
|
||
return str;
|
||
};
|
||
|
||
// Not gauranteed to work, even on canvas supporting browsers due to
|
||
// limitations with location.href and browser support.
|
||
$.fn.jqplotSaveImage = function() {
|
||
var imgData = $(this).jqplotToImageStr({});
|
||
if (imgData) {
|
||
window.location.href = imgData.replace("image/png", "image/octet-stream");
|
||
}
|
||
|
||
};
|
||
|
||
// Not gauranteed to work, even on canvas supporting browsers due to
|
||
// limitations with window.open and arbitrary data.
|
||
$.fn.jqplotViewImage = function() {
|
||
var imgStr = $(this).jqplotToImageElemStr({});
|
||
var imgData = $(this).jqplotToImageStr({});
|
||
if (imgStr) {
|
||
var w = window.open('');
|
||
w.document.open("image/png");
|
||
w.document.write(imgStr);
|
||
w.document.close();
|
||
w = null;
|
||
}
|
||
};
|
||
|
||
|
||
|
||
/**
|
||
* @description
|
||
* <p>Object with extended date parsing and formatting capabilities.
|
||
* This library borrows many concepts and ideas from the Date Instance
|
||
* Methods by Ken Snyder along with some parts of Ken's actual code.</p>
|
||
*
|
||
* <p>jsDate takes a different approach by not extending the built-in
|
||
* Date Object, improving date parsing, allowing for multiple formatting
|
||
* syntaxes and multiple and more easily expandable localization.</p>
|
||
*
|
||
* @author Chris Leonello
|
||
* @date #date#
|
||
* @version #VERSION#
|
||
* @copyright (c) 2010 Chris Leonello
|
||
* jsDate is currently available for use in all personal or commercial projects
|
||
* under both the MIT and GPL version 2.0 licenses. This means that you can
|
||
* choose the license that best suits your project and use it accordingly.
|
||
*
|
||
* <p>Ken's origianl Date Instance Methods and copyright notice:</p>
|
||
* <pre>
|
||
* Ken Snyder (ken d snyder at gmail dot com)
|
||
* 2008-09-10
|
||
* version 2.0.2 (http://kendsnyder.com/sandbox/date/)
|
||
* Creative Commons Attribution License 3.0 (http://creativecommons.org/licenses/by/3.0/)
|
||
* </pre>
|
||
*
|
||
* @class
|
||
* @name jsDate
|
||
* @param {String | Number | Array | Date Object | Options Object} arguments Optional arguments, either a parsable date/time string,
|
||
* a JavaScript timestamp, an array of numbers of form [year, month, day, hours, minutes, seconds, milliseconds],
|
||
* a Date object, or an options object of form {syntax: "perl", date:some Date} where all options are optional.
|
||
*/
|
||
|
||
var jsDate = function () {
|
||
|
||
this.syntax = jsDate.config.syntax;
|
||
this._type = "jsDate";
|
||
this.utcOffset = new Date().getTimezoneOffset * 60000;
|
||
this.proxy = new Date();
|
||
this.options = {};
|
||
this.locale = jsDate.regional.getLocale();
|
||
this.formatString = '';
|
||
this.defaultCentury = jsDate.config.defaultCentury;
|
||
|
||
switch ( arguments.length ) {
|
||
case 0:
|
||
break;
|
||
case 1:
|
||
// other objects either won't have a _type property or,
|
||
// if they do, it shouldn't be set to "jsDate", so
|
||
// assume it is an options argument.
|
||
if (get_type(arguments[0]) == "[object Object]" && arguments[0]._type != "jsDate") {
|
||
var opts = this.options = arguments[0];
|
||
this.syntax = opts.syntax || this.syntax;
|
||
this.defaultCentury = opts.defaultCentury || this.defaultCentury;
|
||
this.proxy = jsDate.createDate(opts.date);
|
||
}
|
||
else {
|
||
this.proxy = jsDate.createDate(arguments[0]);
|
||
}
|
||
break;
|
||
default:
|
||
var a = [];
|
||
for ( var i=0; i<arguments.length; i++ ) {
|
||
a.push(arguments[i]);
|
||
}
|
||
this.proxy = new Date( this.utcOffset );
|
||
this.proxy.setFullYear.apply( this.proxy, a.slice(0,3) );
|
||
if ( a.slice(3).length ) {
|
||
this.proxy.setHours.apply( this.proxy, a.slice(3) );
|
||
}
|
||
break;
|
||
}
|
||
};
|
||
|
||
/**
|
||
* @namespace Configuration options that will be used as defaults for all instances on the page.
|
||
* @property {String} defaultLocale The default locale to use [en].
|
||
* @property {String} syntax The default syntax to use [perl].
|
||
*/
|
||
jsDate.config = {
|
||
defaultLocale: 'en',
|
||
syntax: 'perl',
|
||
defaultCentury: 1900
|
||
};
|
||
|
||
/**
|
||
* Add an arbitrary amount to the currently stored date
|
||
*
|
||
* @param {Number} number
|
||
* @param {String} unit
|
||
* @returns {jsDate}
|
||
*/
|
||
|
||
jsDate.prototype.add = function(number, unit) {
|
||
var factor = multipliers[unit] || multipliers.day;
|
||
if (typeof factor == 'number') {
|
||
this.proxy.setTime(this.proxy.getTime() + (factor * number));
|
||
} else {
|
||
factor.add(this, number);
|
||
}
|
||
return this;
|
||
};
|
||
|
||
/**
|
||
* Create a new jqplot.date object with the same date
|
||
*
|
||
* @returns {jsDate}
|
||
*/
|
||
|
||
jsDate.prototype.clone = function() {
|
||
return new jsDate(this.proxy.getTime());
|
||
};
|
||
|
||
/**
|
||
* Find the difference between this jsDate and another date.
|
||
*
|
||
* @param {String| Number| Array| jsDate Object| Date Object} dateObj
|
||
* @param {String} unit
|
||
* @param {Boolean} allowDecimal
|
||
* @returns {Number} Number of units difference between dates.
|
||
*/
|
||
|
||
jsDate.prototype.diff = function(dateObj, unit, allowDecimal) {
|
||
// ensure we have a Date object
|
||
dateObj = new jsDate(dateObj);
|
||
if (dateObj === null) {
|
||
return null;
|
||
}
|
||
// get the multiplying factor integer or factor function
|
||
var factor = multipliers[unit] || multipliers.day;
|
||
if (typeof factor == 'number') {
|
||
// multiply
|
||
var unitDiff = (this.proxy.getTime() - dateObj.proxy.getTime()) / factor;
|
||
} else {
|
||
// run function
|
||
var unitDiff = factor.diff(this.proxy, dateObj.proxy);
|
||
}
|
||
// if decimals are not allowed, round toward zero
|
||
return (allowDecimal ? unitDiff : Math[unitDiff > 0 ? 'floor' : 'ceil'](unitDiff));
|
||
};
|
||
|
||
/**
|
||
* Get the abbreviated name of the current week day
|
||
*
|
||
* @returns {String}
|
||
*/
|
||
|
||
jsDate.prototype.getAbbrDayName = function() {
|
||
return jsDate.regional[this.locale]["dayNamesShort"][this.proxy.getDay()];
|
||
};
|
||
|
||
/**
|
||
* Get the abbreviated name of the current month
|
||
*
|
||
* @returns {String}
|
||
*/
|
||
|
||
jsDate.prototype.getAbbrMonthName = function() {
|
||
return jsDate.regional[this.locale]["monthNamesShort"][this.proxy.getMonth()];
|
||
};
|
||
|
||
/**
|
||
* Get UPPER CASE AM or PM for the current time
|
||
*
|
||
* @returns {String}
|
||
*/
|
||
|
||
jsDate.prototype.getAMPM = function() {
|
||
return this.proxy.getHours() >= 12 ? 'PM' : 'AM';
|
||
};
|
||
|
||
/**
|
||
* Get lower case am or pm for the current time
|
||
*
|
||
* @returns {String}
|
||
*/
|
||
|
||
jsDate.prototype.getAmPm = function() {
|
||
return this.proxy.getHours() >= 12 ? 'pm' : 'am';
|
||
};
|
||
|
||
/**
|
||
* Get the century (19 for 20th Century)
|
||
*
|
||
* @returns {Integer} Century (19 for 20th century).
|
||
*/
|
||
jsDate.prototype.getCentury = function() {
|
||
return parseInt(this.proxy.getFullYear()/100, 10);
|
||
};
|
||
|
||
/**
|
||
* Implements Date functionality
|
||
*/
|
||
jsDate.prototype.getDate = function() {
|
||
return this.proxy.getDate();
|
||
};
|
||
|
||
/**
|
||
* Implements Date functionality
|
||
*/
|
||
jsDate.prototype.getDay = function() {
|
||
return this.proxy.getDay();
|
||
};
|
||
|
||
/**
|
||
* Get the Day of week 1 (Monday) thru 7 (Sunday)
|
||
*
|
||
* @returns {Integer} Day of week 1 (Monday) thru 7 (Sunday)
|
||
*/
|
||
jsDate.prototype.getDayOfWeek = function() {
|
||
var dow = this.proxy.getDay();
|
||
return dow===0?7:dow;
|
||
};
|
||
|
||
/**
|
||
* Get the day of the year
|
||
*
|
||
* @returns {Integer} 1 - 366, day of the year
|
||
*/
|
||
jsDate.prototype.getDayOfYear = function() {
|
||
var d = this.proxy;
|
||
var ms = d - new Date('' + d.getFullYear() + '/1/1 GMT');
|
||
ms += d.getTimezoneOffset()*60000;
|
||
d = null;
|
||
return parseInt(ms/60000/60/24, 10)+1;
|
||
};
|
||
|
||
/**
|
||
* Get the name of the current week day
|
||
*
|
||
* @returns {String}
|
||
*/
|
||
|
||
jsDate.prototype.getDayName = function() {
|
||
return jsDate.regional[this.locale]["dayNames"][this.proxy.getDay()];
|
||
};
|
||
|
||
/**
|
||
* Get the week number of the given year, starting with the first Sunday as the first week
|
||
* @returns {Integer} Week number (13 for the 13th full week of the year).
|
||
*/
|
||
jsDate.prototype.getFullWeekOfYear = function() {
|
||
var d = this.proxy;
|
||
var doy = this.getDayOfYear();
|
||
var rdow = 6-d.getDay();
|
||
var woy = parseInt((doy+rdow)/7, 10);
|
||
return woy;
|
||
};
|
||
|
||
/**
|
||
* Implements Date functionality
|
||
*/
|
||
jsDate.prototype.getFullYear = function() {
|
||
return this.proxy.getFullYear();
|
||
};
|
||
|
||
/**
|
||
* Get the GMT offset in hours and minutes (e.g. +06:30)
|
||
*
|
||
* @returns {String}
|
||
*/
|
||
|
||
jsDate.prototype.getGmtOffset = function() {
|
||
// divide the minutes offset by 60
|
||
var hours = this.proxy.getTimezoneOffset() / 60;
|
||
// decide if we are ahead of or behind GMT
|
||
var prefix = hours < 0 ? '+' : '-';
|
||
// remove the negative sign if any
|
||
hours = Math.abs(hours);
|
||
// add the +/- to the padded number of hours to : to the padded minutes
|
||
return prefix + addZeros(Math.floor(hours), 2) + ':' + addZeros((hours % 1) * 60, 2);
|
||
};
|
||
|
||
/**
|
||
* Implements Date functionality
|
||
*/
|
||
jsDate.prototype.getHours = function() {
|
||
return this.proxy.getHours();
|
||
};
|
||
|
||
/**
|
||
* Get the current hour on a 12-hour scheme
|
||
*
|
||
* @returns {Integer}
|
||
*/
|
||
|
||
jsDate.prototype.getHours12 = function() {
|
||
var hours = this.proxy.getHours();
|
||
return hours > 12 ? hours - 12 : (hours == 0 ? 12 : hours);
|
||
};
|
||
|
||
|
||
jsDate.prototype.getIsoWeek = function() {
|
||
var d = this.proxy;
|
||
var woy = d.getWeekOfYear();
|
||
var dow1_1 = (new Date('' + d.getFullYear() + '/1/1')).getDay();
|
||
// First week is 01 and not 00 as in the case of %U and %W,
|
||
// so we add 1 to the final result except if day 1 of the year
|
||
// is a Monday (then %W returns 01).
|
||
// We also need to subtract 1 if the day 1 of the year is
|
||
// Friday-Sunday, so the resulting equation becomes:
|
||
var idow = woy + (dow1_1 > 4 || dow1_1 <= 1 ? 0 : 1);
|
||
if(idow == 53 && (new Date('' + d.getFullYear() + '/12/31')).getDay() < 4)
|
||
{
|
||
idow = 1;
|
||
}
|
||
else if(idow === 0)
|
||
{
|
||
d = new jsDate(new Date('' + (d.getFullYear()-1) + '/12/31'));
|
||
idow = d.getIsoWeek();
|
||
}
|
||
d = null;
|
||
return idow;
|
||
};
|
||
|
||
/**
|
||
* Implements Date functionality
|
||
*/
|
||
jsDate.prototype.getMilliseconds = function() {
|
||
return this.proxy.getMilliseconds();
|
||
};
|
||
|
||
/**
|
||
* Implements Date functionality
|
||
*/
|
||
jsDate.prototype.getMinutes = function() {
|
||
return this.proxy.getMinutes();
|
||
};
|
||
|
||
/**
|
||
* Implements Date functionality
|
||
*/
|
||
jsDate.prototype.getMonth = function() {
|
||
return this.proxy.getMonth();
|
||
};
|
||
|
||
/**
|
||
* Get the name of the current month
|
||
*
|
||
* @returns {String}
|
||
*/
|
||
|
||
jsDate.prototype.getMonthName = function() {
|
||
return jsDate.regional[this.locale]["monthNames"][this.proxy.getMonth()];
|
||
};
|
||
|
||
/**
|
||
* Get the number of the current month, 1-12
|
||
*
|
||
* @returns {Integer}
|
||
*/
|
||
|
||
jsDate.prototype.getMonthNumber = function() {
|
||
return this.proxy.getMonth() + 1;
|
||
};
|
||
|
||
/**
|
||
* Implements Date functionality
|
||
*/
|
||
jsDate.prototype.getSeconds = function() {
|
||
return this.proxy.getSeconds();
|
||
};
|
||
|
||
/**
|
||
* Return a proper two-digit year integer
|
||
*
|
||
* @returns {Integer}
|
||
*/
|
||
|
||
jsDate.prototype.getShortYear = function() {
|
||
return this.proxy.getYear() % 100;
|
||
};
|
||
|
||
/**
|
||
* Implements Date functionality
|
||
*/
|
||
jsDate.prototype.getTime = function() {
|
||
return this.proxy.getTime();
|
||
};
|
||
|
||
/**
|
||
* Get the timezone abbreviation
|
||
*
|
||
* @returns {String} Abbreviation for the timezone
|
||
*/
|
||
jsDate.prototype.getTimezoneAbbr = function() {
|
||
return this.proxy.toString().replace(/^.*\(([^)]+)\)$/, '$1');
|
||
};
|
||
|
||
/**
|
||
* Get the browser-reported name for the current timezone (e.g. MDT, Mountain Daylight Time)
|
||
*
|
||
* @returns {String}
|
||
*/
|
||
jsDate.prototype.getTimezoneName = function() {
|
||
var match = /(?:\((.+)\)$| ([A-Z]{3}) )/.exec(this.toString());
|
||
return match[1] || match[2] || 'GMT' + this.getGmtOffset();
|
||
};
|
||
|
||
/**
|
||
* Implements Date functionality
|
||
*/
|
||
jsDate.prototype.getTimezoneOffset = function() {
|
||
return this.proxy.getTimezoneOffset();
|
||
};
|
||
|
||
|
||
/**
|
||
* Get the week number of the given year, starting with the first Monday as the first week
|
||
* @returns {Integer} Week number (13 for the 13th week of the year).
|
||
*/
|
||
jsDate.prototype.getWeekOfYear = function() {
|
||
var doy = this.getDayOfYear();
|
||
var rdow = 7 - this.getDayOfWeek();
|
||
var woy = parseInt((doy+rdow)/7, 10);
|
||
return woy;
|
||
};
|
||
|
||
/**
|
||
* Get the current date as a Unix timestamp
|
||
*
|
||
* @returns {Integer}
|
||
*/
|
||
|
||
jsDate.prototype.getUnix = function() {
|
||
return Math.round(this.proxy.getTime() / 1000, 0);
|
||
};
|
||
|
||
/**
|
||
* Implements Date functionality
|
||
*/
|
||
jsDate.prototype.getYear = function() {
|
||
return this.proxy.getYear();
|
||
};
|
||
|
||
/**
|
||
* Return a date one day ahead (or any other unit)
|
||
*
|
||
* @param {String} unit Optional, year | month | day | week | hour | minute | second | millisecond
|
||
* @returns {jsDate}
|
||
*/
|
||
|
||
jsDate.prototype.next = function(unit) {
|
||
unit = unit || 'day';
|
||
return this.clone().add(1, unit);
|
||
};
|
||
|
||
/**
|
||
* Set the jsDate instance to a new date.
|
||
*
|
||
* @param {String | Number | Array | Date Object | jsDate Object | Options Object} arguments Optional arguments,
|
||
* either a parsable date/time string,
|
||
* a JavaScript timestamp, an array of numbers of form [year, month, day, hours, minutes, seconds, milliseconds],
|
||
* a Date object, jsDate Object or an options object of form {syntax: "perl", date:some Date} where all options are optional.
|
||
*/
|
||
jsDate.prototype.set = function() {
|
||
switch ( arguments.length ) {
|
||
case 0:
|
||
this.proxy = new Date();
|
||
break;
|
||
case 1:
|
||
// other objects either won't have a _type property or,
|
||
// if they do, it shouldn't be set to "jsDate", so
|
||
// assume it is an options argument.
|
||
if (get_type(arguments[0]) == "[object Object]" && arguments[0]._type != "jsDate") {
|
||
var opts = this.options = arguments[0];
|
||
this.syntax = opts.syntax || this.syntax;
|
||
this.defaultCentury = opts.defaultCentury || this.defaultCentury;
|
||
this.proxy = jsDate.createDate(opts.date);
|
||
}
|
||
else {
|
||
this.proxy = jsDate.createDate(arguments[0]);
|
||
}
|
||
break;
|
||
default:
|
||
var a = [];
|
||
for ( var i=0; i<arguments.length; i++ ) {
|
||
a.push(arguments[i]);
|
||
}
|
||
this.proxy = new Date( this.utcOffset );
|
||
this.proxy.setFullYear.apply( this.proxy, a.slice(0,3) );
|
||
if ( a.slice(3).length ) {
|
||
this.proxy.setHours.apply( this.proxy, a.slice(3) );
|
||
}
|
||
break;
|
||
}
|
||
};
|
||
|
||
/**
|
||
* Sets the day of the month for a specified date according to local time.
|
||
* @param {Integer} dayValue An integer from 1 to 31, representing the day of the month.
|
||
*/
|
||
jsDate.prototype.setDate = function(n) {
|
||
return this.proxy.setDate(n);
|
||
};
|
||
|
||
/**
|
||
* Sets the full year for a specified date according to local time.
|
||
* @param {Integer} yearValue The numeric value of the year, for example, 1995.
|
||
* @param {Integer} monthValue Optional, between 0 and 11 representing the months January through December.
|
||
* @param {Integer} dayValue Optional, between 1 and 31 representing the day of the month. If you specify the dayValue parameter, you must also specify the monthValue.
|
||
*/
|
||
jsDate.prototype.setFullYear = function() {
|
||
return this.proxy.setFullYear.apply(this.proxy, arguments);
|
||
};
|
||
|
||
/**
|
||
* Sets the hours for a specified date according to local time.
|
||
*
|
||
* @param {Integer} hoursValue An integer between 0 and 23, representing the hour.
|
||
* @param {Integer} minutesValue Optional, An integer between 0 and 59, representing the minutes.
|
||
* @param {Integer} secondsValue Optional, An integer between 0 and 59, representing the seconds.
|
||
* If you specify the secondsValue parameter, you must also specify the minutesValue.
|
||
* @param {Integer} msValue Optional, A number between 0 and 999, representing the milliseconds.
|
||
* If you specify the msValue parameter, you must also specify the minutesValue and secondsValue.
|
||
*/
|
||
jsDate.prototype.setHours = function() {
|
||
return this.proxy.setHours.apply(this.proxy, arguments);
|
||
};
|
||
|
||
/**
|
||
* Implements Date functionality
|
||
*/
|
||
jsDate.prototype.setMilliseconds = function(n) {
|
||
return this.proxy.setMilliseconds(n);
|
||
};
|
||
|
||
/**
|
||
* Implements Date functionality
|
||
*/
|
||
jsDate.prototype.setMinutes = function() {
|
||
return this.proxy.setMinutes.apply(this.proxy, arguments);
|
||
};
|
||
|
||
/**
|
||
* Implements Date functionality
|
||
*/
|
||
jsDate.prototype.setMonth = function() {
|
||
return this.proxy.setMonth.apply(this.proxy, arguments);
|
||
};
|
||
|
||
/**
|
||
* Implements Date functionality
|
||
*/
|
||
jsDate.prototype.setSeconds = function() {
|
||
return this.proxy.setSeconds.apply(this.proxy, arguments);
|
||
};
|
||
|
||
/**
|
||
* Implements Date functionality
|
||
*/
|
||
jsDate.prototype.setTime = function(n) {
|
||
return this.proxy.setTime(n);
|
||
};
|
||
|
||
/**
|
||
* Implements Date functionality
|
||
*/
|
||
jsDate.prototype.setYear = function() {
|
||
return this.proxy.setYear.apply(this.proxy, arguments);
|
||
};
|
||
|
||
/**
|
||
* Provide a formatted string representation of this date.
|
||
*
|
||
* @param {String} formatString A format string.
|
||
* See: {@link jsDate.formats}.
|
||
* @returns {String} Date String.
|
||
*/
|
||
|
||
jsDate.prototype.strftime = function(formatString) {
|
||
formatString = formatString || this.formatString || jsDate.regional[this.locale]['formatString'];
|
||
return jsDate.strftime(this, formatString, this.syntax);
|
||
};
|
||
|
||
/**
|
||
* Return a String representation of this jsDate object.
|
||
* @returns {String} Date string.
|
||
*/
|
||
|
||
jsDate.prototype.toString = function() {
|
||
return this.proxy.toString();
|
||
};
|
||
|
||
/**
|
||
* Convert the current date to an 8-digit integer (%Y%m%d)
|
||
*
|
||
* @returns {Integer}
|
||
*/
|
||
|
||
jsDate.prototype.toYmdInt = function() {
|
||
return (this.proxy.getFullYear() * 10000) + (this.getMonthNumber() * 100) + this.proxy.getDate();
|
||
};
|
||
|
||
/**
|
||
* @namespace Holds localizations for month/day names.
|
||
* <p>jsDate attempts to detect locale when loaded and defaults to 'en'.
|
||
* If a localization is detected which is not available, jsDate defaults to 'en'.
|
||
* Additional localizations can be added after jsDate loads. After adding a localization,
|
||
* call the jsDate.regional.getLocale() method. Currently, en, fr and de are defined.</p>
|
||
*
|
||
* <p>Localizations must be an object and have the following properties defined: monthNames, monthNamesShort, dayNames, dayNamesShort and Localizations are added like:</p>
|
||
* <pre class="code">
|
||
* jsDate.regional['en'] = {
|
||
* monthNames : 'January February March April May June July August September October November December'.split(' '),
|
||
* monthNamesShort : 'Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec'.split(' '),
|
||
* dayNames : 'Sunday Monday Tuesday Wednesday Thursday Friday Saturday'.split(' '),
|
||
* dayNamesShort : 'Sun Mon Tue Wed Thu Fri Sat'.split(' ')
|
||
* };
|
||
* </pre>
|
||
* <p>After adding localizations, call <code>jsDate.regional.getLocale();</code> to update the locale setting with the
|
||
* new localizations.</p>
|
||
*/
|
||
|
||
jsDate.regional = {
|
||
'en': {
|
||
monthNames: ['January','February','March','April','May','June','July','August','September','October','November','December'],
|
||
monthNamesShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun','Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
|
||
dayNames: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
|
||
dayNamesShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
|
||
formatString: '%Y-%m-%d %H:%M:%S'
|
||
},
|
||
|
||
'fr': {
|
||
monthNames: ['Janvier','Février','Mars','Avril','Mai','Juin','Juillet','Août','Septembre','Octobre','Novembre','Décembre'],
|
||
monthNamesShort: ['Jan','Fév','Mar','Avr','Mai','Jun','Jul','Aoû','Sep','Oct','Nov','Déc'],
|
||
dayNames: ['Dimanche','Lundi','Mardi','Mercredi','Jeudi','Vendredi','Samedi'],
|
||
dayNamesShort: ['Dim','Lun','Mar','Mer','Jeu','Ven','Sam'],
|
||
formatString: '%Y-%m-%d %H:%M:%S'
|
||
},
|
||
|
||
'de': {
|
||
monthNames: ['Januar','Februar','März','April','Mai','Juni','Juli','August','September','Oktober','November','Dezember'],
|
||
monthNamesShort: ['Jan','Feb','Mär','Apr','Mai','Jun','Jul','Aug','Sep','Okt','Nov','Dez'],
|
||
dayNames: ['Sonntag','Montag','Dienstag','Mittwoch','Donnerstag','Freitag','Samstag'],
|
||
dayNamesShort: ['So','Mo','Di','Mi','Do','Fr','Sa'],
|
||
formatString: '%Y-%m-%d %H:%M:%S'
|
||
},
|
||
|
||
'es': {
|
||
monthNames: ['Enero','Febrero','Marzo','Abril','Mayo','Junio', 'Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre'],
|
||
monthNamesShort: ['Ene','Feb','Mar','Abr','May','Jun', 'Jul','Ago','Sep','Oct','Nov','Dic'],
|
||
dayNames: ['Domingo','Lunes','Martes','Miércoles','Jueves','Viernes','Sábado'],
|
||
dayNamesShort: ['Dom','Lun','Mar','Mié','Juv','Vie','Sáb'],
|
||
formatString: '%Y-%m-%d %H:%M:%S'
|
||
},
|
||
|
||
'ru': {
|
||
monthNames: ['Январь','Февраль','Март','Апрель','Май','Июнь','Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь'],
|
||
monthNamesShort: ['Янв','Фев','Мар','Апр','Май','Июн','Июл','Авг','Сен','Окт','Ноя','Дек'],
|
||
dayNames: ['воскресенье','понедельник','вторник','среда','четверг','пятница','суббота'],
|
||
dayNamesShort: ['вск','пнд','втр','срд','чтв','птн','сбт'],
|
||
formatString: '%Y-%m-%d %H:%M:%S'
|
||
},
|
||
|
||
'ar': {
|
||
monthNames: ['كانون الثاني', 'شباط', 'آذار', 'نيسان', 'آذار', 'حزيران','تموز', 'آب', 'أيلول', 'تشرين الأول', 'تشرين الثاني', 'كانون الأول'],
|
||
monthNamesShort: ['1','2','3','4','5','6','7','8','9','10','11','12'],
|
||
dayNames: ['السبت', 'الأحد', 'الاثنين', 'الثلاثاء', 'الأربعاء', 'الخميس', 'الجمعة'],
|
||
dayNamesShort: ['سبت', 'أحد', 'اثنين', 'ثلاثاء', 'أربعاء', 'خميس', 'جمعة'],
|
||
formatString: '%Y-%m-%d %H:%M:%S'
|
||
},
|
||
|
||
'pt': {
|
||
monthNames: ['Janeiro','Fevereiro','Março','Abril','Maio','Junho','Julho','Agosto','Setembro','Outubro','Novembro','Dezembro'],
|
||
monthNamesShort: ['Jan','Fev','Mar','Abr','Mai','Jun','Jul','Ago','Set','Out','Nov','Dez'],
|
||
dayNames: ['Domingo','Segunda-feira','Terça-feira','Quarta-feira','Quinta-feira','Sexta-feira','Sábado'],
|
||
dayNamesShort: ['Dom','Seg','Ter','Qua','Qui','Sex','Sáb'],
|
||
formatString: '%Y-%m-%d %H:%M:%S'
|
||
},
|
||
|
||
'pt-BR': {
|
||
monthNames: ['Janeiro','Fevereiro','Março','Abril','Maio','Junho', 'Julho','Agosto','Setembro','Outubro','Novembro','Dezembro'],
|
||
monthNamesShort: ['Jan','Fev','Mar','Abr','Mai','Jun','Jul','Ago','Set','Out','Nov','Dez'],
|
||
dayNames: ['Domingo','Segunda-feira','Terça-feira','Quarta-feira','Quinta-feira','Sexta-feira','Sábado'],
|
||
dayNamesShort: ['Dom','Seg','Ter','Qua','Qui','Sex','Sáb'],
|
||
formatString: '%Y-%m-%d %H:%M:%S'
|
||
}
|
||
|
||
|
||
};
|
||
|
||
// Set english variants to 'en'
|
||
jsDate.regional['en-US'] = jsDate.regional['en-GB'] = jsDate.regional['en'];
|
||
|
||
/**
|
||
* Try to determine the users locale based on the lang attribute of the html page. Defaults to 'en'
|
||
* if it cannot figure out a locale of if the locale does not have a localization defined.
|
||
* @returns {String} locale
|
||
*/
|
||
|
||
jsDate.regional.getLocale = function () {
|
||
var l = jsDate.config.defaultLocale;
|
||
|
||
if ( document && document.getElementsByTagName('html') && document.getElementsByTagName('html')[0].lang ) {
|
||
l = document.getElementsByTagName('html')[0].lang;
|
||
if (!jsDate.regional.hasOwnProperty(l)) {
|
||
l = jsDate.config.defaultLocale;
|
||
}
|
||
}
|
||
|
||
return l;
|
||
};
|
||
|
||
// ms in day
|
||
var day = 24 * 60 * 60 * 1000;
|
||
|
||
// padd a number with zeros
|
||
var addZeros = function(num, digits) {
|
||
num = String(num);
|
||
var i = digits - num.length;
|
||
var s = String(Math.pow(10, i)).slice(1);
|
||
return s.concat(num);
|
||
};
|
||
|
||
// representations used for calculating differences between dates.
|
||
// This borrows heavily from Ken Snyder's work.
|
||
var multipliers = {
|
||
millisecond: 1,
|
||
second: 1000,
|
||
minute: 60 * 1000,
|
||
hour: 60 * 60 * 1000,
|
||
day: day,
|
||
week: 7 * day,
|
||
month: {
|
||
// add a number of months
|
||
add: function(d, number) {
|
||
// add any years needed (increments of 12)
|
||
multipliers.year.add(d, Math[number > 0 ? 'floor' : 'ceil'](number / 12));
|
||
// ensure that we properly wrap betwen December and January
|
||
var prevMonth = d.getMonth() + (number % 12);
|
||
if (prevMonth == 12) {
|
||
prevMonth = 0;
|
||
d.setYear(d.getFullYear() + 1);
|
||
} else if (prevMonth == -1) {
|
||
prevMonth = 11;
|
||
d.setYear(d.getFullYear() - 1);
|
||
}
|
||
d.setMonth(prevMonth);
|
||
},
|
||
// get the number of months between two Date objects (decimal to the nearest day)
|
||
diff: function(d1, d2) {
|
||
// get the number of years
|
||
var diffYears = d1.getFullYear() - d2.getFullYear();
|
||
// get the number of remaining months
|
||
var diffMonths = d1.getMonth() - d2.getMonth() + (diffYears * 12);
|
||
// get the number of remaining days
|
||
var diffDays = d1.getDate() - d2.getDate();
|
||
// return the month difference with the days difference as a decimal
|
||
return diffMonths + (diffDays / 30);
|
||
}
|
||
},
|
||
year: {
|
||
// add a number of years
|
||
add: function(d, number) {
|
||
d.setYear(d.getFullYear() + Math[number > 0 ? 'floor' : 'ceil'](number));
|
||
},
|
||
// get the number of years between two Date objects (decimal to the nearest day)
|
||
diff: function(d1, d2) {
|
||
return multipliers.month.diff(d1, d2) / 12;
|
||
}
|
||
}
|
||
};
|
||
//
|
||
// Alias each multiplier with an 's' to allow 'year' and 'years' for example.
|
||
// This comes from Ken Snyders work.
|
||
//
|
||
for (var unit in multipliers) {
|
||
if (unit.substring(unit.length - 1) != 's') { // IE will iterate newly added properties :|
|
||
multipliers[unit + 's'] = multipliers[unit];
|
||
}
|
||
}
|
||
|
||
//
|
||
// take a jsDate instance and a format code and return the formatted value.
|
||
// This is a somewhat modified version of Ken Snyder's method.
|
||
//
|
||
var format = function(d, code, syntax) {
|
||
// if shorcut codes are used, recursively expand those.
|
||
if (jsDate.formats[syntax]["shortcuts"][code]) {
|
||
return jsDate.strftime(d, jsDate.formats[syntax]["shortcuts"][code], syntax);
|
||
} else {
|
||
// get the format code function and addZeros() argument
|
||
var getter = (jsDate.formats[syntax]["codes"][code] || '').split('.');
|
||
var nbr = d['get' + getter[0]] ? d['get' + getter[0]]() : '';
|
||
if (getter[1]) {
|
||
nbr = addZeros(nbr, getter[1]);
|
||
}
|
||
return nbr;
|
||
}
|
||
};
|
||
|
||
/**
|
||
* @static
|
||
* Static function for convert a date to a string according to a given format. Also acts as namespace for strftime format codes.
|
||
* <p>strftime formatting can be accomplished without creating a jsDate object by calling jsDate.strftime():</p>
|
||
* <pre class="code">
|
||
* var formattedDate = jsDate.strftime('Feb 8, 2006 8:48:32', '%Y-%m-%d %H:%M:%S');
|
||
* </pre>
|
||
* @param {String | Number | Array | jsDate Object | Date Object} date A parsable date string, JavaScript time stamp, Array of form [year, month, day, hours, minutes, seconds, milliseconds], jsDate Object or Date object.
|
||
* @param {String} formatString String with embedded date formatting codes.
|
||
* See: {@link jsDate.formats}.
|
||
* @param {String} syntax Optional syntax to use [default perl].
|
||
* @param {String} locale Optional locale to use.
|
||
* @returns {String} Formatted representation of the date.
|
||
*/
|
||
//
|
||
// Logic as implemented here is very similar to Ken Snyder's Date Instance Methods.
|
||
//
|
||
jsDate.strftime = function(d, formatString, syntax, locale) {
|
||
var syn = 'perl';
|
||
var loc = jsDate.regional.getLocale();
|
||
|
||
// check if syntax and locale are available or reversed
|
||
if (syntax && jsDate.formats.hasOwnProperty(syntax)) {
|
||
syn = syntax;
|
||
}
|
||
else if (syntax && jsDate.regional.hasOwnProperty(syntax)) {
|
||
loc = syntax;
|
||
}
|
||
|
||
if (locale && jsDate.formats.hasOwnProperty(locale)) {
|
||
syn = locale;
|
||
}
|
||
else if (locale && jsDate.regional.hasOwnProperty(locale)) {
|
||
loc = locale;
|
||
}
|
||
|
||
if (get_type(d) != "[object Object]" || d._type != "jsDate") {
|
||
d = new jsDate(d);
|
||
d.locale = loc;
|
||
}
|
||
if (!formatString) {
|
||
formatString = d.formatString || jsDate.regional[loc]['formatString'];
|
||
}
|
||
// default the format string to year-month-day
|
||
var source = formatString || '%Y-%m-%d',
|
||
result = '',
|
||
match;
|
||
// replace each format code
|
||
while (source.length > 0) {
|
||
if (match = source.match(jsDate.formats[syn].codes.matcher)) {
|
||
result += source.slice(0, match.index);
|
||
result += (match[1] || '') + format(d, match[2], syn);
|
||
source = source.slice(match.index + match[0].length);
|
||
} else {
|
||
result += source;
|
||
source = '';
|
||
}
|
||
}
|
||
return result;
|
||
};
|
||
|
||
/**
|
||
* @namespace
|
||
* Namespace to hold format codes and format shortcuts. "perl" and "php" format codes
|
||
* and shortcuts are defined by default. Additional codes and shortcuts can be
|
||
* added like:
|
||
*
|
||
* <pre class="code">
|
||
* jsDate.formats["perl"] = {
|
||
* "codes": {
|
||
* matcher: /someregex/,
|
||
* Y: "fullYear", // name of "get" method without the "get",
|
||
* ..., // more codes
|
||
* },
|
||
* "shortcuts": {
|
||
* F: '%Y-%m-%d',
|
||
* ..., // more shortcuts
|
||
* }
|
||
* };
|
||
* </pre>
|
||
*
|
||
* <p>Additionally, ISO and SQL shortcuts are defined and can be accesses via:
|
||
* <code>jsDate.formats.ISO</code> and <code>jsDate.formats.SQL</code>
|
||
*/
|
||
|
||
jsDate.formats = {
|
||
ISO:'%Y-%m-%dT%H:%M:%S.%N%G',
|
||
SQL:'%Y-%m-%d %H:%M:%S'
|
||
};
|
||
|
||
/**
|
||
* Perl format codes and shortcuts for strftime.
|
||
*
|
||
* A hash (object) of codes where each code must be an array where the first member is
|
||
* the name of a Date.prototype or jsDate.prototype function to call
|
||
* and optionally a second member indicating the number to pass to addZeros()
|
||
*
|
||
* <p>The following format codes are defined:</p>
|
||
*
|
||
* <pre class="code">
|
||
* Code Result Description
|
||
* == Years ==
|
||
* %Y 2008 Four-digit year
|
||
* %y 08 Two-digit year
|
||
*
|
||
* == Months ==
|
||
* %m 09 Two-digit month
|
||
* %#m 9 One or two-digit month
|
||
* %B September Full month name
|
||
* %b Sep Abbreviated month name
|
||
*
|
||
* == Days ==
|
||
* %d 05 Two-digit day of month
|
||
* %#d 5 One or two-digit day of month
|
||
* %e 5 One or two-digit day of month
|
||
* %A Sunday Full name of the day of the week
|
||
* %a Sun Abbreviated name of the day of the week
|
||
* %w 0 Number of the day of the week (0 = Sunday, 6 = Saturday)
|
||
*
|
||
* == Hours ==
|
||
* %H 23 Hours in 24-hour format (two digits)
|
||
* %#H 3 Hours in 24-hour integer format (one or two digits)
|
||
* %I 11 Hours in 12-hour format (two digits)
|
||
* %#I 3 Hours in 12-hour integer format (one or two digits)
|
||
* %p PM AM or PM
|
||
*
|
||
* == Minutes ==
|
||
* %M 09 Minutes (two digits)
|
||
* %#M 9 Minutes (one or two digits)
|
||
*
|
||
* == Seconds ==
|
||
* %S 02 Seconds (two digits)
|
||
* %#S 2 Seconds (one or two digits)
|
||
* %s 1206567625723 Unix timestamp (Seconds past 1970-01-01 00:00:00)
|
||
*
|
||
* == Milliseconds ==
|
||
* %N 008 Milliseconds (three digits)
|
||
* %#N 8 Milliseconds (one to three digits)
|
||
*
|
||
* == Timezone ==
|
||
* %O 360 difference in minutes between local time and GMT
|
||
* %Z Mountain Standard Time Name of timezone as reported by browser
|
||
* %G 06:00 Hours and minutes between GMT
|
||
*
|
||
* == Shortcuts ==
|
||
* %F 2008-03-26 %Y-%m-%d
|
||
* %T 05:06:30 %H:%M:%S
|
||
* %X 05:06:30 %H:%M:%S
|
||
* %x 03/26/08 %m/%d/%y
|
||
* %D 03/26/08 %m/%d/%y
|
||
* %#c Wed Mar 26 15:31:00 2008 %a %b %e %H:%M:%S %Y
|
||
* %v 3-Sep-2008 %e-%b-%Y
|
||
* %R 15:31 %H:%M
|
||
* %r 03:31:00 PM %I:%M:%S %p
|
||
*
|
||
* == Characters ==
|
||
* %n \n Newline
|
||
* %t \t Tab
|
||
* %% % Percent Symbol
|
||
* </pre>
|
||
*
|
||
* <p>Formatting shortcuts that will be translated into their longer version.
|
||
* Be sure that format shortcuts do not refer to themselves: this will cause an infinite loop.</p>
|
||
*
|
||
* <p>Format codes and format shortcuts can be redefined after the jsDate
|
||
* module is imported.</p>
|
||
*
|
||
* <p>Note that if you redefine the whole hash (object), you must supply a "matcher"
|
||
* regex for the parser. The default matcher is:</p>
|
||
*
|
||
* <code>/()%(#?(%|[a-z]))/i</code>
|
||
*
|
||
* <p>which corresponds to the Perl syntax used by default.</p>
|
||
*
|
||
* <p>By customizing the matcher and format codes, nearly any strftime functionality is possible.</p>
|
||
*/
|
||
|
||
jsDate.formats.perl = {
|
||
codes: {
|
||
//
|
||
// 2-part regex matcher for format codes
|
||
//
|
||
// first match must be the character before the code (to account for escaping)
|
||
// second match must be the format code character(s)
|
||
//
|
||
matcher: /()%(#?(%|[a-z]))/i,
|
||
// year
|
||
Y: 'FullYear',
|
||
y: 'ShortYear.2',
|
||
// month
|
||
m: 'MonthNumber.2',
|
||
'#m': 'MonthNumber',
|
||
B: 'MonthName',
|
||
b: 'AbbrMonthName',
|
||
// day
|
||
d: 'Date.2',
|
||
'#d': 'Date',
|
||
e: 'Date',
|
||
A: 'DayName',
|
||
a: 'AbbrDayName',
|
||
w: 'Day',
|
||
// hours
|
||
H: 'Hours.2',
|
||
'#H': 'Hours',
|
||
I: 'Hours12.2',
|
||
'#I': 'Hours12',
|
||
p: 'AMPM',
|
||
// minutes
|
||
M: 'Minutes.2',
|
||
'#M': 'Minutes',
|
||
// seconds
|
||
S: 'Seconds.2',
|
||
'#S': 'Seconds',
|
||
s: 'Unix',
|
||
// milliseconds
|
||
N: 'Milliseconds.3',
|
||
'#N': 'Milliseconds',
|
||
// timezone
|
||
O: 'TimezoneOffset',
|
||
Z: 'TimezoneName',
|
||
G: 'GmtOffset'
|
||
},
|
||
|
||
shortcuts: {
|
||
// date
|
||
F: '%Y-%m-%d',
|
||
// time
|
||
T: '%H:%M:%S',
|
||
X: '%H:%M:%S',
|
||
// local format date
|
||
x: '%m/%d/%y',
|
||
D: '%m/%d/%y',
|
||
// local format extended
|
||
'#c': '%a %b %e %H:%M:%S %Y',
|
||
// local format short
|
||
v: '%e-%b-%Y',
|
||
R: '%H:%M',
|
||
r: '%I:%M:%S %p',
|
||
// tab and newline
|
||
t: '\t',
|
||
n: '\n',
|
||
'%': '%'
|
||
}
|
||
};
|
||
|
||
/**
|
||
* PHP format codes and shortcuts for strftime.
|
||
*
|
||
* A hash (object) of codes where each code must be an array where the first member is
|
||
* the name of a Date.prototype or jsDate.prototype function to call
|
||
* and optionally a second member indicating the number to pass to addZeros()
|
||
*
|
||
* <p>The following format codes are defined:</p>
|
||
*
|
||
* <pre class="code">
|
||
* Code Result Description
|
||
* === Days ===
|
||
* %a Sun through Sat An abbreviated textual representation of the day
|
||
* %A Sunday - Saturday A full textual representation of the day
|
||
* %d 01 to 31 Two-digit day of the month (with leading zeros)
|
||
* %e 1 to 31 Day of the month, with a space preceding single digits.
|
||
* %j 001 to 366 Day of the year, 3 digits with leading zeros
|
||
* %u 1 - 7 (Mon - Sun) ISO-8601 numeric representation of the day of the week
|
||
* %w 0 - 6 (Sun - Sat) Numeric representation of the day of the week
|
||
*
|
||
* === Week ===
|
||
* %U 13 Full Week number, starting with the first Sunday as the first week
|
||
* %V 01 through 53 ISO-8601:1988 week number, starting with the first week of the year
|
||
* with at least 4 weekdays, with Monday being the start of the week
|
||
* %W 46 A numeric representation of the week of the year,
|
||
* starting with the first Monday as the first week
|
||
* === Month ===
|
||
* %b Jan through Dec Abbreviated month name, based on the locale
|
||
* %B January - December Full month name, based on the locale
|
||
* %h Jan through Dec Abbreviated month name, based on the locale (an alias of %b)
|
||
* %m 01 - 12 (Jan - Dec) Two digit representation of the month
|
||
*
|
||
* === Year ===
|
||
* %C 19 Two digit century (year/100, truncated to an integer)
|
||
* %y 09 for 2009 Two digit year
|
||
* %Y 2038 Four digit year
|
||
*
|
||
* === Time ===
|
||
* %H 00 through 23 Two digit representation of the hour in 24-hour format
|
||
* %I 01 through 12 Two digit representation of the hour in 12-hour format
|
||
* %l 1 through 12 Hour in 12-hour format, with a space preceeding single digits
|
||
* %M 00 through 59 Two digit representation of the minute
|
||
* %p AM/PM UPPER-CASE 'AM' or 'PM' based on the given time
|
||
* %P am/pm lower-case 'am' or 'pm' based on the given time
|
||
* %r 09:34:17 PM Same as %I:%M:%S %p
|
||
* %R 00:35 Same as %H:%M
|
||
* %S 00 through 59 Two digit representation of the second
|
||
* %T 21:34:17 Same as %H:%M:%S
|
||
* %X 03:59:16 Preferred time representation based on locale, without the date
|
||
* %z -0500 or EST Either the time zone offset from UTC or the abbreviation
|
||
* %Z -0500 or EST The time zone offset/abbreviation option NOT given by %z
|
||
*
|
||
* === Time and Date ===
|
||
* %D 02/05/09 Same as %m/%d/%y
|
||
* %F 2009-02-05 Same as %Y-%m-%d (commonly used in database datestamps)
|
||
* %s 305815200 Unix Epoch Time timestamp (same as the time() function)
|
||
* %x 02/05/09 Preferred date representation, without the time
|
||
*
|
||
* === Miscellaneous ===
|
||
* %n --- A newline character (\n)
|
||
* %t --- A Tab character (\t)
|
||
* %% --- A literal percentage character (%)
|
||
* </pre>
|
||
*/
|
||
|
||
jsDate.formats.php = {
|
||
codes: {
|
||
//
|
||
// 2-part regex matcher for format codes
|
||
//
|
||
// first match must be the character before the code (to account for escaping)
|
||
// second match must be the format code character(s)
|
||
//
|
||
matcher: /()%((%|[a-z]))/i,
|
||
// day
|
||
a: 'AbbrDayName',
|
||
A: 'DayName',
|
||
d: 'Date.2',
|
||
e: 'Date',
|
||
j: 'DayOfYear.3',
|
||
u: 'DayOfWeek',
|
||
w: 'Day',
|
||
// week
|
||
U: 'FullWeekOfYear.2',
|
||
V: 'IsoWeek.2',
|
||
W: 'WeekOfYear.2',
|
||
// month
|
||
b: 'AbbrMonthName',
|
||
B: 'MonthName',
|
||
m: 'MonthNumber.2',
|
||
h: 'AbbrMonthName',
|
||
// year
|
||
C: 'Century.2',
|
||
y: 'ShortYear.2',
|
||
Y: 'FullYear',
|
||
// time
|
||
H: 'Hours.2',
|
||
I: 'Hours12.2',
|
||
l: 'Hours12',
|
||
p: 'AMPM',
|
||
P: 'AmPm',
|
||
M: 'Minutes.2',
|
||
S: 'Seconds.2',
|
||
s: 'Unix',
|
||
O: 'TimezoneOffset',
|
||
z: 'GmtOffset',
|
||
Z: 'TimezoneAbbr'
|
||
},
|
||
|
||
shortcuts: {
|
||
D: '%m/%d/%y',
|
||
F: '%Y-%m-%d',
|
||
T: '%H:%M:%S',
|
||
X: '%H:%M:%S',
|
||
x: '%m/%d/%y',
|
||
R: '%H:%M',
|
||
r: '%I:%M:%S %p',
|
||
t: '\t',
|
||
n: '\n',
|
||
'%': '%'
|
||
}
|
||
};
|
||
//
|
||
// Conceptually, the logic implemented here is similar to Ken Snyder's Date Instance Methods.
|
||
// I use his idea of a set of parsers which can be regular expressions or functions,
|
||
// iterating through those, and then seeing if Date.parse() will create a date.
|
||
// The parser expressions and functions are a little different and some bugs have been
|
||
// worked out. Also, a lot of "pre-parsing" is done to fix implementation
|
||
// variations of Date.parse() between browsers.
|
||
//
|
||
jsDate.createDate = function(date) {
|
||
// if passing in multiple arguments, try Date constructor
|
||
if (date == null) {
|
||
return new Date();
|
||
}
|
||
// If the passed value is already a date object, return it
|
||
if (date instanceof Date) {
|
||
return date;
|
||
}
|
||
// if (typeof date == 'number') return new Date(date * 1000);
|
||
// If the passed value is an integer, interpret it as a javascript timestamp
|
||
if (typeof date == 'number') {
|
||
return new Date(date);
|
||
}
|
||
|
||
// Before passing strings into Date.parse(), have to normalize them for certain conditions.
|
||
// If strings are not formatted staccording to the EcmaScript spec, results from Date parse will be implementation dependent.
|
||
//
|
||
// For example:
|
||
// * FF and Opera assume 2 digit dates are pre y2k, Chome assumes <50 is pre y2k, 50+ is 21st century.
|
||
// * Chrome will correctly parse '1984-1-25' into localtime, FF and Opera will not parse.
|
||
// * Both FF, Chrome and Opera will parse '1984/1/25' into localtime.
|
||
|
||
// remove leading and trailing spaces
|
||
var parsable = String(date).replace(/^\s*(.+)\s*$/g, '$1');
|
||
|
||
// replace dahses (-) with slashes (/) in dates like n[nnn]/n[n]/n[nnn]
|
||
parsable = parsable.replace(/^([0-9]{1,4})-([0-9]{1,2})-([0-9]{1,4})/, "$1/$2/$3");
|
||
|
||
/////////
|
||
// Need to check for '15-Dec-09' also.
|
||
// FF will not parse, but Chrome will.
|
||
// Chrome will set date to 2009 as well.
|
||
/////////
|
||
|
||
// first check for 'dd-mmm-yyyy' or 'dd/mmm/yyyy' like '15-Dec-2010'
|
||
parsable = parsable.replace(/^(3[01]|[0-2]?\d)[-\/]([a-z]{3,})[-\/](\d{4})/i, "$1 $2 $3");
|
||
|
||
// Now check for 'dd-mmm-yy' or 'dd/mmm/yy' and normalize years to default century.
|
||
var match = parsable.match(/^(3[01]|[0-2]?\d)[-\/]([a-z]{3,})[-\/](\d{2})\D*/i);
|
||
if (match && match.length > 3) {
|
||
var m3 = parseFloat(match[3]);
|
||
var ny = jsDate.config.defaultCentury + m3;
|
||
ny = String(ny);
|
||
|
||
// now replace 2 digit year with 4 digit year
|
||
parsable = parsable.replace(/^(3[01]|[0-2]?\d)[-\/]([a-z]{3,})[-\/](\d{2})\D*/i, match[1] +' '+ match[2] +' '+ ny);
|
||
|
||
}
|
||
|
||
// Check for '1/19/70 8:14PM'
|
||
// where starts with mm/dd/yy or yy/mm/dd and have something after
|
||
// Check if 1st postiion is greater than 31, assume it is year.
|
||
// Assme all 2 digit years are 1900's.
|
||
// Finally, change them into US style mm/dd/yyyy representations.
|
||
match = parsable.match(/^([0-9]{1,2})[-\/]([0-9]{1,2})[-\/]([0-9]{1,2})[^0-9]/);
|
||
|
||
function h1(parsable, match) {
|
||
var m1 = parseFloat(match[1]);
|
||
var m2 = parseFloat(match[2]);
|
||
var m3 = parseFloat(match[3]);
|
||
var cent = jsDate.config.defaultCentury;
|
||
var ny, nd, nm, str;
|
||
|
||
if (m1 > 31) { // first number is a year
|
||
nd = m3;
|
||
nm = m2;
|
||
ny = cent + m1;
|
||
}
|
||
|
||
else { // last number is the year
|
||
nd = m2;
|
||
nm = m1;
|
||
ny = cent + m3;
|
||
}
|
||
|
||
str = nm+'/'+nd+'/'+ny;
|
||
|
||
// now replace 2 digit year with 4 digit year
|
||
return parsable.replace(/^([0-9]{1,2})[-\/]([0-9]{1,2})[-\/]([0-9]{1,2})/, str);
|
||
|
||
}
|
||
|
||
if (match && match.length > 3) {
|
||
parsable = h1(parsable, match);
|
||
}
|
||
|
||
// Now check for '1/19/70' with nothing after and do as above
|
||
var match = parsable.match(/^([0-9]{1,2})[-\/]([0-9]{1,2})[-\/]([0-9]{1,2})$/);
|
||
|
||
if (match && match.length > 3) {
|
||
parsable = h1(parsable, match);
|
||
}
|
||
|
||
|
||
var i = 0;
|
||
var length = jsDate.matchers.length;
|
||
var pattern,
|
||
ms,
|
||
current = parsable,
|
||
obj;
|
||
while (i < length) {
|
||
ms = Date.parse(current);
|
||
if (!isNaN(ms)) {
|
||
return new Date(ms);
|
||
}
|
||
pattern = jsDate.matchers[i];
|
||
if (typeof pattern == 'function') {
|
||
obj = pattern.call(jsDate, current);
|
||
if (obj instanceof Date) {
|
||
return obj;
|
||
}
|
||
} else {
|
||
current = parsable.replace(pattern[0], pattern[1]);
|
||
}
|
||
i++;
|
||
}
|
||
return NaN;
|
||
};
|
||
|
||
|
||
/**
|
||
* @static
|
||
* Handy static utility function to return the number of days in a given month.
|
||
* @param {Integer} year Year
|
||
* @param {Integer} month Month (1-12)
|
||
* @returns {Integer} Number of days in the month.
|
||
*/
|
||
//
|
||
// handy utility method Borrowed right from Ken Snyder's Date Instance Mehtods.
|
||
//
|
||
jsDate.daysInMonth = function(year, month) {
|
||
if (month == 2) {
|
||
return new Date(year, 1, 29).getDate() == 29 ? 29 : 28;
|
||
}
|
||
return [undefined,31,undefined,31,30,31,30,31,31,30,31,30,31][month];
|
||
};
|
||
|
||
|
||
//
|
||
// An Array of regular expressions or functions that will attempt to match the date string.
|
||
// Functions are called with scope of a jsDate instance.
|
||
//
|
||
jsDate.matchers = [
|
||
// convert dd.mmm.yyyy to mm/dd/yyyy (world date to US date).
|
||
[/(3[01]|[0-2]\d)\s*\.\s*(1[0-2]|0\d)\s*\.\s*([1-9]\d{3})/, '$2/$1/$3'],
|
||
// convert yyyy-mm-dd to mm/dd/yyyy (ISO date to US date).
|
||
[/([1-9]\d{3})\s*-\s*(1[0-2]|0\d)\s*-\s*(3[01]|[0-2]\d)/, '$2/$3/$1'],
|
||
// Handle 12 hour or 24 hour time with milliseconds am/pm and optional date part.
|
||
function(str) {
|
||
var match = str.match(/^(?:(.+)\s+)?([012]?\d)(?:\s*\:\s*(\d\d))?(?:\s*\:\s*(\d\d(\.\d*)?))?\s*(am|pm)?\s*$/i);
|
||
// opt. date hour opt. minute opt. second opt. msec opt. am or pm
|
||
if (match) {
|
||
if (match[1]) {
|
||
var d = this.createDate(match[1]);
|
||
if (isNaN(d)) {
|
||
return;
|
||
}
|
||
} else {
|
||
var d = new Date();
|
||
d.setMilliseconds(0);
|
||
}
|
||
var hour = parseFloat(match[2]);
|
||
if (match[6]) {
|
||
hour = match[6].toLowerCase() == 'am' ? (hour == 12 ? 0 : hour) : (hour == 12 ? 12 : hour + 12);
|
||
}
|
||
d.setHours(hour, parseInt(match[3] || 0, 10), parseInt(match[4] || 0, 10), ((parseFloat(match[5] || 0)) || 0)*1000);
|
||
return d;
|
||
}
|
||
else {
|
||
return str;
|
||
}
|
||
},
|
||
// Handle ISO timestamp with time zone.
|
||
function(str) {
|
||
var match = str.match(/^(?:(.+))[T|\s+]([012]\d)(?:\:(\d\d))(?:\:(\d\d))(?:\.\d+)([\+\-]\d\d\:\d\d)$/i);
|
||
if (match) {
|
||
if (match[1]) {
|
||
var d = this.createDate(match[1]);
|
||
if (isNaN(d)) {
|
||
return;
|
||
}
|
||
} else {
|
||
var d = new Date();
|
||
d.setMilliseconds(0);
|
||
}
|
||
var hour = parseFloat(match[2]);
|
||
d.setHours(hour, parseInt(match[3], 10), parseInt(match[4], 10), parseFloat(match[5])*1000);
|
||
return d;
|
||
}
|
||
else {
|
||
return str;
|
||
}
|
||
},
|
||
// Try to match ambiguous strings like 12/8/22.
|
||
// Use FF date assumption that 2 digit years are 20th century (i.e. 1900's).
|
||
// This may be redundant with pre processing of date already performed.
|
||
function(str) {
|
||
var match = str.match(/^([0-3]?\d)\s*[-\/.\s]{1}\s*([a-zA-Z]{3,9})\s*[-\/.\s]{1}\s*([0-3]?\d)$/);
|
||
if (match) {
|
||
var d = new Date();
|
||
var cent = jsDate.config.defaultCentury;
|
||
var m1 = parseFloat(match[1]);
|
||
var m3 = parseFloat(match[3]);
|
||
var ny, nd, nm;
|
||
if (m1 > 31) { // first number is a year
|
||
nd = m3;
|
||
ny = cent + m1;
|
||
}
|
||
|
||
else { // last number is the year
|
||
nd = m1;
|
||
ny = cent + m3;
|
||
}
|
||
|
||
var nm = inArray(match[2], jsDate.regional[jsDate.regional.getLocale()]["monthNamesShort"]);
|
||
|
||
if (nm == -1) {
|
||
nm = inArray(match[2], jsDate.regional[jsDate.regional.getLocale()]["monthNames"]);
|
||
}
|
||
|
||
d.setFullYear(ny, nm, nd);
|
||
d.setHours(0,0,0,0);
|
||
return d;
|
||
}
|
||
|
||
else {
|
||
return str;
|
||
}
|
||
}
|
||
];
|
||
|
||
//
|
||
// I think John Reisig published this method on his blog, ejohn.
|
||
//
|
||
function inArray( elem, array ) {
|
||
if ( array.indexOf ) {
|
||
return array.indexOf( elem );
|
||
}
|
||
|
||
for ( var i = 0, length = array.length; i < length; i++ ) {
|
||
if ( array[ i ] === elem ) {
|
||
return i;
|
||
}
|
||
}
|
||
|
||
return -1;
|
||
}
|
||
|
||
//
|
||
// Thanks to Kangax, Christian Sciberras and Stack Overflow for this method.
|
||
//
|
||
function get_type(thing){
|
||
if(thing===null) return "[object Null]"; // special case
|
||
return Object.prototype.toString.call(thing);
|
||
}
|
||
|
||
$.jsDate = jsDate;
|
||
|
||
|
||
/**
|
||
* JavaScript printf/sprintf functions.
|
||
*
|
||
* This code has been adapted from the publicly available sprintf methods
|
||
* by Ash Searle. His original header follows:
|
||
*
|
||
* This code is unrestricted: you are free to use it however you like.
|
||
*
|
||
* The functions should work as expected, performing left or right alignment,
|
||
* truncating strings, outputting numbers with a required precision etc.
|
||
*
|
||
* For complex cases, these functions follow the Perl implementations of
|
||
* (s)printf, allowing arguments to be passed out-of-order, and to set the
|
||
* precision or length of the output based on arguments instead of fixed
|
||
* numbers.
|
||
*
|
||
* See http://perldoc.perl.org/functions/sprintf.html for more information.
|
||
*
|
||
* Implemented:
|
||
* - zero and space-padding
|
||
* - right and left-alignment,
|
||
* - base X prefix (binary, octal and hex)
|
||
* - positive number prefix
|
||
* - (minimum) width
|
||
* - precision / truncation / maximum width
|
||
* - out of order arguments
|
||
*
|
||
* Not implemented (yet):
|
||
* - vector flag
|
||
* - size (bytes, words, long-words etc.)
|
||
*
|
||
* Will not implement:
|
||
* - %n or %p (no pass-by-reference in JavaScript)
|
||
*
|
||
* @version 2007.04.27
|
||
* @author Ash Searle
|
||
*
|
||
* You can see the original work and comments on his blog:
|
||
* http://hexmen.com/blog/2007/03/printf-sprintf/
|
||
* http://hexmen.com/js/sprintf.js
|
||
*/
|
||
|
||
/**
|
||
* @Modifications 2009.05.26
|
||
* @author Chris Leonello
|
||
*
|
||
* Added %p %P specifier
|
||
* Acts like %g or %G but will not add more significant digits to the output than present in the input.
|
||
* Example:
|
||
* Format: '%.3p', Input: 0.012, Output: 0.012
|
||
* Format: '%.3g', Input: 0.012, Output: 0.0120
|
||
* Format: '%.4p', Input: 12.0, Output: 12.0
|
||
* Format: '%.4g', Input: 12.0, Output: 12.00
|
||
* Format: '%.4p', Input: 4.321e-5, Output: 4.321e-5
|
||
* Format: '%.4g', Input: 4.321e-5, Output: 4.3210e-5
|
||
*
|
||
* Example:
|
||
* >>> $.jqplot.sprintf('%.2f, %d', 23.3452, 43.23)
|
||
* "23.35, 43"
|
||
* >>> $.jqplot.sprintf("no value: %n, decimal with thousands separator: %'d", 23.3452, 433524)
|
||
* "no value: , decimal with thousands separator: 433,524"
|
||
*/
|
||
$.jqplot.sprintf = function() {
|
||
function pad(str, len, chr, leftJustify) {
|
||
var padding = (str.length >= len) ? '' : Array(1 + len - str.length >>> 0).join(chr);
|
||
return leftJustify ? str + padding : padding + str;
|
||
|
||
}
|
||
|
||
function thousand_separate(value) {
|
||
var value_str = new String(value);
|
||
for (var i=10; i>0; i--) {
|
||
if (value_str == (value_str = value_str.replace(/^(\d+)(\d{3})/, "$1"+$.jqplot.sprintf.thousandsSeparator+"$2"))) break;
|
||
}
|
||
return value_str;
|
||
}
|
||
|
||
function justify(value, prefix, leftJustify, minWidth, zeroPad, htmlSpace) {
|
||
var diff = minWidth - value.length;
|
||
if (diff > 0) {
|
||
var spchar = ' ';
|
||
if (htmlSpace) { spchar = ' '; }
|
||
if (leftJustify || !zeroPad) {
|
||
value = pad(value, minWidth, spchar, leftJustify);
|
||
} else {
|
||
value = value.slice(0, prefix.length) + pad('', diff, '0', true) + value.slice(prefix.length);
|
||
}
|
||
}
|
||
return value;
|
||
}
|
||
|
||
function formatBaseX(value, base, prefix, leftJustify, minWidth, precision, zeroPad, htmlSpace) {
|
||
// Note: casts negative numbers to positive ones
|
||
var number = value >>> 0;
|
||
prefix = prefix && number && {'2': '0b', '8': '0', '16': '0x'}[base] || '';
|
||
value = prefix + pad(number.toString(base), precision || 0, '0', false);
|
||
return justify(value, prefix, leftJustify, minWidth, zeroPad, htmlSpace);
|
||
}
|
||
|
||
function formatString(value, leftJustify, minWidth, precision, zeroPad, htmlSpace) {
|
||
if (precision != null) {
|
||
value = value.slice(0, precision);
|
||
}
|
||
return justify(value, '', leftJustify, minWidth, zeroPad, htmlSpace);
|
||
}
|
||
|
||
var a = arguments, i = 0, format = a[i++];
|
||
|
||
return format.replace($.jqplot.sprintf.regex, function(substring, valueIndex, flags, minWidth, _, precision, type) {
|
||
if (substring == '%%') { return '%'; }
|
||
|
||
// parse flags
|
||
var leftJustify = false, positivePrefix = '', zeroPad = false, prefixBaseX = false, htmlSpace = false, thousandSeparation = false;
|
||
for (var j = 0; flags && j < flags.length; j++) switch (flags.charAt(j)) {
|
||
case ' ': positivePrefix = ' '; break;
|
||
case '+': positivePrefix = '+'; break;
|
||
case '-': leftJustify = true; break;
|
||
case '0': zeroPad = true; break;
|
||
case '#': prefixBaseX = true; break;
|
||
case '&': htmlSpace = true; break;
|
||
case '\'': thousandSeparation = true; break;
|
||
}
|
||
|
||
// parameters may be null, undefined, empty-string or real valued
|
||
// we want to ignore null, undefined and empty-string values
|
||
|
||
if (!minWidth) {
|
||
minWidth = 0;
|
||
}
|
||
else if (minWidth == '*') {
|
||
minWidth = +a[i++];
|
||
}
|
||
else if (minWidth.charAt(0) == '*') {
|
||
minWidth = +a[minWidth.slice(1, -1)];
|
||
}
|
||
else {
|
||
minWidth = +minWidth;
|
||
}
|
||
|
||
// Note: undocumented perl feature:
|
||
if (minWidth < 0) {
|
||
minWidth = -minWidth;
|
||
leftJustify = true;
|
||
}
|
||
|
||
if (!isFinite(minWidth)) {
|
||
throw new Error('$.jqplot.sprintf: (minimum-)width must be finite');
|
||
}
|
||
|
||
if (!precision) {
|
||
precision = 'fFeE'.indexOf(type) > -1 ? 6 : (type == 'd') ? 0 : void(0);
|
||
}
|
||
else if (precision == '*') {
|
||
precision = +a[i++];
|
||
}
|
||
else if (precision.charAt(0) == '*') {
|
||
precision = +a[precision.slice(1, -1)];
|
||
}
|
||
else {
|
||
precision = +precision;
|
||
}
|
||
|
||
// grab value using valueIndex if required?
|
||
var value = valueIndex ? a[valueIndex.slice(0, -1)] : a[i++];
|
||
|
||
switch (type) {
|
||
case 's': {
|
||
if (value == null) {
|
||
return '';
|
||
}
|
||
return formatString(String(value), leftJustify, minWidth, precision, zeroPad, htmlSpace);
|
||
}
|
||
case 'c': return formatString(String.fromCharCode(+value), leftJustify, minWidth, precision, zeroPad, htmlSpace);
|
||
case 'b': return formatBaseX(value, 2, prefixBaseX, leftJustify, minWidth, precision, zeroPad,htmlSpace);
|
||
case 'o': return formatBaseX(value, 8, prefixBaseX, leftJustify, minWidth, precision, zeroPad, htmlSpace);
|
||
case 'x': return formatBaseX(value, 16, prefixBaseX, leftJustify, minWidth, precision, zeroPad, htmlSpace);
|
||
case 'X': return formatBaseX(value, 16, prefixBaseX, leftJustify, minWidth, precision, zeroPad, htmlSpace).toUpperCase();
|
||
case 'u': return formatBaseX(value, 10, prefixBaseX, leftJustify, minWidth, precision, zeroPad, htmlSpace);
|
||
case 'i': {
|
||
var number = parseInt(+value, 10);
|
||
if (isNaN(number)) {
|
||
return '';
|
||
}
|
||
var prefix = number < 0 ? '-' : positivePrefix;
|
||
var number_str = thousandSeparation ? thousand_separate(String(Math.abs(number))): String(Math.abs(number));
|
||
value = prefix + pad(number_str, precision, '0', false);
|
||
//value = prefix + pad(String(Math.abs(number)), precision, '0', false);
|
||
return justify(value, prefix, leftJustify, minWidth, zeroPad, htmlSpace);
|
||
}
|
||
case 'd': {
|
||
var number = Math.round(+value);
|
||
if (isNaN(number)) {
|
||
return '';
|
||
}
|
||
var prefix = number < 0 ? '-' : positivePrefix;
|
||
var number_str = thousandSeparation ? thousand_separate(String(Math.abs(number))): String(Math.abs(number));
|
||
value = prefix + pad(number_str, precision, '0', false);
|
||
return justify(value, prefix, leftJustify, minWidth, zeroPad, htmlSpace);
|
||
}
|
||
case 'e':
|
||
case 'E':
|
||
case 'f':
|
||
case 'F':
|
||
case 'g':
|
||
case 'G':
|
||
{
|
||
var number = +value;
|
||
if (isNaN(number)) {
|
||
return '';
|
||
}
|
||
var prefix = number < 0 ? '-' : positivePrefix;
|
||
var method = ['toExponential', 'toFixed', 'toPrecision']['efg'.indexOf(type.toLowerCase())];
|
||
var textTransform = ['toString', 'toUpperCase']['eEfFgG'.indexOf(type) % 2];
|
||
var number_str = Math.abs(number)[method](precision);
|
||
number_str = thousandSeparation ? thousand_separate(number_str): number_str;
|
||
value = prefix + number_str;
|
||
return justify(value, prefix, leftJustify, minWidth, zeroPad, htmlSpace)[textTransform]();
|
||
}
|
||
case 'p':
|
||
case 'P':
|
||
{
|
||
// make sure number is a number
|
||
var number = +value;
|
||
if (isNaN(number)) {
|
||
return '';
|
||
}
|
||
var prefix = number < 0 ? '-' : positivePrefix;
|
||
|
||
var parts = String(Number(Math.abs(number)).toExponential()).split(/e|E/);
|
||
var sd = (parts[0].indexOf('.') != -1) ? parts[0].length - 1 : parts[0].length;
|
||
var zeros = (parts[1] < 0) ? -parts[1] - 1 : 0;
|
||
|
||
if (Math.abs(number) < 1) {
|
||
if (sd + zeros <= precision) {
|
||
value = prefix + Math.abs(number).toPrecision(sd);
|
||
}
|
||
else {
|
||
if (sd <= precision - 1) {
|
||
value = prefix + Math.abs(number).toExponential(sd-1);
|
||
}
|
||
else {
|
||
value = prefix + Math.abs(number).toExponential(precision-1);
|
||
}
|
||
}
|
||
}
|
||
else {
|
||
var prec = (sd <= precision) ? sd : precision;
|
||
value = prefix + Math.abs(number).toPrecision(prec);
|
||
}
|
||
var textTransform = ['toString', 'toUpperCase']['pP'.indexOf(type) % 2];
|
||
return justify(value, prefix, leftJustify, minWidth, zeroPad, htmlSpace)[textTransform]();
|
||
}
|
||
case 'n': return '';
|
||
default: return substring;
|
||
}
|
||
});
|
||
};
|
||
|
||
$.jqplot.sprintf.thousandsSeparator = ',';
|
||
|
||
$.jqplot.sprintf.regex = /%%|%(\d+\$)?([-+#0&\' ]*)(\*\d+\$|\*|\d+)?(\.(\*\d+\$|\*|\d+))?([nAscboxXuidfegpEGP])/g;
|
||
|
||
$.jqplot.getSignificantFigures = function(number) {
|
||
var parts = String(Number(Math.abs(number)).toExponential()).split(/e|E/);
|
||
// total significant digits
|
||
var sd = (parts[0].indexOf('.') != -1) ? parts[0].length - 1 : parts[0].length;
|
||
var zeros = (parts[1] < 0) ? -parts[1] - 1 : 0;
|
||
// exponent
|
||
var expn = parseInt(parts[1]);
|
||
// digits to the left of the decimal place
|
||
var dleft = (expn + 1 > 0) ? expn + 1 : 0;
|
||
// digits to the right of the decimal place
|
||
var dright = (sd <= dleft) ? 0 : sd - expn - 1;
|
||
return {significantDigits: sd, digitsLeft: dleft, digitsRight: dright, zeros: zeros, exponent: expn} ;
|
||
};
|
||
|
||
$.jqplot.getPrecision = function(number) {
|
||
var arr = $.jqplot.getSignificantFigures(number);
|
||
var p = arr[1] - 1 - parseInt(arr[0][1]);
|
||
return p;
|
||
};
|
||
|
||
})(jQuery);
|