For consistency, enable ESLint `one-var` rule to require multiple variable declarations for initialized variables per scope. Uninitialized variables can still be declared together (preferred) or separately.
http://eslint.org/docs/rules/one-var
object-curly-spacing: [2, never]
object-property-newline: 0
one-var-declaration-per-line: 2
- one-var: 0
+ one-var: [2, {initialized: never}]
operator-assignment: 0
operator-linebreak: 0
padded-blocks: 0
update: function(reset) {
var me = this;
- var chart = me.chart,
- chartArea = chart.chartArea,
- opts = chart.options,
- arcOpts = opts.elements.arc,
- availableWidth = chartArea.right - chartArea.left - arcOpts.borderWidth,
- availableHeight = chartArea.bottom - chartArea.top - arcOpts.borderWidth,
- minSize = Math.min(availableWidth, availableHeight),
- offset = {
- x: 0,
- y: 0
- },
- meta = me.getMeta(),
- cutoutPercentage = opts.cutoutPercentage,
- circumference = opts.circumference;
+ var chart = me.chart;
+ var chartArea = chart.chartArea;
+ var opts = chart.options;
+ var arcOpts = opts.elements.arc;
+ var availableWidth = chartArea.right - chartArea.left - arcOpts.borderWidth;
+ var availableHeight = chartArea.bottom - chartArea.top - arcOpts.borderWidth;
+ var minSize = Math.min(availableWidth, availableHeight);
+ var offset = {x: 0, y: 0};
+ var meta = me.getMeta();
+ var cutoutPercentage = opts.cutoutPercentage;
+ var circumference = opts.circumference;
// If the chart's circumference isn't a full circle, calculate minSize as a ratio of the width/height of the arc
if (circumference < Math.PI * 2.0) {
updateElement: function(arc, index, reset) {
var me = this;
- var chart = me.chart,
- chartArea = chart.chartArea,
- opts = chart.options,
- animationOpts = opts.animation,
- centerX = (chartArea.left + chartArea.right) / 2,
- centerY = (chartArea.top + chartArea.bottom) / 2,
- startAngle = opts.rotation, // non reset case handled later
- endAngle = opts.rotation, // non reset case handled later
- dataset = me.getDataset(),
- circumference = reset && animationOpts.animateRotate ? 0 : arc.hidden ? 0 : me.calculateCircumference(dataset.data[index]) * (opts.circumference / (2.0 * Math.PI)),
- innerRadius = reset && animationOpts.animateScale ? 0 : me.innerRadius,
- outerRadius = reset && animationOpts.animateScale ? 0 : me.outerRadius,
- valueAtIndexOrDefault = helpers.valueAtIndexOrDefault;
+ var chart = me.chart;
+ var chartArea = chart.chartArea;
+ var opts = chart.options;
+ var animationOpts = opts.animation;
+ var centerX = (chartArea.left + chartArea.right) / 2;
+ var centerY = (chartArea.top + chartArea.bottom) / 2;
+ var startAngle = opts.rotation; // non reset case handled later
+ var endAngle = opts.rotation; // non reset case handled later
+ var dataset = me.getDataset();
+ var circumference = reset && animationOpts.animateRotate ? 0 : arc.hidden ? 0 : me.calculateCircumference(dataset.data[index]) * (opts.circumference / (2.0 * Math.PI));
+ var innerRadius = reset && animationOpts.animateScale ? 0 : me.innerRadius;
+ var outerRadius = reset && animationOpts.animateScale ? 0 : me.outerRadius;
+ var valueAtIndexOrDefault = helpers.valueAtIndexOrDefault;
helpers.extend(arc, {
// Utility
// gets the max border or hover width to properly scale pie charts
getMaxBorderWidth: function(arcs) {
- var max = 0,
- index = this.index,
- length = arcs.length,
- borderWidth,
- hoverWidth;
+ var max = 0;
+ var index = this.index;
+ var length = arcs.length;
+ var borderWidth;
+ var hoverWidth;
for (var i = 0; i < length; i++) {
borderWidth = arcs[i]._model ? arcs[i]._model.borderWidth : 0;
},
removeHoverStyle: function(element, elementOpts) {
- var dataset = this.chart.data.datasets[element._datasetIndex],
- index = element._index,
- custom = element.custom || {},
- valueOrDefault = helpers.valueAtIndexOrDefault,
- model = element._model;
+ var dataset = this.chart.data.datasets[element._datasetIndex];
+ var index = element._index;
+ var custom = element.custom || {};
+ var valueOrDefault = helpers.valueAtIndexOrDefault;
+ var model = element._model;
model.backgroundColor = custom.backgroundColor ? custom.backgroundColor : valueOrDefault(dataset.backgroundColor, index, elementOpts.backgroundColor);
model.borderColor = custom.borderColor ? custom.borderColor : valueOrDefault(dataset.borderColor, index, elementOpts.borderColor);
},
setHoverStyle: function(element) {
- var dataset = this.chart.data.datasets[element._datasetIndex],
- index = element._index,
- custom = element.custom || {},
- valueOrDefault = helpers.valueAtIndexOrDefault,
- getHoverColor = helpers.getHoverColor,
- model = element._model;
+ var dataset = this.chart.data.datasets[element._datasetIndex];
+ var index = element._index;
+ var custom = element.custom || {};
+ var valueOrDefault = helpers.valueAtIndexOrDefault;
+ var getHoverColor = helpers.getHoverColor;
+ var model = element._model;
model.backgroundColor = custom.hoverBackgroundColor ? custom.hoverBackgroundColor : valueOrDefault(dataset.hoverBackgroundColor, index, getHoverColor(model.backgroundColor));
model.borderColor = custom.hoverBorderColor ? custom.hoverBorderColor : valueOrDefault(dataset.hoverBorderColor, index, getHoverColor(model.borderColor));
};
// Gets the angle from vertical upright to the point about a centre.
helpers.getAngleFromPoint = function(centrePoint, anglePoint) {
- var distanceFromXCenter = anglePoint.x - centrePoint.x,
- distanceFromYCenter = anglePoint.y - centrePoint.y,
- radialDistanceFromCenter = Math.sqrt(distanceFromXCenter * distanceFromXCenter + distanceFromYCenter * distanceFromYCenter);
+ var distanceFromXCenter = anglePoint.x - centrePoint.x;
+ var distanceFromYCenter = anglePoint.y - centrePoint.y;
+ var radialDistanceFromCenter = Math.sqrt(distanceFromXCenter * distanceFromXCenter + distanceFromYCenter * distanceFromYCenter);
var angle = Math.atan2(distanceFromYCenter, distanceFromXCenter);
// This function must also respect "skipped" points
- var previous = firstPoint.skip ? middlePoint : firstPoint,
- current = middlePoint,
- next = afterPoint.skip ? middlePoint : afterPoint;
+ var previous = firstPoint.skip ? middlePoint : firstPoint;
+ var current = middlePoint;
+ var next = afterPoint.skip ? middlePoint : afterPoint;
var d01 = Math.sqrt(Math.pow(current.x - previous.x, 2) + Math.pow(current.y - previous.y, 2));
var d12 = Math.sqrt(Math.pow(next.x - current.x, 2) + Math.pow(next.y - current.y, 2));
// -- DOM methods
helpers.getRelativePosition = function(evt, chart) {
var mouseX, mouseY;
- var e = evt.originalEvent || evt,
- canvas = evt.currentTarget || evt.srcElement,
- boundingRect = canvas.getBoundingClientRect();
+ var e = evt.originalEvent || evt;
+ var canvas = evt.currentTarget || evt.srcElement;
+ var boundingRect = canvas.getBoundingClientRect();
var touches = e.touches;
if (touches && touches.length > 0) {
chart.data.datasets.forEach(function(dataset, datasetIndex) {
if (chart.isDatasetVisible(datasetIndex)) {
- var meta = chart.getDatasetMeta(datasetIndex),
- element = meta.data[items[0]._index];
+ var meta = chart.getDatasetMeta(datasetIndex);
+ var element = meta.data[items[0]._index];
// don't count items that are skipped (null data)
if (element && !element._view.skip) {
if (labels.length && me.options.display && me.isHorizontal()) {
var originalLabelWidth = helpers.longestText(context, tickFont.font, labels, me.longestTextCache);
var labelWidth = originalLabelWidth;
- var cosRotation;
- var sinRotation;
+ var cosRotation, sinRotation;
// Allow 3 pixels x2 padding either side for label readability
var tickWidth = me.getPixelForTick(1) - me.getPixelForTick(0) - 6;
// Draw the line at the edge of the axis
context.lineWidth = helpers.valueAtIndexOrDefault(gridLines.lineWidth, 0);
context.strokeStyle = helpers.valueAtIndexOrDefault(gridLines.color, 0);
- var x1 = me.left,
- x2 = me.right,
- y1 = me.top,
- y2 = me.bottom;
+ var x1 = me.left;
+ var x2 = me.right;
+ var y1 = me.top;
+ var y2 = me.bottom;
var aliasPixel = helpers.aliasPixel(context.lineWidth);
if (isHorizontal) {
var endExp = Math.floor(helpers.log10(dataRange.max));
var endSignificand = Math.ceil(dataRange.max / Math.pow(10, endExp));
- var exp;
- var significand;
+ var exp, significand;
if (tickVal === 0) {
exp = Math.floor(helpers.log10(dataRange.minNotZero));
function createTooltipItem(element) {
var xScale = element._xScale;
var yScale = element._yScale || element._scale; // handle radar || polarArea charts
- var index = element._index,
- datasetIndex = element._datasetIndex;
+ var index = element._index;
+ var datasetIndex = element._datasetIndex;
return {
xLabel: xScale ? xScale.getLabelForIndex(index, datasetIndex) : '',
var titleLineCount = model.title.length;
var footerLineCount = model.footer.length;
- var titleFontSize = model.titleFontSize,
- bodyFontSize = model.bodyFontSize,
- footerFontSize = model.footerFontSize;
+ var titleFontSize = model.titleFontSize;
+ var bodyFontSize = model.bodyFontSize;
+ var footerFontSize = model.footerFontSize;
height += titleLineCount * titleFontSize; // Title Lines
height += titleLineCount ? (titleLineCount - 1) * model.titleSpacing : 0; // Title Line Spacing
var x = vm.x;
var y = vm.y;
- var caretSize = vm.caretSize,
- caretPadding = vm.caretPadding,
- cornerRadius = vm.cornerRadius,
- xAlign = alignment.xAlign,
- yAlign = alignment.yAlign,
- paddingAndSize = caretSize + caretPadding,
- radiusAndPadding = cornerRadius + caretPadding;
+ var caretSize = vm.caretSize;
+ var caretPadding = vm.caretPadding;
+ var cornerRadius = vm.cornerRadius;
+ var xAlign = alignment.xAlign;
+ var yAlign = alignment.yAlign;
+ var paddingAndSize = caretSize + caretPadding;
+ var radiusAndPadding = cornerRadius + caretPadding;
if (xAlign === 'right') {
x -= size.width;
var opts = me._options;
var callbacks = opts.callbacks;
- var beforeTitle = callbacks.beforeTitle.apply(me, arguments),
- title = callbacks.title.apply(me, arguments),
- afterTitle = callbacks.afterTitle.apply(me, arguments);
+ var beforeTitle = callbacks.beforeTitle.apply(me, arguments);
+ var title = callbacks.title.apply(me, arguments);
+ var afterTitle = callbacks.afterTitle.apply(me, arguments);
var lines = [];
lines = pushOrConcat(lines, beforeTitle);
ctx.lineTo(caretPosition.x3, caretPosition.y3);
},
getCaretPosition: function(tooltipPoint, size, vm) {
- var x1, x2, x3;
- var y1, y2, y3;
+ var x1, x2, x3, y1, y2, y3;
var caretSize = vm.caretSize;
var cornerRadius = vm.cornerRadius;
- var xAlign = vm.xAlign,
- yAlign = vm.yAlign;
- var ptX = tooltipPoint.x,
- ptY = tooltipPoint.y;
- var width = size.width,
- height = size.height;
+ var xAlign = vm.xAlign;
+ var yAlign = vm.yAlign;
+ var ptX = tooltipPoint.x;
+ var ptY = tooltipPoint.y;
+ var width = size.width;
+ var height = size.height;
if (yAlign === 'center') {
y2 = ptY + (height / 2);
ctx.textAlign = vm._titleAlign;
ctx.textBaseline = 'top';
- var titleFontSize = vm.titleFontSize,
- titleSpacing = vm.titleSpacing;
+ var titleFontSize = vm.titleFontSize;
+ var titleSpacing = vm.titleSpacing;
ctx.fillStyle = mergeOpacity(vm.titleFontColor, opacity);
ctx.font = helpers.fontString(titleFontSize, vm._titleFontStyle, vm._titleFontFamily);
nearest: function(elements, eventPosition) {
var x = eventPosition.x;
var y = eventPosition.y;
-
- var nearestElement;
var minDistance = Number.POSITIVE_INFINITY;
- var i, len;
+ var i, len, nearestElement;
+
for (i = 0, len = elements.length; i < len; ++i) {
var el = elements[i];
if (el && el.hasValue()) {
var vm = this._view;
if (vm) {
- var pointRelativePosition = helpers.getAngleFromPoint(vm, {
- x: chartX,
- y: chartY
- }),
- angle = pointRelativePosition.angle,
- distance = pointRelativePosition.distance;
+ var pointRelativePosition = helpers.getAngleFromPoint(vm, {x: chartX, y: chartY});
+ var angle = pointRelativePosition.angle;
+ var distance = pointRelativePosition.distance;
// Sanitise angle range
var startAngle = vm.startAngle;
}
// Check if within the range of the open/close angle
- var betweenAngles = (angle >= startAngle && angle <= endAngle),
- withinRadius = (distance >= vm.innerRadius && distance <= vm.outerRadius);
+ var betweenAngles = (angle >= startAngle && angle <= endAngle);
+ var withinRadius = (distance >= vm.innerRadius && distance <= vm.outerRadius);
return (betweenAngles && withinRadius);
}
tooltipPosition: function() {
var vm = this._view;
+ var centreAngle = vm.startAngle + ((vm.endAngle - vm.startAngle) / 2);
+ var rangeFromCentre = (vm.outerRadius - vm.innerRadius) / 2 + vm.innerRadius;
- var centreAngle = vm.startAngle + ((vm.endAngle - vm.startAngle) / 2),
- rangeFromCentre = (vm.outerRadius - vm.innerRadius) / 2 + vm.innerRadius;
return {
x: vm.x + (Math.cos(centreAngle) * rangeFromCentre),
y: vm.y + (Math.sin(centreAngle) * rangeFromCentre)
},
draw: function() {
-
- var ctx = this._chart.ctx,
- vm = this._view,
- sA = vm.startAngle,
- eA = vm.endAngle;
+ var ctx = this._chart.ctx;
+ var vm = this._view;
+ var sA = vm.startAngle;
+ var eA = vm.endAngle;
ctx.beginPath();
var ctx = me.ctx;
- var globalDefault = defaults.global,
- valueOrDefault = helpers.valueOrDefault,
- fontSize = valueOrDefault(labelOpts.fontSize, globalDefault.defaultFontSize),
- fontStyle = valueOrDefault(labelOpts.fontStyle, globalDefault.defaultFontStyle),
- fontFamily = valueOrDefault(labelOpts.fontFamily, globalDefault.defaultFontFamily),
- labelFont = helpers.fontString(fontSize, fontStyle, fontFamily);
+ var globalDefault = defaults.global;
+ var valueOrDefault = helpers.valueOrDefault;
+ var fontSize = valueOrDefault(labelOpts.fontSize, globalDefault.defaultFontSize);
+ var fontStyle = valueOrDefault(labelOpts.fontStyle, globalDefault.defaultFontStyle);
+ var fontFamily = valueOrDefault(labelOpts.fontFamily, globalDefault.defaultFontFamily);
+ var labelFont = helpers.fontString(fontSize, fontStyle, fontFamily);
// Reset hit boxes
var hitboxes = me.legendHitBoxes = [];
var me = this;
var opts = me.options;
var labelOpts = opts.labels;
- var globalDefault = defaults.global,
- lineDefault = globalDefault.elements.line,
- legendWidth = me.width,
- lineWidths = me.lineWidths;
+ var globalDefault = defaults.global;
+ var lineDefault = globalDefault.elements.line;
+ var legendWidth = me.width;
+ var lineWidths = me.lineWidths;
if (opts.display) {
- var ctx = me.ctx,
- cursor,
- valueOrDefault = helpers.valueOrDefault,
- fontColor = valueOrDefault(labelOpts.fontColor, globalDefault.defaultFontColor),
- fontSize = valueOrDefault(labelOpts.fontSize, globalDefault.defaultFontSize),
- fontStyle = valueOrDefault(labelOpts.fontStyle, globalDefault.defaultFontStyle),
- fontFamily = valueOrDefault(labelOpts.fontFamily, globalDefault.defaultFontFamily),
- labelFont = helpers.fontString(fontSize, fontStyle, fontFamily);
+ var ctx = me.ctx;
+ var valueOrDefault = helpers.valueOrDefault;
+ var fontColor = valueOrDefault(labelOpts.fontColor, globalDefault.defaultFontColor);
+ var fontSize = valueOrDefault(labelOpts.fontSize, globalDefault.defaultFontSize);
+ var fontStyle = valueOrDefault(labelOpts.fontStyle, globalDefault.defaultFontStyle);
+ var fontFamily = valueOrDefault(labelOpts.fontFamily, globalDefault.defaultFontFamily);
+ var labelFont = helpers.fontString(fontSize, fontStyle, fontFamily);
+ var cursor;
// Canvas setup
ctx.textAlign = 'left';
ctx.fillStyle = fontColor; // render in correct colour
ctx.font = labelFont;
- var boxWidth = getBoxWidth(labelOpts, fontSize),
- hitboxes = me.legendHitBoxes;
+ var boxWidth = getBoxWidth(labelOpts, fontSize);
+ var hitboxes = me.legendHitBoxes;
// current position
var drawLegendBox = function(x, y, legendItem) {
var itemHeight = fontSize + labelOpts.padding;
helpers.each(me.legendItems, function(legendItem, i) {
- var textWidth = ctx.measureText(legendItem.text).width,
- width = boxWidth + (fontSize / 2) + textWidth,
- x = cursor.x,
- y = cursor.y;
+ var textWidth = ctx.measureText(legendItem.text).width;
+ var width = boxWidth + (fontSize / 2) + textWidth;
+ var x = cursor.x;
+ var y = cursor.y;
if (isHorizontal) {
if (x + width >= legendWidth) {
}
// Chart event already has relative position in it
- var x = e.x,
- y = e.y;
+ var x = e.x;
+ var y = e.y;
if (x >= me.left && x <= me.right && y >= me.top && y <= me.bottom) {
// See if we are touching one of the dataset boxes
beforeFit: noop,
fit: function() {
- var me = this,
- valueOrDefault = helpers.valueOrDefault,
- opts = me.options,
- display = opts.display,
- fontSize = valueOrDefault(opts.fontSize, defaults.global.defaultFontSize),
- minSize = me.minSize,
- lineCount = helpers.isArray(opts.text) ? opts.text.length : 1,
- lineHeight = helpers.options.toLineHeight(opts.lineHeight, fontSize),
- textSize = display ? (lineCount * lineHeight) + (opts.padding * 2) : 0;
+ var me = this;
+ var valueOrDefault = helpers.valueOrDefault;
+ var opts = me.options;
+ var display = opts.display;
+ var fontSize = valueOrDefault(opts.fontSize, defaults.global.defaultFontSize);
+ var minSize = me.minSize;
+ var lineCount = helpers.isArray(opts.text) ? opts.text.length : 1;
+ var lineHeight = helpers.options.toLineHeight(opts.lineHeight, fontSize);
+ var textSize = display ? (lineCount * lineHeight) + (opts.padding * 2) : 0;
if (me.isHorizontal()) {
minSize.width = me.maxWidth; // fill all the width
// Actually draw the title block on the canvas
draw: function() {
- var me = this,
- ctx = me.ctx,
- valueOrDefault = helpers.valueOrDefault,
- opts = me.options,
- globalDefaults = defaults.global;
+ var me = this;
+ var ctx = me.ctx;
+ var valueOrDefault = helpers.valueOrDefault;
+ var opts = me.options;
+ var globalDefaults = defaults.global;
if (opts.display) {
- var fontSize = valueOrDefault(opts.fontSize, globalDefaults.defaultFontSize),
- fontStyle = valueOrDefault(opts.fontStyle, globalDefaults.defaultFontStyle),
- fontFamily = valueOrDefault(opts.fontFamily, globalDefaults.defaultFontFamily),
- titleFont = helpers.fontString(fontSize, fontStyle, fontFamily),
- lineHeight = helpers.options.toLineHeight(opts.lineHeight, fontSize),
- offset = lineHeight / 2 + opts.padding,
- rotation = 0,
- titleX,
- titleY,
- top = me.top,
- left = me.left,
- bottom = me.bottom,
- right = me.right,
- maxWidth;
+ var fontSize = valueOrDefault(opts.fontSize, globalDefaults.defaultFontSize);
+ var fontStyle = valueOrDefault(opts.fontStyle, globalDefaults.defaultFontStyle);
+ var fontFamily = valueOrDefault(opts.fontFamily, globalDefaults.defaultFontFamily);
+ var titleFont = helpers.fontString(fontSize, fontStyle, fontFamily);
+ var lineHeight = helpers.options.toLineHeight(opts.lineHeight, fontSize);
+ var offset = lineHeight / 2 + opts.padding;
+ var rotation = 0;
+ var top = me.top;
+ var left = me.left;
+ var bottom = me.bottom;
+ var right = me.right;
+ var maxWidth, titleX, titleY;
ctx.fillStyle = valueOrDefault(opts.fontColor, globalDefaults.defaultFontColor); // render in correct colour
ctx.font = titleFont;
},
getPixelForValue: function(value) {
var me = this;
- var innerDimension;
- var pixel;
-
var start = me.start;
var newVal = +me.getRightValue(value);
- var range;
var opts = me.options;
var tickOpts = opts.ticks;
+ var innerDimension, pixel, range;
if (me.isHorizontal()) {
range = helpers.log10(me.end) - helpers.log10(start); // todo: if start === 0
b: 0
};
var furthestAngles = {};
- var i;
- var textSize;
- var pointPosition;
+ var i, textSize, pointPosition;
scale.ctx.font = plFont.font;
scale._pointLabelSizes = [];
},
setCenterPoint: function(leftMovement, rightMovement, topMovement, bottomMovement) {
var me = this;
- var maxRight = me.width - rightMovement - me.drawingArea,
- maxLeft = leftMovement + me.drawingArea,
- maxTop = topMovement + me.drawingArea,
- maxBottom = me.height - bottomMovement - me.drawingArea;
+ var maxRight = me.width - rightMovement - me.drawingArea;
+ var maxLeft = leftMovement + me.drawingArea;
+ var maxTop = topMovement + me.drawingArea;
+ var maxBottom = me.height - bottomMovement - me.drawingArea;
me.xCenter = Math.round(((maxLeft + maxRight) / 2) + me.left);
me.yCenter = Math.round(((maxTop + maxBottom) / 2) + me.top);