jqwidgets-ng
Version:
[](https://jqwidgets.com/license/)
1,227 lines (960 loc) • 1.45 MB
JavaScript
/* Release Date: May-26-2025
Copyright (c) 2011-2025 jQWidgets.
License: https://jqwidgets.com/license/ */
/******/ (() => { // webpackBootstrap
/******/ var __webpack_modules__ = ({
/***/ 675:
/***/ (() => {
/* tslint:disable */
/* eslint-disable */
(function(){
if (typeof document === 'undefined') {
return;
}
(function ($) {
$.extend($.jqx._jqxChart.prototype,
{
_moduleAnnotations: true,
_renderAnnotation: function (groupIndex, annotation, rect) {
var group = this.seriesGroups[groupIndex];
var renderer = this.renderer;
if (isNaN(groupIndex))
return;
var x = this._get([this.getXAxisDataPointOffset(annotation.xValue, groupIndex), annotation.x]);
var y = this._get([this.getValueAxisDataPointOffset(annotation.yValue, groupIndex), annotation.y]);
var x2 = this._get([this.getXAxisDataPointOffset(annotation.xValue2, groupIndex), annotation.x2]);
var y2 = this._get([this.getValueAxisDataPointOffset(annotation.yValue2, groupIndex), annotation.y2]);
if (group.polar || group.spider) {
var point = this.getPolarDataPointOffset(annotation.xValue, annotation.yValue, groupIndex);
if (point && !isNaN(point.x) && !isNaN(point.y)) {
x = point.x;
y = point.y;
}
else {
x = annotation.x;
y = annotation.y;
}
}
if (isNaN(y) || isNaN(x))
return false;
if (group.orientation == 'horizontal') {
var tmp = x;
x = y;
y = tmp;
tmp = x2;
x2 = y2;
y2 = tmp;
}
if (annotation.offset) {
if (!isNaN(annotation.offset.x)) {
x += annotation.offset.x;
x2 += annotation.offset.x;
}
if (!isNaN(annotation.offset.y)) {
y += annotation.offset.y;
y2 += annotation.offset.y;
}
}
var width = this._get([annotation.width, x2 - x]);
var height = this._get([annotation.height, y2 - y]);
if (isNaN(width)) {
width = 90;
height = 20;
}
var shape;
switch (annotation.type) {
case 'rect':
shape = renderer.rect(x, y, width, height);
break;
case 'circle':
shape = renderer.rect(x, y, annotation.radius);
break;
case 'line':
shape = renderer.rect(x, y, x2, y2);
break;
case 'path':
shape = renderer.path(annotation.path);
break;
}
renderer.attr(shape,
{
fill: annotation.fillColor,
stroke: annotation.lineColor,
opacity: this._get([annotation.fillOpacity, annotation.opacity]),
'stroke-opacity': this._get([annotation.lineOpacity, annotation.opacity]),
'stroke-width': annotation.lineWidth,
'stroke-dasharray': annotation.dashStyle || 'none',
});
var txtElement;
if (annotation.text) {
var txt = annotation.text;
var xOffset = 0,
yOffset = 0;
if (txt.offset) {
if (!isNaN(txt.offset.x))
xOffset += txt.offset.x;
if (!isNaN(txt.offset.y))
yOffset += txt.offset.y;
}
txtElement = renderer.text(
txt.value,
x + xOffset,
y + yOffset,
NaN,
NaN,
txt.angle,
{},
txt.clip === true,
txt.horizontalAlignment || 'center',
txt.verticalAlignment || 'center',
txt.rotationPoint || 'centermiddle');
renderer.attr(txtElement,
{
fill: txt.fillColor,
stroke: txt.lineColor,
'class': txt['class']
});
}
var events = [
'click',
'mouseenter',
'mouseleave'
];
var self = this;
for (var i = 0; i < events.length; i++) {
var event = this._getEvent(events[i]) || events[i];
if (shape)
this.renderer.addHandler(shape, event, function () {
self._raiseAnnotationEvent(annotation, event);
}
);
if (txtElement)
this.renderer.addHandler(txtElement, event, function () {
self._raiseAnnotationEvent(annotation, event);
}
);
}
},
_raiseAnnotationEvent: function (annotation, event) {
this._raiseEvent('annotation_' + event, { annotation: annotation });
}
});
})(jqxBaseFramework);
})();
/***/ }),
/***/ 9815:
/***/ (() => {
/* tslint:disable */
/* eslint-disable */
(function(){
if (typeof document === 'undefined') {
return;
}
(function ($) {
$.extend($.jqx._jqxChart.prototype,
{
_moduleApi: true,
getItemsCount: function(groupIndex, serieIndex)
{
var g = this.seriesGroups[groupIndex];
if (!this._isSerieVisible(groupIndex, serieIndex))
return 0;
var renderData = this._renderData;
if (!g || !renderData || renderData.length <= groupIndex)
return 0;
var serie = g.series[serieIndex];
if (!serie)
return 0;
return renderData[groupIndex].offsets[serieIndex].length;
},
getXAxisRect: function(groupIndex)
{
var renderData = this._renderData;
if (!renderData || renderData.length <= groupIndex)
return undefined;
if (!renderData[groupIndex].xAxis)
return undefined;
return renderData[groupIndex].xAxis.rect;
},
getXAxisLabels: function(groupIndex)
{
var output = [];
var renderData = this._renderData;
if (!renderData || renderData.length <= groupIndex)
return output;
renderData = renderData[groupIndex].xAxis;
if (!renderData)
return output;
var group = this.seriesGroups[groupIndex];
if (group.polar || group.spider)
{
for (var i = 0; i < renderData.polarLabels.length; i++)
{
var label = renderData.polarLabels[i];
output.push({offset: {x: label.x, y: label.y}, value: label.value});
}
return output;
}
var xAxis = this._getXAxis(groupIndex);
var rect = this.getXAxisRect(groupIndex);
var swapPosition = xAxis.position == 'top' || xAxis.position == 'right';
var swapXY = group.orientation == 'horizontal';
for (var i = 0; i < renderData.data.length; i++)
{
if (swapXY)
output.push({offset: {x: rect.x + (swapPosition ? 0 : rect.width), y: rect.y + renderData.data.data[i]}, value: renderData.data.xvalues[i]});
else
output.push({offset: {x: rect.x + renderData.data.data[i], y: rect.y + (swapPosition ? rect.height : 0)}, value: renderData.data.xvalues[i]});
}
return output;
},
getValueAxisRect: function(groupIndex)
{
var renderData = this._renderData;
if (!renderData || renderData.length <= groupIndex)
return undefined;
if (!renderData[groupIndex].valueAxis)
return undefined;
return renderData[groupIndex].valueAxis.rect;
},
getValueAxisLabels: function(groupIndex)
{
var output = [];
var renderData = this._renderData;
if (!renderData || renderData.length <= groupIndex)
return output;
renderData = renderData[groupIndex].valueAxis;
if (!renderData)
return output;
var valueAxis = this._getValueAxis(groupIndex);
var swapPosition = valueAxis.position == 'top' || valueAxis.position == 'right';
var group = this.seriesGroups[groupIndex];
var swapXY = group.orientation == 'horizontal';
if (group.polar || group.spider)
{
for (var i = 0; i < renderData.polarLabels.length; i++)
{
var label = renderData.polarLabels[i];
output.push({offset: {x: label.x, y: label.y}, value: label.value});
}
return output;
}
for (var i = 0; i < renderData.items.length; i++)
{
if (swapXY)
{
output.push(
{
offset:
{
x: renderData.itemOffsets[renderData.items[i]].x + renderData.itemWidth/2,
y: renderData.rect.y + (swapPosition ? renderData.rect.height : 0)
},
value: renderData.items[i]
}
);
}
else
{
output.push(
{
offset:
{
x: renderData.rect.x + renderData.rect.width,
y: renderData.itemOffsets[renderData.items[i]].y + renderData.itemWidth/2
},
value: renderData.items[i]
}
);
}
}
return output;
},
getPlotAreaRect: function()
{
return this._plotRect;
},
getRect: function()
{
return this._rect;
},
showToolTip: function(groupIndex, serieIndex, itemIndex, showDelay, hideDelay)
{
var coord = this.getItemCoord(groupIndex, serieIndex, itemIndex);
if (isNaN(coord.x) || isNaN(coord.y))
return;
this._startTooltipTimer(groupIndex, serieIndex, itemIndex, coord.x, coord.y, showDelay, hideDelay);
},
hideToolTip: function(hideDelay)
{
if (isNaN(hideDelay))
hideDelay = 0;
var self = this;
self._cancelTooltipTimer();
setTimeout(function() {
self._hideToolTip(0);
},
hideDelay
);
},
});
})(jqxBaseFramework);
})();
/***/ }),
/***/ 7848:
/***/ (() => {
/* tslint:disable */
/* eslint-disable */
(function(){
if (typeof document === 'undefined') {
return;
}
(function ($) {
$.jqx.jqxWidget("jqxChart", "", {});
$.extend($.jqx._jqxChart.prototype,
{
defineInstance: function () {
$.extend(true, this, this._defaultSettings);
this._createColorsCache();
return this._defaultSettings;
},
_defaultSettings: {
title: 'Title',
description: 'Description',
source: [],
seriesGroups: [],
categoryAxis: null,
xAxis: {},
valueAxis: null,
renderEngine: '',
enableAnimations: true,
enableAxisTextAnimation: false,
backgroundImage: '',
background: '#FFFFFF',
padding: { left: 5, top: 5, right: 5, bottom: 5 },
backgroundColor: '#FFFFFF',
showBorderLine: true,
borderLineWidth: 1,
borderLineColor: null,
borderColor: null,
titlePadding: { left: 5, top: 5, right: 5, bottom: 10 },
showLegend: true,
legendLayout: null,
enabled: true,
colorScheme: 'scheme01',
animationDuration: 500,
showToolTips: true,
showToolTipsOnAllSeries: false,
toolTipShowDelay: 300,
toolTipDelay: 500,
toolTipHideDelay: 4000,
toolTipMoveDuration: 300,
toolTipFormatFunction: null,
toolTipAlignment: 'dataPoint',
localization: null,
columnSeriesOverlap: false,
rtl: false,
legendPosition: null,
greyScale: false,
axisPadding: 5,
enableCrosshairs: false,
crosshairsColor: '#BCBCBC',
crosshairsDashStyle: '2,2',
crosshairsLineWidth: 1.0,
enableEvents: true,
_itemsToggleState: [],
_isToggleRefresh: false,
_isSelectorRefresh: false,
_sliders: [],
_selectorRange: [],
_rangeSelectorInstances: {},
_resizeState: {},
renderer: null,
_isRangeSelectorInstance: false,
drawBefore: null,
draw: null,
_renderData: {},
enableSampling: true
},
_defaultLineColor: '#BCBCBC',
_touchEvents: {
'mousedown': $.jqx.mobile.getTouchEventName('touchstart'),
'click': $.jqx.mobile.getTouchEventName('touchstart'),
'mouseup': $.jqx.mobile.getTouchEventName('touchend'),
'mousemove': $.jqx.mobile.getTouchEventName('touchmove'),
'mouseenter': 'mouseenter',
'mouseleave': 'mouseleave'
},
_getEvent: function (event) {
if (this._isTouchDevice) {
return this._touchEvents[event];
} else {
return event;
}
},
destroy: function () {
this.host.remove();
},
_jqxPlot: null,
createInstance: function (args) {
if (!$.jqx.dataAdapter)
throw 'jqxdata.js is not loaded';
var self = this;
self._refreshOnDownloadComlete();
self._isTouchDevice = $.jqx.mobile.isTouchDevice();
if (!self._jqxPlot)
self._jqxPlot = new jqxPlot();
self.addHandler(self.host, self._getEvent('mousemove'), function (event) {
if (self.enabled == false)
return;
if (!self._isRangeSelectorInstance)
self.host.css('cursor', 'default');
//event.preventDefault();
var x = event.pageX || event.clientX || event.screenX;
var y = event.pageY || event.clientY || event.screenY;
var pos = self.host.offset();
if (self._isTouchDevice) {
var cursorPos = $.jqx.position(event);
x = cursorPos.left;
y = cursorPos.top;
}
x -= pos.left;
y -= pos.top;
self.onmousemove(x, y);
});
self.addHandler(self.host, self._getEvent('mouseleave'), function (event) {
if (self.enabled == false)
return;
var x = self._mouseX;
var y = self._mouseY;
var rect = self._plotRect;
if (rect && x >= rect.x && x <= rect.x + rect.width && y >= rect.y && y <= rect.y + rect.height)
return;
self._cancelTooltipTimer();
self._hideToolTip(0);
self._unselect();
});
self.addHandler(self.host, 'click', function (event) {
if (self.enabled == false)
return;
var x = event.pageX || event.clientX || event.screenX;
var y = event.pageY || event.clientY || event.screenY;
var pos = self.host.offset();
if (self._isTouchDevice) {
var cursorPos = $.jqx.position(event);
x = cursorPos.left;
y = cursorPos.top;
}
x -= pos.left;
y -= pos.top;
self._mouseX = x;
self._mouseY = y;
if (!isNaN(self._lastClickTs)) {
if ((new Date()).valueOf() - self._lastClickTs < 100)
return;
}
this._hostClickTimer = setTimeout(function () {
if (!self._isTouchDevice) {
self._cancelTooltipTimer();
self._hideToolTip();
self._unselect();
}
if (self._pointMarker && self._pointMarker.element) {
var group = self.seriesGroups[self._pointMarker.gidx];
var serie = group.series[self._pointMarker.sidx];
event.stopImmediatePropagation();
self._raiseItemEvent('click', group, serie, self._pointMarker.iidx);
}
},
100);
});
var elementStyle = self.element.style;
if (elementStyle) {
var sizeInPercentage = false;
if (elementStyle.width != null)
sizeInPercentage |= elementStyle.width.toString().indexOf('%') != -1;
if (elementStyle.height != null)
sizeInPercentage |= elementStyle.height.toString().indexOf('%') != -1;
if (sizeInPercentage) {
$.jqx.utilities.resize(this.host, function () {
if (self.timer)
clearTimeout(self.timer);
var delay = 1;
self.timer = setTimeout(function () {
var tmp = self.enableAnimations;
self.enableAnimations = false;
self.refresh();
self.enableAnimations = tmp;
}, delay);
}, false, true);
}
}
}, // createInstance
/** @private */
_refreshOnDownloadComlete: function () {
var self = this;
var source = this.source;
if (source instanceof $.jqx.dataAdapter) {
var adapteroptions = source._options;
if (adapteroptions == undefined || (adapteroptions != undefined && !adapteroptions.autoBind)) {
source.autoSync = false;
source.dataBind();
}
var elementId = this.element.id;
if (source.records.length == 0) {
var updateFunc = function () {
// sends a callback function to the user. This allows him to add additional initialization logic before the chart is rendered.
if (self.ready)
self.ready();
self.refresh();
};
source.unbindDownloadComplete(elementId);
source.bindDownloadComplete(elementId, updateFunc);
}
else {
// sends a callback function to the user. This allows him to add additional initialization logic before the chart is rendered.
if (self.ready)
self.ready();
}
source.unbindBindingUpdate(elementId);
source.bindBindingUpdate(elementId, function () {
if (self._supressBindingRefresh)
return;
self.refresh();
});
}
},
propertyChangedHandler: function (object, key, oldvalue, value) {
if (this.isInitialized == undefined || this.isInitialized == false)
return;
if (key == 'source')
this._refreshOnDownloadComlete();
this.refresh();
},
/** @private */
_initRenderer: function (host) {
if (!$.jqx.createRenderer)
throw 'Please include jqxdraw.js';
return $.jqx.createRenderer(this, host);
},
/** @private */
_internalRefresh: function () {
var self = this;
// validate visiblity
if ($.jqx.isHidden(self.host))
return;
self._stopAnimations();
if (!self.renderer || (!self._isToggleRefresh && !self._isUpdate)) {
self._hideToolTip(0);
self._isVML = false;
self.host.empty();
self._measureDiv = undefined;
self._initRenderer(self.host);
}
var renderer = self.renderer;
if (!renderer)
return;
var rect = renderer.getRect();
self._render({ x: 1, y: 1, width: rect.width, height: rect.height });
this._raiseEvent('refreshBegin', { instance: this });
if (renderer instanceof $.jqx.HTML5Renderer)
renderer.refresh();
self._isUpdate = false;
this._raiseEvent('refreshEnd', { instance: this });
},
saveAsPNG: function (filename, exportServer, isUploadOnly) {
return this._saveAsImage('png', filename, exportServer, isUploadOnly);
},
saveAsJPEG: function (filename, exportServer, isUploadOnly) {
return this._saveAsImage('jpeg', filename, exportServer, isUploadOnly);
},
saveAsPDF: function (filename, exportServer, isUploadOnly) {
return this._saveAsImage('pdf', filename, exportServer, isUploadOnly);
},
/** @private */
_saveAsImage: function (type, fileName, exportServer, isUploadOnly) {
var hasRangeSelector = false;
for (var i = 0; i < this.seriesGroups.length && !hasRangeSelector; i++) {
var xAxis = this._getXAxis(i);
if (xAxis && xAxis.rangeSelector)
hasRangeSelector = true;
}
return $.jqx._widgetToImage(this, type, fileName, exportServer, isUploadOnly, hasRangeSelector ? this._selectorSaveAsImageCallback : undefined);
},
_selectorSaveAsImageCallback: function (instance, canvas) {
var self = instance;
for (var i = 0; i < self.seriesGroups.length; i++) {
var xAxis = self._getXAxis(i);
if (!xAxis || !xAxis.rangeSelector || xAxis.rangeSelector.renderTo)
continue;
var selectorInstanceRef = self._rangeSelectorInstances[i];
if (!selectorInstanceRef)
continue;
var selectorInstance = selectorInstanceRef.jqxChart('getInstance');
var renderEngineSave = selectorInstance.renderEngine;
var rect = selectorInstance.renderer.getRect();
var selectorCanvas = selectorInstance.renderer.getContainer().find('canvas')[0];
var selectorContext = selectorCanvas.getContext('2d');
var slider = self._sliders[i];
var swapXY = self.seriesGroups[i].orientation == 'horizontal';
var widthProp = !swapXY ? 'width' : 'height';
var rwidthProp = swapXY ? 'width' : 'height';
var posProp = !swapXY ? 'x' : 'y';
var rposProp = swapXY ? 'x' : 'y';
var selectedRect = {};
selectedRect[posProp] = slider.startOffset + slider.rect[posProp];
selectedRect[rposProp] = slider.rect[rposProp];
selectedRect[widthProp] = slider.endOffset - slider.startOffset;
selectedRect[rwidthProp] = slider.rect[rwidthProp];
var colorSelectedRange = xAxis.rangeSelector.colorSelectedRange || 'blue';
var colorUnselectedRange = xAxis.rangeSelector.colorUnselectedRange || 'white';
var colorRangeLineColor = xAxis.rangeSelector.colorRangeLine || 'grey';
var elements = [];
elements.push(selectorInstance.renderer.rect(selectedRect.x, selectedRect.y, selectedRect.width, selectedRect.height, { fill: colorSelectedRange, opacity: 0.1 }));
if (!swapXY) {
elements.push(selectorInstance.renderer.line($.jqx._ptrnd(slider.rect.x), $.jqx._ptrnd(slider.rect.y), $.jqx._ptrnd(selectedRect.x), $.jqx._ptrnd(slider.rect.y), { stroke: colorRangeLineColor, opacity: 0.5 }));
elements.push(selectorInstance.renderer.line($.jqx._ptrnd(selectedRect.x + selectedRect.width), $.jqx._ptrnd(slider.rect.y), $.jqx._ptrnd(slider.rect.x + slider.rect.width), $.jqx._ptrnd(slider.rect.y), { stroke: colorRangeLineColor, opacity: 0.5 }));
elements.push(selectorInstance.renderer.line($.jqx._ptrnd(selectedRect.x), $.jqx._ptrnd(slider.rect.y), $.jqx._ptrnd(selectedRect.x), $.jqx._ptrnd(slider.rect.y + slider.rect.height), { stroke: colorRangeLineColor, opacity: 0.5 }));
elements.push(selectorInstance.renderer.line($.jqx._ptrnd(selectedRect.x + selectedRect.width), $.jqx._ptrnd(slider.rect.y), $.jqx._ptrnd(selectedRect.x + selectedRect.width), $.jqx._ptrnd(slider.rect.y + slider.rect.height), { stroke: colorRangeLineColor, opacity: 0.5 }));
}
else {
elements.push(selectorInstance.renderer.line($.jqx._ptrnd(slider.rect.x + slider.rect.width), $.jqx._ptrnd(slider.rect.y), $.jqx._ptrnd(slider.rect.x + slider.rect.width), $.jqx._ptrnd(selectedRect.y), { stroke: colorRangeLineColor, opacity: 0.5 }));
elements.push(selectorInstance.renderer.line($.jqx._ptrnd(slider.rect.x + slider.rect.width), $.jqx._ptrnd(selectedRect.y + selectedRect.height), $.jqx._ptrnd(slider.rect.x + slider.rect.width), $.jqx._ptrnd(slider.rect.y + slider.rect.height), { stroke: colorRangeLineColor, opacity: 0.5 }));
elements.push(selectorInstance.renderer.line($.jqx._ptrnd(slider.rect.x), $.jqx._ptrnd(selectedRect.y), $.jqx._ptrnd(slider.rect.x + slider.rect.width), $.jqx._ptrnd(selectedRect.y), { stroke: colorRangeLineColor, opacity: 0.5 }));
elements.push(selectorInstance.renderer.line($.jqx._ptrnd(slider.rect.x), $.jqx._ptrnd(selectedRect.y + selectedRect.height), $.jqx._ptrnd(slider.rect.x + slider.rect.width), $.jqx._ptrnd(selectedRect.y + selectedRect.height), { stroke: colorRangeLineColor, opacity: 0.5 }));
}
selectorInstance.renderer.refresh();
var imgdata = selectorContext.getImageData(rect.x, rect.y, rect.width, rect.height);
var hostContext = canvas.getContext('2d');
hostContext.putImageData(
imgdata,
parseInt(selectorInstanceRef.css('left')),
parseInt(selectorInstanceRef.css('top')),
1,
1,
rect.width,
rect.height);
for (var j = 0; j < elements.length; j++)
selectorInstance.renderer.removeElement(elements[j]);
selectorInstance.renderer.refresh();
}
return true;
},
refresh: function () {
this._internalRefresh();
},
update: function () {
this._isUpdate = true;
this._internalRefresh();
},
/** @private */
_seriesTypes: [
'line', 'stackedline', 'stackedline100',
'spline', 'stackedspline', 'stackedspline100',
'stepline', 'stackedstepline', 'stackedstepline100',
'area', 'stackedarea', 'stackedarea100',
'splinearea', 'stackedsplinearea', 'stackedsplinearea100',
'steparea', 'stackedsteparea', 'stackedsteparea100',
'rangearea', 'splinerangearea', 'steprangearea',
'column', 'stackedcolumn', 'stackedcolumn100', 'rangecolumn',
'scatter', 'stackedscatter', 'stackedscatter100',
'bubble', 'stackedbubble', 'stackedbubble100',
'pie',
'donut',
'candlestick',
'ohlc',
'waterfall', 'stackedwaterfall'],
clear: function () {
var self = this;
for (var setting in self._defaultSettings)
self[setting] = self._defaultSettings[setting];
self.title = '';
self.description = '';
self.refresh();
},
_validateSeriesGroups: function () {
if (!$.isArray(this.seriesGroups))
throw 'Invalid property: \'seriesGroups\' property is required and must be a valid array.';
for (var i = 0; i < this.seriesGroups.length; i++) {
var group = this.seriesGroups[i];
if (!group.type)
throw 'Invalid property: Each series group must have a valid \'type\' property.'
if (!$.isArray(group.series))
throw 'Invalid property: Each series group must have a \'series\' property which must be a valid array.'
}
},
/** @private */
_render: function (rect) {
var self = this;
var renderer = self.renderer;
self._validateSeriesGroups();
self._colorsCache.clear();
if (!self._isToggleRefresh && self._isUpdate && self._renderData)
self._renderDataClone();
self._renderData = [];
renderer.clear();
self._unselect();
self._hideToolTip(0);
var bckgImg = self.backgroundImage;
if (bckgImg == undefined || bckgImg == '')
self.host.css({ 'background-image': '' });
else
self.host.css({ 'background-image': (bckgImg.indexOf('(') != -1 ? bckgImg : "url('" + bckgImg + "')") });
self._rect = rect;
var padding = self.padding || { left: 5, top: 5, right: 5, bottom: 5 };
var clipAll = renderer.createClipRect(rect);
var groupAll = renderer.beginGroup();
renderer.setClip(groupAll, clipAll);
var rFill = renderer.rect(rect.x, rect.y, rect.width - 2, rect.height - 2);
if (bckgImg == undefined || bckgImg == '')
renderer.attr(rFill, { fill: self.backgroundColor || self.background || 'white' });
else
renderer.attr(rFill, { fill: 'transparent' });
if (self.showBorderLine != false) {
var borderColor = self.borderLineColor == undefined ? self.borderColor : self.borderLineColor;
if (borderColor == undefined)
borderColor = self._defaultLineColor;
var borderLineWidth = this.borderLineWidth;
if (isNaN(borderLineWidth) || borderLineWidth < 0 || borderLineWidth > 10)
borderLineWidth = 1;
renderer.attr(rFill, { 'stroke-width': borderLineWidth, stroke: borderColor });
}
else {
if ($.jqx.browser.msie && $.jqx.browser.version < 9) {
renderer.attr(rFill, { 'stroke-width': 1, stroke: self.backgroundColor || 'white' });
}
}
// Invoke user-defined drawing
if ($.isFunction(self.drawBefore)) {
self.drawBefore(renderer, rect);
}
var paddedRect = { x: padding.left, y: padding.top, width: rect.width - padding.left - padding.right, height: rect.height - padding.top - padding.bottom };
self._paddedRect = paddedRect;
var titlePadding = self.titlePadding || { left: 2, top: 2, right: 2, bottom: 2 };
var sz;
if (self.title && self.title.length > 0) {
var cssTitle = self.toThemeProperty('jqx-chart-title-text', null);
sz = renderer.measureText(self.title, 0, { 'class': cssTitle });
renderer.text(self.title, paddedRect.x + titlePadding.left, paddedRect.y + titlePadding.top, paddedRect.width - (titlePadding.left + titlePadding.right), sz.height, 0, { 'class': cssTitle }, true, 'center', 'center');
paddedRect.y += sz.height;
paddedRect.height -= sz.height;
}
if (self.description && self.description.length > 0) {
var cssDesc = self.toThemeProperty('jqx-chart-title-description', null);
sz = renderer.measureText(self.description, 0, { 'class': cssDesc });
renderer.text(self.description, paddedRect.x + titlePadding.left, paddedRect.y + titlePadding.top, paddedRect.width - (titlePadding.left + titlePadding.right), sz.height, 0, { 'class': cssDesc }, true, 'center', 'center');
paddedRect.y += sz.height;
paddedRect.height -= sz.height;
}
if (self.title || self.description) {
paddedRect.y += (titlePadding.bottom + titlePadding.top);
paddedRect.height -= (titlePadding.bottom + titlePadding.top);
}
var plotRect = { x: paddedRect.x, y: paddedRect.y, width: paddedRect.width, height: paddedRect.height };
self._plotRect = plotRect;
// build stats
self._buildStats(plotRect);
var isPieOnly = self._isPieOnlySeries();
var seriesGroups = self.seriesGroups;
// axis validation
var swap;
var hashAxis = { xAxis: {}, valueAxis: {} };
for (var i = 0; i < seriesGroups.length && !isPieOnly; i++) {
if (seriesGroups[i].type == 'pie' || seriesGroups[i].type == 'donut')
continue;
var xAxis = self._getXAxis(i);
if (!xAxis)
throw 'seriesGroup[' + i + '] is missing xAxis definition';
var xAxisId = xAxis == self._getXAxis() ? -1 : i;
hashAxis.xAxis[xAxisId] = 0x00;
}
var axisPadding = self.axisPadding;
if (isNaN(axisPadding))
axisPadding = 5;
// get vertical axis width
var wYAxis = { left: 0, right: 0, leftCount: 0, rightCount: 0 };
var wYAxisArr = [];
for (i = 0; i < seriesGroups.length; i++) {
var g = seriesGroups[i];
if (g.type == 'pie' || g.type == 'donut' || g.spider == true || g.polar == true) {
wYAxisArr.push({ width: 0, position: 0, xRel: 0 });
continue;
}
swap = g.orientation == 'horizontal';
var xAxis = self._getXAxis(i);
var xAxisId = xAxis == self._getXAxis() ? -1 : i;
var valueAxis = self._getValueAxis(i);
var valueAxisId = valueAxis == self._getValueAxis() ? -1 : i;
var w = !swap ? valueAxis.axisSize : xAxis.axisSize;
var axisR = { x: 0, y: plotRect.y, width: plotRect.width, height: plotRect.height };
var position = swap ? self._getXAxis(i).position : valueAxis.position;
if (!w || w == 'auto') {
if (swap) {
w = this._renderXAxis(i, axisR, true, plotRect).width;
if ((hashAxis.xAxis[xAxisId] & 0x01) == 0x01)
w = 0;
else if (w > 0)
hashAxis.xAxis[xAxisId] |= 0x01;
}
else {
w = self._renderValueAxis(i, axisR, true, plotRect).width;
if ((hashAxis.valueAxis[valueAxisId] & 0x01) == 0x01)
w = 0;
else if (w > 0)
hashAxis.valueAxis[valueAxisId] |= 0x01;
}
}
if (position != 'left' && self.rtl == true)
position = 'right';
if (position != 'right')
position = 'left';
if (wYAxis[position + 'Count'] > 0 && wYAxis[position] > 0 && w > 0)
wYAxis[position] += axisPadding;
wYAxisArr.push({ width: w, position: position, xRel: wYAxis[position] });
wYAxis[position] += w;
wYAxis[position + 'Count']++;
}
var measureSize = Math.max(1, Math.max(rect.width, rect.height));
// get horizontal axis height
var hXAxis = { top: 0, bottom: 0, topCount: 0, bottomCount: 0 };
var hXAxisArr = [];
for (i = 0; i < seriesGroups.length; i++) {
var g = seriesGroups[i];
if (g.type == 'pie' || g.type == 'donut' || g.spider == true || g.polar == true) {
hXAxisArr.push({ height: 0, position: 0, yRel: 0 });
continue;
}
swap = g.orientation == 'horizontal';
var valueAxis = this._getValueAxis(i);
var valueAxisId = valueAxis == self._getValueAxis() ? -1 : i;
var xAxis = self._getXAxis(i);
var xAxisId = xAxis == self._getXAxis() ? -1 : i;
var h = !swap ? xAxis.axisSize : valueAxis.axisSize;
var position = swap ? valueAxis.position : xAxis.position;
if (!h || h == 'auto') {
if (swap) {
h = self._renderValueAxis(i, { x: 0, y: 0, width: measureSize, height: 0 }, true, plotRect).height;
if ((hashAxis.valueAxis[valueAxisId] & 0x02) == 0x02)
h = 0;
else if (h > 0)
hashAxis.valueAxis[valueAxisId] |= 0x02;
}
else {
h = self._renderXAxis(i, { x: 0, y: 0, width: measureSize, height: 0 }, true).height;
if ((hashAxis.xAxis[xAxisId] & 0x02) == 0x02)
h = 0;
else if (h > 0)
hashAxis.xAxis[xAxisId] |= 0x02;
}
}
if (position != 'top')
position = 'bottom';
if (hXAxis[position + 'Count'] > 0 && hXAxis[position] > 0 && h > 0)
hXAxis[position] += axisPadding;
hXAxisArr.push({ height: h, position: position, yRel: hXAxis[position] });
hXAxis[position] += h;
hXAxis[position + 'Count']++;
}
self._createAnimationGroup("series");
var showLegend = (self.showLegend != false);
var szLegend = !showLegend ? { width: 0, height: 0 } : self._renderLegend(self.legendLayout ? self._rect : paddedRect, true);
if (this.legendLayout && (!isNaN(this.legendLayout.left) || !isNaN(this.legendLayout.top)))
szLegend = { width: 0, height: 0 };
if (paddedRect.height < hXAxis.top + hXAxis.bottom + szLegend.height || paddedRect.width < wYAxis.left + wYAxis.right) {
renderer.endGroup();
return;
}
plotRect.height -= hXAxis.top + hXAxis.bottom + szLegend.height;
plotRect.x += wYAxis.left;
plotRect.width -= wYAxis.left + wYAxis.right;
plotRect.y += hXAxis.top;
var xAxisRect = [];
if (!isPieOnly) {
var lineColor = self._getXAxis().tickMarksColor || self._defaultLineColor;
for (i = 0; i < seriesGroups.length; i++) {
var g = seriesGroups[i];
if (g.polar == true || g.spider == true || g.type == 'pie' || g.type == 'donut')
continue;
swap = g.orientation == 'horizontal';
var xAxisId = self._getXAxis(i) == self._getXAxis() ? -1 : i;
var valueAxisId = self._getValueAxis(i) == self._getValueAxis() ? -1 : i;
var axisR = { x: plotRect.x, y: 0, width: plotRect.width, height: hXAxisArr[i].height };
if (hXAxisArr[i].position != 'top')
axisR.y = plotRect.y + plotRect.height + hXAxisArr[i].yRel;
else
axisR.y = plotRect.y - hXAxisArr[i].yRel - hXAxisArr[i].height;
if (swap) {
if ((hashAxis.valueAxis[valueAxisId] & 0x04) == 0x04)
continue;
if (!self._isGroupVisible(i))
continue;
self._renderValueAxis(i, axisR, false, plotRect);
hashAxis.valueAxis[valueAxisId] |= 0x04;
}
else {
xAxisRect.push(axisR);
if ((hashAxis.xAxis[xAxisId] & 0x04) == 0x04)
continue;
if (!self._isGroupVisible(i))
continue;
self._renderXAxis(i, axisR, false, plotRect);
hashAxis.xAxis[xAxisId] |= 0x04;
}
}
}
if (showLegend) {
var containerRect = self.legendLayout ? self._rect : paddedRect;
var x = paddedRect.x + $.jqx._ptrnd((paddedRect.width - szLegend.width) / 2);
var y = plotRect.y + plotRect.height + hXAxis.bottom;
var w = paddedRect.width;
var h = szLegend.height;
if (self.legendLayout) {
if (!isNaN(self.legendLayout.left))
x = self.legendLayout.left;
if (!isNaN(self.legendLayout.top))
y = self.legendLayout.top;
if (!isNaN(self.legendLayout.width))
w = self.legendLayout.width;
if (!isNaN(self.legendLayout.height))
h = self.legendLayout.height;
}
if (x + w > containerRect.x + containerRect.width)
w = containerRect.x + containerRect.width - x;
if (y + h > containerRect.y + containerRect.height)
h = containerRect.y + containerRect.height - y;
self._renderLegend({ x: x, y: y, width: w, height: h });
}
self._hasHorizontalLines = false;
if (!isPieOnly) {
for (i = 0; i < seriesGroups.length; i++) {
var g = seriesGroups[i];
if (g.polar == true || g.spider == true || g.type == 'pie' || g.type == 'donut')
continue;
swap = seriesGroups[i].orientation == 'horizontal';
var axisR = { x: plotRect.x - wYAxisArr[i].xRel - wYAxisArr[i].width, y: plotRect.y, width: wYAxisArr[i].width, height: plotRect.height };
if (wYAxisArr[i].position != 'left')
axisR.x = plotRect.x + plotRect.width + wYAxisArr[i].xRel;
var xAxisId = self._getXAxis(i) == self._getXAxis() ? -1 : i;
var valueAxisId = self._getValueAxis(i) == self._getValueAxis() ? -1 : i;
if (swap) {
xAxisRect.push(axisR);
if ((hashAxis.xAxis[xAxisId] & 0x08) == 0x08)
continue;
if (!self._isGroupVisible(i))
continue;
self._renderXAxis(i, axisR, false, plotRect);
hashAxis.xAxis[xAxisId] |= 0x08;
}
else {
if ((hashAxis.valueAxis[valueAxisId] & 0x08) == 0x08)
continue;
if (!self._isGroupVisible(i))
continue;
self._renderValueAxis(i, axisR, false, plotRect);
hashAxis.valueAxis[valueAxisId] |= 0x08;
}
}
}
if (plotRect.width <= 0 || plotRect.height <= 0)
return;
self._plotRect = { x: plo