--- /dev/null
+# http://editorconfig.org
+root = true
+
+[*]
+indent_style = tab
+indent_size = 4
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = false
"use strict";
module.exports = function(Chart) {
-
- var helpers = Chart.helpers;
-
- var defaultConfig = {
- aspectRatio: 1
- };
-
+
Chart.Radar = function(context, config) {
- config.options = helpers.configMerge(defaultConfig, config.options);
+ config.options = Chart.helpers.configMerge({ aspectRatio: 1 }, config.options);
config.type = 'radar';
return new Chart(context, config);
yScalePoint = yScale.getPixelForValue(0);
}
+ var rectangleElementOptions = this.chart.options.elements.rectangle;
+ var custom = rectangle.custom;
+ var dataset = this.getDataset();
+
helpers.extend(rectangle, {
// Utility
_chart: this.chart.chart,
// Tooltip
label: this.chart.data.labels[index],
- datasetLabel: this.getDataset().label,
+ datasetLabel: dataset.label,
// Appearance
base: reset ? yScalePoint : this.calculateBarBase(this.index, index),
width: this.calculateBarWidth(numBars),
- backgroundColor: rectangle.custom && rectangle.custom.backgroundColor ? rectangle.custom.backgroundColor : helpers.getValueAtIndexOrDefault(this.getDataset().backgroundColor, index, this.chart.options.elements.rectangle.backgroundColor),
- borderSkipped: rectangle.custom && rectangle.custom.borderSkipped ? rectangle.custom.borderSkipped : this.chart.options.elements.rectangle.borderSkipped,
- borderColor: rectangle.custom && rectangle.custom.borderColor ? rectangle.custom.borderColor : helpers.getValueAtIndexOrDefault(this.getDataset().borderColor, index, this.chart.options.elements.rectangle.borderColor),
- borderWidth: rectangle.custom && rectangle.custom.borderWidth ? rectangle.custom.borderWidth : helpers.getValueAtIndexOrDefault(this.getDataset().borderWidth, index, this.chart.options.elements.rectangle.borderWidth)
+ backgroundColor: custom && custom.backgroundColor ? custom.backgroundColor : helpers.getValueAtIndexOrDefault(dataset.backgroundColor, index, rectangleElementOptions.backgroundColor),
+ borderSkipped: custom && custom.borderSkipped ? custom.borderSkipped : rectangleElementOptions.borderSkipped,
+ borderColor: custom && custom.borderColor ? custom.borderColor : helpers.getValueAtIndexOrDefault(dataset.borderColor, index, rectangleElementOptions.borderColor),
+ borderWidth: custom && custom.borderWidth ? custom.borderWidth : helpers.getValueAtIndexOrDefault(dataset.borderWidth, index, rectangleElementOptions.borderWidth)
}
});
rectangle.pivot();
var base = 0;
if (yScale.options.stacked) {
-
- var value = this.chart.data.datasets[datasetIndex].data[index];
+ var chart = this.chart;
+ var datasets = chart.data.datasets;
+ var value = datasets[datasetIndex].data[index];
if (value < 0) {
for (var i = 0; i < datasetIndex; i++) {
- var negDS = this.chart.data.datasets[i];
- var negDSMeta = this.chart.getDatasetMeta(i);
- if (negDSMeta.bar && negDSMeta.yAxisID === yScale.id && this.chart.isDatasetVisible(i)) {
+ var negDS = datasets[i];
+ var negDSMeta = chart.getDatasetMeta(i);
+ if (negDSMeta.bar && negDSMeta.yAxisID === yScale.id && chart.isDatasetVisible(i)) {
base += negDS.data[index] < 0 ? negDS.data[index] : 0;
}
}
} else {
for (var j = 0; j < datasetIndex; j++) {
- var posDS = this.chart.data.datasets[j];
- var posDSMeta = this.chart.getDatasetMeta(j);
- if (posDSMeta.bar && posDSMeta.yAxisID === yScale.id && this.chart.isDatasetVisible(j)) {
+ var posDS = datasets[j];
+ var posDSMeta = chart.getDatasetMeta(j);
+ if (posDSMeta.bar && posDSMeta.yAxisID === yScale.id && chart.isDatasetVisible(j)) {
base += posDS.data[index] > 0 ? posDS.data[index] : 0;
}
}
var dataset = this.chart.data.datasets[rectangle._datasetIndex];
var index = rectangle._index;
- rectangle._model.backgroundColor = rectangle.custom && rectangle.custom.hoverBackgroundColor ? rectangle.custom.hoverBackgroundColor : helpers.getValueAtIndexOrDefault(dataset.hoverBackgroundColor, index, helpers.getHoverColor(rectangle._model.backgroundColor));
- rectangle._model.borderColor = rectangle.custom && rectangle.custom.hoverBorderColor ? rectangle.custom.hoverBorderColor : helpers.getValueAtIndexOrDefault(dataset.hoverBorderColor, index, helpers.getHoverColor(rectangle._model.borderColor));
- rectangle._model.borderWidth = rectangle.custom && rectangle.custom.hoverBorderWidth ? rectangle.custom.hoverBorderWidth : helpers.getValueAtIndexOrDefault(dataset.hoverBorderWidth, index, rectangle._model.borderWidth);
+ rectangle._model.backgroundColor = customr && customr.hoverBackgroundColor ? customr.hoverBackgroundColor : helpers.getValueAtIndexOrDefault(dataset.hoverBackgroundColor, index, helpers.getHoverColor(rectangle._model.backgroundColor));
+ rectangle._model.borderColor = customr && customr.hoverBorderColor ? customr.hoverBorderColor : helpers.getValueAtIndexOrDefault(dataset.hoverBorderColor, index, helpers.getHoverColor(rectangle._model.borderColor));
+ rectangle._model.borderWidth = customr && customr.hoverBorderWidth ? customr.hoverBorderWidth : helpers.getValueAtIndexOrDefault(dataset.hoverBorderWidth, index, rectangle._model.borderWidth);
},
removeHoverStyle: function(rectangle) {
var dataset = this.chart.data.datasets[rectangle._datasetIndex];
var index = rectangle._index;
- rectangle._model.backgroundColor = rectangle.custom && rectangle.custom.backgroundColor ? rectangle.custom.backgroundColor : helpers.getValueAtIndexOrDefault(this.getDataset().backgroundColor, index, this.chart.options.elements.rectangle.backgroundColor);
- rectangle._model.borderColor = rectangle.custom && rectangle.custom.borderColor ? rectangle.custom.borderColor : helpers.getValueAtIndexOrDefault(this.getDataset().borderColor, index, this.chart.options.elements.rectangle.borderColor);
- rectangle._model.borderWidth = rectangle.custom && rectangle.custom.borderWidth ? rectangle.custom.borderWidth : helpers.getValueAtIndexOrDefault(this.getDataset().borderWidth, index, this.chart.options.elements.rectangle.borderWidth);
+ rectangle._model.backgroundColor = customr && customr.backgroundColor ? customr.backgroundColor : helpers.getValueAtIndexOrDefault(this.getDataset().backgroundColor, index, this.chart.options.elements.rectangle.backgroundColor);
+ rectangle._model.borderColor = customr && customr.borderColor ? customr.borderColor : helpers.getValueAtIndexOrDefault(this.getDataset().borderColor, index, this.chart.options.elements.rectangle.borderColor);
+ rectangle._model.borderWidth = customr && customr.borderWidth ? customr.borderWidth : helpers.getValueAtIndexOrDefault(this.getDataset().borderWidth, index, this.chart.options.elements.rectangle.borderWidth);
}
});
// Appearance
base: reset ? xScalePoint : this.calculateBarBase(this.index, index),
height: this.calculateBarHeight(numBars),
- backgroundColor: rectangle.custom && rectangle.custom.backgroundColor ? rectangle.custom.backgroundColor : helpers.getValueAtIndexOrDefault(this.getDataset().backgroundColor, index, this.chart.options.elements.rectangle.backgroundColor),
- borderSkipped: rectangle.custom && rectangle.custom.borderSkipped ? rectangle.custom.borderSkipped : this.chart.options.elements.rectangle.borderSkipped,
- borderColor: rectangle.custom && rectangle.custom.borderColor ? rectangle.custom.borderColor : helpers.getValueAtIndexOrDefault(this.getDataset().borderColor, index, this.chart.options.elements.rectangle.borderColor),
- borderWidth: rectangle.custom && rectangle.custom.borderWidth ? rectangle.custom.borderWidth : helpers.getValueAtIndexOrDefault(this.getDataset().borderWidth, index, this.chart.options.elements.rectangle.borderWidth)
+ backgroundColor: customr && customr.backgroundColor ? customr.backgroundColor : helpers.getValueAtIndexOrDefault(this.getDataset().backgroundColor, index, this.chart.options.elements.rectangle.backgroundColor),
+ borderSkipped: customr && customr.borderSkipped ? customr.borderSkipped : this.chart.options.elements.rectangle.borderSkipped,
+ borderColor: customr && customr.borderColor ? customr.borderColor : helpers.getValueAtIndexOrDefault(this.getDataset().borderColor, index, this.chart.options.elements.rectangle.borderColor),
+ borderWidth: customr && customr.borderWidth ? customr.borderWidth : helpers.getValueAtIndexOrDefault(this.getDataset().borderWidth, index, this.chart.options.elements.rectangle.borderWidth)
},
draw: function () {
render: function render(duration, lazy) {
Chart.pluginService.notifyPlugins('beforeRender', [this]);
- if (this.options.animation && ((typeof duration !== 'undefined' && duration !== 0) || (typeof duration === 'undefined' && this.options.animation.duration !== 0))) {
+ var animationOptions = this.options.animation;
+ if (animationOptions && ((typeof duration !== 'undefined' && duration !== 0) || (typeof duration === 'undefined' && animationOptions.duration !== 0))) {
var animation = new Chart.Animation();
- animation.numSteps = (duration || this.options.animation.duration) / 16.66; //60 fps
- animation.easing = this.options.animation.easing;
+ animation.numSteps = (duration || animationOptions.duration) / 16.66; //60 fps
+ animation.easing = animationOptions.easing;
// render function
animation.render = function(chartInstance, animationObject) {
};
// user events
- animation.onAnimationProgress = this.options.animation.onProgress;
- animation.onAnimationComplete = this.options.animation.onComplete;
+ animation.onAnimationProgress = animationOptions.onProgress;
+ animation.onAnimationComplete = animationOptions.onComplete;
Chart.animationService.addAnimation(this, animation, duration, lazy);
} else {
this.draw();
- if (this.options.animation && this.options.animation.onComplete && this.options.animation.onComplete.call) {
- this.options.animation.onComplete.call(this);
+ if (animationOptions && animationOptions.onComplete && animationOptions.onComplete.call) {
+ animationOptions.onComplete.call(this);
}
}
return this;
}
// Clip out the chart area so that anything outside does not draw. This is necessary for zoom and pan to function
- this.chart.ctx.save();
- this.chart.ctx.beginPath();
- this.chart.ctx.rect(this.chartArea.left, this.chartArea.top, this.chartArea.right - this.chartArea.left, this.chartArea.bottom - this.chartArea.top);
- this.chart.ctx.clip();
+ var context = this.chart.ctx;
+ context.save();
+ context.beginPath();
+ context.rect(this.chartArea.left, this.chartArea.top, this.chartArea.right - this.chartArea.left, this.chartArea.bottom - this.chartArea.top);
+ context.clip();
// Draw each dataset via its respective controller (reversed to support proper line stacking)
helpers.each(this.data.datasets, function(dataset, datasetIndex) {
}, this, true);
// Restore from the clipping operation
- this.chart.ctx.restore();
+ context.restore();
// Finally draw the tooltip
this.tooltip.transition(easingDecimal).draw();
if (this.lastActive.length) {
switch (this.options.hover.mode) {
case 'single':
- this.getDatasetMeta(this.lastActive[0]._datasetIndex).controller.removeHoverStyle(this.lastActive[0], this.lastActive[0]._datasetIndex, this.lastActive[0]._index);
+ var lastActive = this.lastActive[0];
+ this.getDatasetMeta(lastActive._datasetIndex).controller.removeHoverStyle(lastActive, lastActive._datasetIndex, lastActive._index);
break;
case 'label':
case 'dataset':
for (var i = 0; i < this.lastActive.length; i++) {
- if (this.lastActive[i])
- this.getDatasetMeta(this.lastActive[i]._datasetIndex).controller.removeHoverStyle(this.lastActive[i], this.lastActive[i]._datasetIndex, this.lastActive[i]._index);
+ var lastActive = this.lastActive[i];
+ if (lastActive)
+ this.getDatasetMeta(lastActive._datasetIndex).controller.removeHoverStyle(lastActive, lastActive._datasetIndex, lastActive._index);
}
break;
default:
if (this.active.length && this.options.hover.mode) {
switch (this.options.hover.mode) {
case 'single':
- this.getDatasetMeta(this.active[0]._datasetIndex).controller.setHoverStyle(this.active[0]);
+ var active = this.active[0];
+ this.getDatasetMeta(active._datasetIndex).controller.setHoverStyle(active);
break;
case 'label':
case 'dataset':
for (var j = 0; j < this.active.length; j++) {
- if (this.active[j])
- this.getDatasetMeta(this.active[j]._datasetIndex).controller.setHoverStyle(this.active[j]);
+ var active = this.active[j];
+ if (active)
+ this.getDatasetMeta(active._datasetIndex).controller.setHoverStyle(active);
}
break;
default:
}
}
-
+ var tooltip = this.tooltip;
// Built in Tooltips
if (this.options.tooltips.enabled || this.options.tooltips.custom) {
// The usual updates
- this.tooltip.initialize();
- this.tooltip._active = this.tooltipActive;
- this.tooltip.update(true);
+ tooltip.initialize();
+ tooltip._active = this.tooltipActive;
+ tooltip.update(true);
}
// Hover animations
- this.tooltip.pivot();
+ tooltip.pivot();
if (!this.animating) {
var changed;
this.stop();
if (this.options.tooltips.enabled || this.options.tooltips.custom) {
- this.tooltip.update(true);
+ tooltip.update(true);
}
// We only need to render at this point. Updating will cause scales to be recomputed generating flicker & using more
afterDraw: noop,
// Called during destroy
- destroy: noop,
+ destroy: noop
});
};
module.exports = function(Chart) {
var helpers = Chart.helpers;
+ var globalDefaults = Chart.defaults.global;
Chart.defaults.scale = {
display: true,
helpers.callCallback(this.options.beforeCalculateTickRotation, [this]);
},
calculateTickRotation: function() {
+ var context = this.ctx;
+ var optionTicks = this.options.ticks;
+
//Get the width of each grid by calculating the difference
//between x offsets between 0 and 1.
- var tickFontSize = helpers.getValueOrDefault(this.options.ticks.fontSize, Chart.defaults.global.defaultFontSize);
- var tickFontStyle = helpers.getValueOrDefault(this.options.ticks.fontStyle, Chart.defaults.global.defaultFontStyle);
- var tickFontFamily = helpers.getValueOrDefault(this.options.ticks.fontFamily, Chart.defaults.global.defaultFontFamily);
+ var tickFontSize = helpers.getValueOrDefault(optionTicks.fontSize, globalDefaults.defaultFontSize);
+ var tickFontStyle = helpers.getValueOrDefault(optionTicks.fontStyle, globalDefaults.defaultFontStyle);
+ var tickFontFamily = helpers.getValueOrDefault(optionTicks.fontFamily, globalDefaults.defaultFontFamily);
var tickLabelFont = helpers.fontString(tickFontSize, tickFontStyle, tickFontFamily);
- this.ctx.font = tickLabelFont;
+ context.font = tickLabelFont;
- var firstWidth = this.ctx.measureText(this.ticks[0]).width;
- var lastWidth = this.ctx.measureText(this.ticks[this.ticks.length - 1]).width;
+ var firstWidth = context.measureText(this.ticks[0]).width;
+ var lastWidth = context.measureText(this.ticks[this.ticks.length - 1]).width;
var firstRotated;
- this.labelRotation = this.options.ticks.minRotation || 0;
+ this.labelRotation = optionTicks.minRotation || 0;
this.paddingRight = 0;
this.paddingLeft = 0;
if (!this.longestTextCache) {
this.longestTextCache = {};
}
- var originalLabelWidth = helpers.longestText(this.ctx, tickLabelFont, this.ticks, this.longestTextCache);
+ var originalLabelWidth = helpers.longestText(context, tickLabelFont, this.ticks, this.longestTextCache);
var labelWidth = originalLabelWidth;
var cosRotation;
var sinRotation;
var tickWidth = this.getPixelForTick(1) - this.getPixelForTick(0) - 6;
//Max label rotation can be set or default to 90 - also act as a loop counter
- while (labelWidth > tickWidth && this.labelRotation < this.options.ticks.maxRotation) {
+ while (labelWidth > tickWidth && this.labelRotation < optionTicks.maxRotation) {
cosRotation = Math.cos(helpers.toRadians(this.labelRotation));
sinRotation = Math.sin(helpers.toRadians(this.labelRotation));
var opts = this.options;
var tickOpts = opts.ticks;
var scaleLabelOpts = opts.scaleLabel;
- var globalOpts = Chart.defaults.global;
var display = opts.display;
var isHorizontal = this.isHorizontal();
- var tickFontSize = helpers.getValueOrDefault(tickOpts.fontSize, globalOpts.defaultFontSize);
- var tickFontStyle = helpers.getValueOrDefault(tickOpts.fontStyle, globalOpts.defaultFontStyle);
- var tickFontFamily = helpers.getValueOrDefault(tickOpts.fontFamily, globalOpts.defaultFontFamily);
+ var tickFontSize = helpers.getValueOrDefault(tickOpts.fontSize, globalDefaults.defaultFontSize);
+ var tickFontStyle = helpers.getValueOrDefault(tickOpts.fontStyle, globalDefaults.defaultFontStyle);
+ var tickFontFamily = helpers.getValueOrDefault(tickOpts.fontFamily, globalDefaults.defaultFontFamily);
var tickLabelFont = helpers.fontString(tickFontSize, tickFontStyle, tickFontFamily);
- var scaleLabelFontSize = helpers.getValueOrDefault(scaleLabelOpts.fontSize, globalOpts.defaultFontSize);
- var scaleLabelFontStyle = helpers.getValueOrDefault(scaleLabelOpts.fontStyle, globalOpts.defaultFontStyle);
- var scaleLabelFontFamily = helpers.getValueOrDefault(scaleLabelOpts.fontFamily, globalOpts.defaultFontFamily);
+ var scaleLabelFontSize = helpers.getValueOrDefault(scaleLabelOpts.fontSize, globalDefaults.defaultFontSize);
+ var scaleLabelFontStyle = helpers.getValueOrDefault(scaleLabelOpts.fontStyle, globalDefaults.defaultFontStyle);
+ var scaleLabelFontFamily = helpers.getValueOrDefault(scaleLabelOpts.fontFamily, globalDefaults.defaultFontFamily);
var scaleLabelFont = helpers.fontString(scaleLabelFontSize, scaleLabelFontStyle, scaleLabelFontFamily);
var tickMarkLength = opts.gridLines.tickMarkLength;
// @param {rectangle} chartArea : the area of the chart to draw full grid lines on
draw: function(chartArea) {
if (this.options.display) {
+ var context = this.ctx;
+ var ticks = this.options.ticks;
+ var gridLines = this.options.gridLines;
+ var scaleLabel = this.options.scaleLabel;
var setContextLineSettings;
var isRotated = this.labelRotation !== 0;
var skipRatio;
var scaleLabelX;
var scaleLabelY;
- var useAutoskipper = this.options.ticks.autoSkip;
+] var useAutoskipper = ticks.autoSkip;
// figure out the maximum number of gridlines to show
var maxTicks;
-
- if (this.options.ticks.maxTicksLimit) {
- maxTicks = this.options.ticks.maxTicksLimit;
+ if (ticks.maxTicksLimit) {
+ maxTicks = ticks.maxTicksLimit;
}
- var tickFontColor = helpers.getValueOrDefault(this.options.ticks.fontColor, Chart.defaults.global.defaultFontColor);
- var tickFontSize = helpers.getValueOrDefault(this.options.ticks.fontSize, Chart.defaults.global.defaultFontSize);
- var tickFontStyle = helpers.getValueOrDefault(this.options.ticks.fontStyle, Chart.defaults.global.defaultFontStyle);
- var tickFontFamily = helpers.getValueOrDefault(this.options.ticks.fontFamily, Chart.defaults.global.defaultFontFamily);
+ var tickFontColor = helpers.getValueOrDefault(ticks.fontColor, globalDefaults.defaultFontColor);
+ var tickFontSize = helpers.getValueOrDefault(ticks.fontSize, globalDefaults.defaultFontSize);
+ var tickFontStyle = helpers.getValueOrDefault(ticks.fontStyle, globalDefaults.defaultFontStyle);
+ var tickFontFamily = helpers.getValueOrDefault(ticks.fontFamily, globalDefaults.defaultFontFamily);
var tickLabelFont = helpers.fontString(tickFontSize, tickFontStyle, tickFontFamily);
- var tl = this.options.gridLines.tickMarkLength;
+ var tl = gridLines.tickMarkLength;
- var scaleLabelFontColor = helpers.getValueOrDefault(this.options.scaleLabel.fontColor, Chart.defaults.global.defaultFontColor);
- var scaleLabelFontSize = helpers.getValueOrDefault(this.options.scaleLabel.fontSize, Chart.defaults.global.defaultFontSize);
- var scaleLabelFontStyle = helpers.getValueOrDefault(this.options.scaleLabel.fontStyle, Chart.defaults.global.defaultFontStyle);
- var scaleLabelFontFamily = helpers.getValueOrDefault(this.options.scaleLabel.fontFamily, Chart.defaults.global.defaultFontFamily);
+ var scaleLabelFontColor = helpers.getValueOrDefault(scaleLabel.fontColor, globalDefaults.defaultFontColor);
+ var scaleLabelFontSize = helpers.getValueOrDefault(scaleLabel.fontSize, globalDefaults.defaultFontSize);
+ var scaleLabelFontStyle = helpers.getValueOrDefault(scaleLabel.fontStyle, globalDefaults.defaultFontStyle);
+ var scaleLabelFontFamily = helpers.getValueOrDefault(scaleLabel.fontFamily, globalDefaults.defaultFontFamily);
var scaleLabelFont = helpers.fontString(scaleLabelFontSize, scaleLabelFontStyle, scaleLabelFontFamily);
- var cosRotation = Math.cos(helpers.toRadians(this.labelRotation));
- var sinRotation = Math.sin(helpers.toRadians(this.labelRotation));
+ var labelRotationRadians = helpers.toRadians(this.labelRotation);
+ var cosRotation = Math.cos(labelRotationRadians);
+ var sinRotation = Math.sin(labelRotationRadians);
var longestRotatedLabel = this.longestLabelWidth * cosRotation;
var rotatedLabelHeight = tickFontSize * sinRotation;
// Make sure we draw text in the correct color and font
- this.ctx.fillStyle = tickFontColor;
+ context.fillStyle = tickFontColor;
if (this.isHorizontal()) {
setContextLineSettings = true;
var yTickEnd = this.options.position === "bottom" ? this.top + tl : this.bottom;
skipRatio = false;
- if (((longestRotatedLabel / 2) + this.options.ticks.autoSkipPadding) * this.ticks.length > (this.width - (this.paddingLeft + this.paddingRight))) {
- skipRatio = 1 + Math.floor((((longestRotatedLabel / 2) + this.options.ticks.autoSkipPadding) * this.ticks.length) / (this.width - (this.paddingLeft + this.paddingRight)));
+ if (((longestRotatedLabel / 2) + ticks.autoSkipPadding) * this.ticks.length > (this.width - (this.paddingLeft + this.paddingRight))) {
+ skipRatio = 1 + Math.floor((((longestRotatedLabel / 2) + ticks.autoSkipPadding) * this.ticks.length) / (this.width - (this.paddingLeft + this.paddingRight)));
}
// if they defined a max number of ticks,
return;
}
var xLineValue = this.getPixelForTick(index); // xvalues for grid lines
- var xLabelValue = this.getPixelForTick(index, this.options.gridLines.offsetGridLines); // x values for ticks (need to consider offsetLabel option)
+ var xLabelValue = this.getPixelForTick(index, gridLines.offsetGridLines); // x values for ticks (need to consider offsetLabel option)
- if (this.options.gridLines.display) {
+ if (gridLines.display) {
if (index === (typeof this.zeroLineIndex !== 'undefined' ? this.zeroLineIndex : 0)) {
// Draw the first index specially
- this.ctx.lineWidth = this.options.gridLines.zeroLineWidth;
- this.ctx.strokeStyle = this.options.gridLines.zeroLineColor;
+ context.lineWidth = gridLines.zeroLineWidth;
+ context.strokeStyle = gridLines.zeroLineColor;
setContextLineSettings = true; // reset next time
} else if (setContextLineSettings) {
- this.ctx.lineWidth = this.options.gridLines.lineWidth;
- this.ctx.strokeStyle = this.options.gridLines.color;
+ context.lineWidth = gridLines.lineWidth;
+ context.strokeStyle = gridLines.color;
setContextLineSettings = false;
}
- xLineValue += helpers.aliasPixel(this.ctx.lineWidth);
+ xLineValue += helpers.aliasPixel(context.lineWidth);
// Draw the label area
- this.ctx.beginPath();
+ context.beginPath();
- if (this.options.gridLines.drawTicks) {
- this.ctx.moveTo(xLineValue, yTickStart);
- this.ctx.lineTo(xLineValue, yTickEnd);
+ if (gridLines.drawTicks) {
+ context.moveTo(xLineValue, yTickStart);
+ context.lineTo(xLineValue, yTickEnd);
}
// Draw the chart area
- if (this.options.gridLines.drawOnChartArea) {
- this.ctx.moveTo(xLineValue, chartArea.top);
- this.ctx.lineTo(xLineValue, chartArea.bottom);
+ if (gridLines.drawOnChartArea) {
+ context.moveTo(xLineValue, chartArea.top);
+ context.lineTo(xLineValue, chartArea.bottom);
}
// Need to stroke in the loop because we are potentially changing line widths & colours
- this.ctx.stroke();
+ context.stroke();
}
- if (this.options.ticks.display) {
- this.ctx.save();
- this.ctx.translate(xLabelValue + this.options.ticks.labelOffset, (isRotated) ? this.top + 12 : this.options.position === "top" ? this.bottom - tl : this.top + tl);
- this.ctx.rotate(helpers.toRadians(this.labelRotation) * -1);
- this.ctx.font = tickLabelFont;
- this.ctx.textAlign = (isRotated) ? "right" : "center";
- this.ctx.textBaseline = (isRotated) ? "middle" : this.options.position === "top" ? "bottom" : "top";
- this.ctx.fillText(label, 0, 0);
- this.ctx.restore();
+ if (ticks.display) {
+ context.save();
+ context.translate(xLabelValue + ticks.labelOffset, (isRotated) ? this.top + 12 : this.options.position === "top" ? this.bottom - tl : this.top + tl);
+ context.rotate(labelRotationRadians * -1);
+ context.font = tickLabelFont;
+ context.textAlign = (isRotated) ? "right" : "center";
+ context.textBaseline = (isRotated) ? "middle" : this.options.position === "top" ? "bottom" : "top";
+ context.fillText(label, 0, 0);
+ context.restore();
}
}, this);
- if (this.options.scaleLabel.display) {
+ if (scaleLabel.display) {
// Draw the scale label
- this.ctx.textAlign = "center";
- this.ctx.textBaseline = 'middle';
- this.ctx.fillStyle = scaleLabelFontColor; // render in correct colour
- this.ctx.font = scaleLabelFont;
+ context.textAlign = "center";
+ context.textBaseline = 'middle';
+ context.fillStyle = scaleLabelFontColor; // render in correct colour
+ context.font = scaleLabelFont;
scaleLabelX = this.left + ((this.right - this.left) / 2); // midpoint of the width
scaleLabelY = this.options.position === 'bottom' ? this.bottom - (scaleLabelFontSize / 2) : this.top + (scaleLabelFontSize / 2);
- this.ctx.fillText(this.options.scaleLabel.labelString, scaleLabelX, scaleLabelY);
+ context.fillText(scaleLabel.labelString, scaleLabelX, scaleLabelY);
}
} else {
var yLineValue = this.getPixelForTick(index); // xvalues for grid lines
- if (this.options.gridLines.display) {
+ if (gridLines.display) {
if (index === (typeof this.zeroLineIndex !== 'undefined' ? this.zeroLineIndex : 0)) {
// Draw the first index specially
- this.ctx.lineWidth = this.options.gridLines.zeroLineWidth;
- this.ctx.strokeStyle = this.options.gridLines.zeroLineColor;
+ context.lineWidth = gridLines.zeroLineWidth;
+ context.strokeStyle = gridLines.zeroLineColor;
setContextLineSettings = true; // reset next time
} else if (setContextLineSettings) {
- this.ctx.lineWidth = this.options.gridLines.lineWidth;
- this.ctx.strokeStyle = this.options.gridLines.color;
+ context.lineWidth = gridLines.lineWidth;
+ context.strokeStyle = gridLines.color;
setContextLineSettings = false;
}
- yLineValue += helpers.aliasPixel(this.ctx.lineWidth);
+ yLineValue += helpers.aliasPixel(context.lineWidth);
// Draw the label area
- this.ctx.beginPath();
+ context.beginPath();
- if (this.options.gridLines.drawTicks) {
- this.ctx.moveTo(xTickStart, yLineValue);
- this.ctx.lineTo(xTickEnd, yLineValue);
+ if (gridLines.drawTicks) {
+ context.moveTo(xTickStart, yLineValue);
+ context.lineTo(xTickEnd, yLineValue);
}
// Draw the chart area
- if (this.options.gridLines.drawOnChartArea) {
- this.ctx.moveTo(chartArea.left, yLineValue);
- this.ctx.lineTo(chartArea.right, yLineValue);
+ if (gridLines.drawOnChartArea) {
+ context.moveTo(chartArea.left, yLineValue);
+ context.lineTo(chartArea.right, yLineValue);
}
// Need to stroke in the loop because we are potentially changing line widths & colours
- this.ctx.stroke();
+ context.stroke();
}
- if (this.options.ticks.display) {
+ if (ticks.display) {
var xLabelValue;
- var yLabelValue = this.getPixelForTick(index, this.options.gridLines.offsetGridLines); // x values for ticks (need to consider offsetLabel option)
+ var yLabelValue = this.getPixelForTick(index, gridLines.offsetGridLines); // x values for ticks (need to consider offsetLabel option)
- this.ctx.save();
+ context.save();
if (this.options.position === "left") {
- if (this.options.ticks.mirror) {
- xLabelValue = this.right + this.options.ticks.padding;
- this.ctx.textAlign = "left";
+ if (ticks.mirror) {
+ xLabelValue = this.right + ticks.padding;
+ context.textAlign = "left";
} else {
- xLabelValue = this.right - this.options.ticks.padding;
- this.ctx.textAlign = "right";
+ xLabelValue = this.right - ticks.padding;
+ context.textAlign = "right";
}
} else {
// right side
- if (this.options.ticks.mirror) {
- xLabelValue = this.left - this.options.ticks.padding;
- this.ctx.textAlign = "right";
+ if (ticks.mirror) {
+ xLabelValue = this.left - ticks.padding;
+ context.textAlign = "right";
} else {
- xLabelValue = this.left + this.options.ticks.padding;
- this.ctx.textAlign = "left";
+ xLabelValue = this.left + ticks.padding;
+ context.textAlign = "left";
}
}
- this.ctx.translate(xLabelValue, yLabelValue + this.options.ticks.labelOffset);
- this.ctx.rotate(helpers.toRadians(this.labelRotation) * -1);
- this.ctx.font = tickLabelFont;
- this.ctx.textBaseline = "middle";
- this.ctx.fillText(label, 0, 0);
- this.ctx.restore();
+ context.translate(xLabelValue, yLabelValue + ticks.labelOffset);
+ context.rotate(labelRotationRadians * -1);
+ context.font = tickLabelFont;
+ context.textBaseline = "middle";
+ context.fillText(label, 0, 0);
+ context.restore();
}
}, this);
- if (this.options.scaleLabel.display) {
+ if (scaleLabel.display) {
// Draw the scale label
scaleLabelX = this.options.position === 'left' ? this.left + (scaleLabelFontSize / 2) : this.right - (scaleLabelFontSize / 2);
scaleLabelY = this.top + ((this.bottom - this.top) / 2);
var rotation = this.options.position === 'left' ? -0.5 * Math.PI : 0.5 * Math.PI;
- this.ctx.save();
- this.ctx.translate(scaleLabelX, scaleLabelY);
- this.ctx.rotate(rotation);
- this.ctx.textAlign = "center";
- this.ctx.fillStyle =scaleLabelFontColor; // render in correct colour
- this.ctx.font = scaleLabelFont;
- this.ctx.textBaseline = 'middle';
- this.ctx.fillText(this.options.scaleLabel.labelString, 0, 0);
- this.ctx.restore();
+ context.save();
+ context.translate(scaleLabelX, scaleLabelY);
+ context.rotate(rotation);
+ context.textAlign = "center";
+ context.fillStyle =scaleLabelFontColor; // render in correct colour
+ context.font = scaleLabelFont;
+ context.textBaseline = 'middle';
+ context.fillText(scaleLabel.labelString, 0, 0);
+ context.restore();
}
}
// Draw the line at the edge of the axis
- this.ctx.lineWidth = this.options.gridLines.lineWidth;
- this.ctx.strokeStyle = this.options.gridLines.color;
+ context.lineWidth = gridLines.lineWidth;
+ context.strokeStyle = gridLines.color;
var x1 = this.left,
x2 = this.right,
y1 = this.top,
y2 = this.bottom;
+ var aliasPixel = helpers.aliasPixel(context.lineWidth);
if (this.isHorizontal()) {
y1 = y2 = this.options.position === 'top' ? this.bottom : this.top;
- y1 += helpers.aliasPixel(this.ctx.lineWidth);
- y2 += helpers.aliasPixel(this.ctx.lineWidth);
+ y1 += aliasPixel;
+ y2 += aliasPixel;
} else {
x1 = x2 = this.options.position === 'left' ? this.right : this.left;
- x1 += helpers.aliasPixel(this.ctx.lineWidth);
- x2 += helpers.aliasPixel(this.ctx.lineWidth);
+ x1 += aliasPixel;
+ x2 += aliasPixel;
}
- this.ctx.beginPath();
- this.ctx.moveTo(x1, y1);
- this.ctx.lineTo(x2, y2);
- this.ctx.stroke();
+ context.beginPath();
+ context.moveTo(x1, y1);
+ context.lineTo(x2, y2);
+ context.stroke();
}
}
});
Chart.Tooltip = Chart.Element.extend({
initialize: function() {
+ var globalDefaults = Chart.defaults.global;
var options = this._options;
+ var tooltips = options.tooltips;
+
helpers.extend(this, {
_model: {
// Positioning
- xPadding: options.tooltips.xPadding,
- yPadding: options.tooltips.yPadding,
- xAlign : options.tooltips.yAlign,
- yAlign : options.tooltips.xAlign,
+ xPadding: tooltips.xPadding,
+ yPadding: tooltips.yPadding,
+ xAlign : tooltips.yAlign,
+ yAlign : tooltips.xAlign,
// Body
- bodyColor: options.tooltips.bodyColor,
- _bodyFontFamily: helpers.getValueOrDefault(options.tooltips.bodyFontFamily, Chart.defaults.global.defaultFontFamily),
- _bodyFontStyle: helpers.getValueOrDefault(options.tooltips.bodyFontStyle, Chart.defaults.global.defaultFontStyle),
- _bodyAlign: options.tooltips.bodyAlign,
- bodyFontSize: helpers.getValueOrDefault(options.tooltips.bodyFontSize, Chart.defaults.global.defaultFontSize),
- bodySpacing: options.tooltips.bodySpacing,
+ bodyColor: tooltips.bodyColor,
+ _bodyFontFamily: helpers.getValueOrDefault(tooltips.bodyFontFamily, globalDefaults.defaultFontFamily),
+ _bodyFontStyle: helpers.getValueOrDefault(tooltips.bodyFontStyle, globalDefaults.defaultFontStyle),
+ _bodyAlign: tooltips.bodyAlign,
+ bodyFontSize: helpers.getValueOrDefault(tooltips.bodyFontSize, globalDefaults.defaultFontSize),
+ bodySpacing: tooltips.bodySpacing,
// Title
- titleColor: options.tooltips.titleColor,
- _titleFontFamily: helpers.getValueOrDefault(options.tooltips.titleFontFamily, Chart.defaults.global.defaultFontFamily),
- _titleFontStyle: helpers.getValueOrDefault(options.tooltips.titleFontStyle, Chart.defaults.global.defaultFontStyle),
- titleFontSize: helpers.getValueOrDefault(options.tooltips.titleFontSize, Chart.defaults.global.defaultFontSize),
- _titleAlign: options.tooltips.titleAlign,
- titleSpacing: options.tooltips.titleSpacing,
- titleMarginBottom: options.tooltips.titleMarginBottom,
+ titleColor: tooltips.titleColor,
+ _titleFontFamily: helpers.getValueOrDefault(tooltips.titleFontFamily, globalDefaults.defaultFontFamily),
+ _titleFontStyle: helpers.getValueOrDefault(tooltips.titleFontStyle, globalDefaults.defaultFontStyle),
+ titleFontSize: helpers.getValueOrDefault(tooltips.titleFontSize, globalDefaults.defaultFontSize),
+ _titleAlign: tooltips.titleAlign,
+ titleSpacing: tooltips.titleSpacing,
+ titleMarginBottom: tooltips.titleMarginBottom,
// Footer
- footerColor: options.tooltips.footerColor,
- _footerFontFamily: helpers.getValueOrDefault(options.tooltips.footerFontFamily, Chart.defaults.global.defaultFontFamily),
- _footerFontStyle: helpers.getValueOrDefault(options.tooltips.footerFontStyle, Chart.defaults.global.defaultFontStyle),
- footerFontSize: helpers.getValueOrDefault(options.tooltips.footerFontSize, Chart.defaults.global.defaultFontSize),
- _footerAlign: options.tooltips.footerAlign,
- footerSpacing: options.tooltips.footerSpacing,
- footerMarginTop: options.tooltips.footerMarginTop,
+ footerColor: tooltips.footerColor,
+ _footerFontFamily: helpers.getValueOrDefault(tooltips.footerFontFamily, globalDefaults.defaultFontFamily),
+ _footerFontStyle: helpers.getValueOrDefault(tooltips.footerFontStyle, globalDefaults.defaultFontStyle),
+ footerFontSize: helpers.getValueOrDefault(tooltips.footerFontSize, globalDefaults.defaultFontSize),
+ _footerAlign: tooltips.footerAlign,
+ footerSpacing: tooltips.footerSpacing,
+ footerMarginTop: tooltips.footerMarginTop,
// Appearance
- caretSize: options.tooltips.caretSize,
- cornerRadius: options.tooltips.cornerRadius,
- backgroundColor: options.tooltips.backgroundColor,
+ caretSize: tooltips.caretSize,
+ cornerRadius: tooltips.cornerRadius,
+ backgroundColor: tooltips.backgroundColor,
opacity: 0,
- legendColorBackground: options.tooltips.multiKeyBackground
+ legendColorBackground: tooltips.multiKeyBackground
}
});
},
module.exports = function(Chart) {
var helpers = Chart.helpers;
+ var globalDefaults = Chart.defaults.global;
Chart.defaults.global.elements.line = {
tension: 0.4,
- backgroundColor: Chart.defaults.global.defaultColor,
+ backgroundColor: globalDefaults.defaultColor,
borderWidth: 3,
- borderColor: Chart.defaults.global.defaultColor,
+ borderColor: globalDefaults.defaultColor,
borderCapStyle: 'butt',
borderDash: [],
borderDashOffset: 0.0,
ctx.lineTo(this._children[0]._view.x, vm.scaleZero);
}
- ctx.fillStyle = vm.backgroundColor || Chart.defaults.global.defaultColor;
+ ctx.fillStyle = vm.backgroundColor || globalDefaults.defaultColor;
ctx.closePath();
ctx.fill();
}
+ var globalOptionLineElements = globalDefaults.elements.line;
// Now draw the line between all the points with any borders
- ctx.lineCap = vm.borderCapStyle || Chart.defaults.global.elements.line.borderCapStyle;
+ ctx.lineCap = vm.borderCapStyle || globalOptionLineElements.borderCapStyle;
// IE 9 and 10 do not support line dash
if (ctx.setLineDash) {
- ctx.setLineDash(vm.borderDash || Chart.defaults.global.elements.line.borderDash);
+ ctx.setLineDash(vm.borderDash || globalOptionLineElements.borderDash);
}
- ctx.lineDashOffset = vm.borderDashOffset || Chart.defaults.global.elements.line.borderDashOffset;
- ctx.lineJoin = vm.borderJoinStyle || Chart.defaults.global.elements.line.borderJoinStyle;
- ctx.lineWidth = vm.borderWidth || Chart.defaults.global.elements.line.borderWidth;
- ctx.strokeStyle = vm.borderColor || Chart.defaults.global.defaultColor;
+ ctx.lineDashOffset = vm.borderDashOffset || globalOptionLineElements.borderDashOffset;
+ ctx.lineJoin = vm.borderJoinStyle || globalOptionLineElements.borderJoinStyle;
+ ctx.lineWidth = vm.borderWidth || globalOptionLineElements.borderWidth;
+ ctx.strokeStyle = vm.borderColor || globalDefaults.defaultColor;
ctx.beginPath();
helpers.each(this._children, function(point, index) {
module.exports = function(Chart) {
var helpers = Chart.helpers;
+ var globalDefaults = globalDefaults;
var defaultConfig = {
display: true,
return this.chart.data.labels.length;
},
setDimensions: function() {
+ var options = this.options;
// Set the unconstrained dimension before label rotation
this.width = this.maxWidth;
this.height = this.maxHeight;
this.yCenter = Math.round(this.height / 2);
var minSize = helpers.min([this.height, this.width]);
- var tickFontSize = helpers.getValueOrDefault(this.options.ticks.fontSize, Chart.defaults.global.defaultFontSize);
- this.drawingArea = (this.options.display) ? (minSize / 2) - (tickFontSize / 2 + this.options.ticks.backdropPaddingY) : (minSize / 2);
+ var tickFontSize = helpers.getValueOrDefault(options.ticks.fontSize, globalDefaults.defaultFontSize);
+ this.drawingArea = (options.display) ? (minSize / 2) - (tickFontSize / 2 + options.ticks.backdropPaddingY) : (minSize / 2);
},
determineDataLimits: function() {
this.min = null;
// the axis area. For now, we say that the minimum tick spacing in pixels must be 50
// We also limit the maximum number of ticks to 11 which gives a nice 10 squares on
// the graph
- var tickFontSize = helpers.getValueOrDefault(this.options.ticks.fontSize, Chart.defaults.global.defaultFontSize);
+ var tickFontSize = helpers.getValueOrDefault(this.options.ticks.fontSize, globalDefaults.defaultFontSize);
var maxTicks = Math.min(this.options.ticks.maxTicksLimit ? this.options.ticks.maxTicksLimit : 11, Math.ceil(this.drawingArea / (1.5 * tickFontSize)));
maxTicks = Math.max(2, maxTicks); // Make sure we always have at least 2 ticks
* https://dl.dropboxusercontent.com/u/34601363/yeahscience.gif
*/
- var pointLabelFontSize = helpers.getValueOrDefault(this.options.pointLabels.fontSize, Chart.defaults.global.defaultFontSize);
- var pointLabeFontStyle = helpers.getValueOrDefault(this.options.pointLabels.fontStyle, Chart.defaults.global.defaultFontStyle);
- var pointLabeFontFamily = helpers.getValueOrDefault(this.options.pointLabels.fontFamily, Chart.defaults.global.defaultFontFamily);
+ var pointLabels = this.options.pointLabels;
+ var pointLabelFontSize = helpers.getValueOrDefault(pointLabels.fontSize, globalDefaults.defaultFontSize);
+ var pointLabeFontStyle = helpers.getValueOrDefault(pointLabels.fontStyle, globalDefaults.defaultFontStyle);
+ var pointLabeFontFamily = helpers.getValueOrDefault(pointLabels.fontFamily, globalDefaults.defaultFontFamily);
var pointLabeFont = helpers.fontString(pointLabelFontSize, pointLabeFontStyle, pointLabeFontFamily);
// Get maximum radius of the polygon. Either half the height (minus the text width) or half the width.
}
if (this.options.ticks.display) {
- var tickFontColor = helpers.getValueOrDefault(this.options.ticks.fontColor, Chart.defaults.global.defaultFontColor);
- var tickFontSize = helpers.getValueOrDefault(this.options.ticks.fontSize, Chart.defaults.global.defaultFontSize);
- var tickFontStyle = helpers.getValueOrDefault(this.options.ticks.fontStyle, Chart.defaults.global.defaultFontStyle);
- var tickFontFamily = helpers.getValueOrDefault(this.options.ticks.fontFamily, Chart.defaults.global.defaultFontFamily);
+ var tickFontColor = helpers.getValueOrDefault(this.options.ticks.fontColor, globalDefaults.defaultFontColor);
+ var tickFontSize = helpers.getValueOrDefault(this.options.ticks.fontSize, globalDefaults.defaultFontSize);
+ var tickFontStyle = helpers.getValueOrDefault(this.options.ticks.fontStyle, globalDefaults.defaultFontStyle);
+ var tickFontFamily = helpers.getValueOrDefault(this.options.ticks.fontFamily, globalDefaults.defaultFontFamily);
var tickLabelFont = helpers.fontString(tickFontSize, tickFontStyle, tickFontFamily);
ctx.font = tickLabelFont;
// Extra 3px out for some label spacing
var pointLabelPosition = this.getPointPosition(i, this.getDistanceFromCenterForValue(this.options.reverse ? this.min : this.max) + 5);
- var pointLabelFontColor = helpers.getValueOrDefault(this.options.pointLabels.fontColor, Chart.defaults.global.defaultFontColor);
- var pointLabelFontSize = helpers.getValueOrDefault(this.options.pointLabels.fontSize, Chart.defaults.global.defaultFontSize);
- var pointLabeFontStyle = helpers.getValueOrDefault(this.options.pointLabels.fontStyle, Chart.defaults.global.defaultFontStyle);
- var pointLabeFontFamily = helpers.getValueOrDefault(this.options.pointLabels.fontFamily, Chart.defaults.global.defaultFontFamily);
+ var pointLabelFontColor = helpers.getValueOrDefault(this.options.pointLabels.fontColor, globalDefaults.defaultFontColor);
+ var pointLabelFontSize = helpers.getValueOrDefault(this.options.pointLabels.fontSize, globalDefaults.defaultFontSize);
+ var pointLabeFontStyle = helpers.getValueOrDefault(this.options.pointLabels.fontStyle, globalDefaults.defaultFontStyle);
+ var pointLabeFontFamily = helpers.getValueOrDefault(this.options.pointLabels.fontFamily, globalDefaults.defaultFontFamily);
var pointLabeFont = helpers.fontString(pointLabelFontSize, pointLabeFontStyle, pointLabeFontFamily);
ctx.font = pointLabeFont;
projects / thirdparty / Chart.js.git / commitdiff
