mirror of
https://github.com/chartjs/Chart.js.git
synced 2025-12-08 20:36:08 +00:00
889ecd560b
Default options can now be accessed by importing `core/core.defaults`. The returned object acts as a singleton and is populated when importing classes that expose their own default values (meaning that importing only `code.defaults` results in an empty object). Also make `Chart.Ticks` and `Chart.Interaction` importable since existing defaults rely on these values. Add the `defaults._set` method that make easier declaring new defaults by merging given values with existing ones for a specific scope (`global`, `scale`, `bar`, etc).
109 lines
2.6 KiB
JavaScript
109 lines
2.6 KiB
JavaScript
'use strict';
|
|
|
|
var defaults = require('../core/core.defaults');
|
|
var helpers = require('../helpers/index');
|
|
|
|
defaults._set('global', {
|
|
elements: {
|
|
arc: {
|
|
backgroundColor: defaults.global.defaultColor,
|
|
borderColor: '#fff',
|
|
borderWidth: 2
|
|
}
|
|
}
|
|
});
|
|
|
|
module.exports = function(Chart) {
|
|
|
|
Chart.elements.Arc = Chart.Element.extend({
|
|
inLabelRange: function(mouseX) {
|
|
var vm = this._view;
|
|
|
|
if (vm) {
|
|
return (Math.pow(mouseX - vm.x, 2) < Math.pow(vm.radius + vm.hoverRadius, 2));
|
|
}
|
|
return false;
|
|
},
|
|
inRange: function(chartX, chartY) {
|
|
var vm = this._view;
|
|
|
|
if (vm) {
|
|
var pointRelativePosition = helpers.getAngleFromPoint(vm, {
|
|
x: chartX,
|
|
y: chartY
|
|
}),
|
|
angle = pointRelativePosition.angle,
|
|
distance = pointRelativePosition.distance;
|
|
|
|
// Sanitise angle range
|
|
var startAngle = vm.startAngle;
|
|
var endAngle = vm.endAngle;
|
|
while (endAngle < startAngle) {
|
|
endAngle += 2.0 * Math.PI;
|
|
}
|
|
while (angle > endAngle) {
|
|
angle -= 2.0 * Math.PI;
|
|
}
|
|
while (angle < startAngle) {
|
|
angle += 2.0 * Math.PI;
|
|
}
|
|
|
|
// Check if within the range of the open/close angle
|
|
var betweenAngles = (angle >= startAngle && angle <= endAngle),
|
|
withinRadius = (distance >= vm.innerRadius && distance <= vm.outerRadius);
|
|
|
|
return (betweenAngles && withinRadius);
|
|
}
|
|
return false;
|
|
},
|
|
getCenterPoint: function() {
|
|
var vm = this._view;
|
|
var halfAngle = (vm.startAngle + vm.endAngle) / 2;
|
|
var halfRadius = (vm.innerRadius + vm.outerRadius) / 2;
|
|
return {
|
|
x: vm.x + Math.cos(halfAngle) * halfRadius,
|
|
y: vm.y + Math.sin(halfAngle) * halfRadius
|
|
};
|
|
},
|
|
getArea: function() {
|
|
var vm = this._view;
|
|
return Math.PI * ((vm.endAngle - vm.startAngle) / (2 * Math.PI)) * (Math.pow(vm.outerRadius, 2) - Math.pow(vm.innerRadius, 2));
|
|
},
|
|
tooltipPosition: function() {
|
|
var vm = this._view;
|
|
|
|
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;
|
|
|
|
ctx.beginPath();
|
|
|
|
ctx.arc(vm.x, vm.y, vm.outerRadius, sA, eA);
|
|
ctx.arc(vm.x, vm.y, vm.innerRadius, eA, sA, true);
|
|
|
|
ctx.closePath();
|
|
ctx.strokeStyle = vm.borderColor;
|
|
ctx.lineWidth = vm.borderWidth;
|
|
|
|
ctx.fillStyle = vm.backgroundColor;
|
|
|
|
ctx.fill();
|
|
ctx.lineJoin = 'bevel';
|
|
|
|
if (vm.borderWidth) {
|
|
ctx.stroke();
|
|
}
|
|
}
|
|
});
|
|
};
|