archive-gh-me/Chart.js
1
0
Fork 0
mirror of https://github.com/chartjs/Chart.js.git synced 2025-12-08 20:36:08 +00:00
Code Issues Projects Releases Wiki Activity

Merge pull request #1436 from honza889/reverse-radar

Browse Source 
Reverse scale on radar / polar area
This commit is contained in:
Evert Timberg 2015-09-02 17:46:35 -04:00
commit 4d51f21831
4 changed files with 25 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
samples/polar-area.html
View File

@ -58,7 +58,11 @@
]
},
options: {
responsive: true
responsive: true,
scale: {
beginAtZero: true,
reverse: false
}
}
};

6
samples/radar.html
View File

@ -50,6 +50,12 @@
pointHighlightStroke: "rgba(151,187,205,1)",
data: [null, randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor()]
}]
},
options: {
scale: {
beginAtZero: true,
reverse: false
}
}
};

1
samples/scatter-multi-axis.html
View File

@ -111,6 +111,7 @@
type: "linear", // only linear but allow scale type registration. This allows extensions to exist solely for log scale for instance
display: true,
position: "right",
reverse: true,
id: "y-axis-2",
// grid line settings

18
src/scales/scale.radialLinear.js
View File

@ -27,6 +27,7 @@
},
// scale numbers
reverse: false,
beginAtZero: true,
// label settings
@ -94,6 +95,8 @@
helpers.each(this.data.datasets, function(dataset) {
helpers.each(dataset.data, function(value, index) {
if (value === null) return;
if (this.min === null) {
this.min = value;
} else if (value < this.min) {
@ -327,9 +330,14 @@
return index * angleMultiplier - (Math.PI / 2);
},
getDistanceFromCenterForValue: function(value) {
if (value === null) return 0; // null always in center
// Take into account half font size + the yPadding of the top value
var scalingFactor = this.drawingArea / (this.max - this.min);
return (value - this.min) * scalingFactor;
if (this.options.reverse) {
return (this.max - value) * scalingFactor;
} else {
return (value - this.min) * scalingFactor;
}
},
getPointPosition: function(index, distanceFromCenter) {
var thisAngle = this.getIndexAngle(index);
@ -345,8 +353,8 @@
if (this.options.display) {
var ctx = this.ctx;
helpers.each(this.yLabels, function(label, index) {
// Don't draw a centre value
if (index > 0) {
// Don't draw a centre value (if it is minimum)
if (index > 0 || this.options.reverse) {
var yCenterOffset = this.getDistanceFromCenterForValue(this.ticks[index]);
var yHeight = this.yCenter - yCenterOffset;
@ -405,7 +413,7 @@
for (var i = this.getValueCount() - 1; i >= 0; i--) {
if (this.options.angleLines.show) {
var outerPosition = this.getPointPosition(i, this.getDistanceFromCenterForValue(this.max));
var outerPosition = this.getPointPosition(i, this.getDistanceFromCenterForValue(this.options.reverse ? this.min : this.max));
ctx.beginPath();
ctx.moveTo(this.xCenter, this.yCenter);
ctx.lineTo(outerPosition.x, outerPosition.y);
@ -413,7 +421,7 @@
ctx.closePath();
}
// Extra 3px out for some label spacing
var pointLabelPosition = this.getPointPosition(i, this.getDistanceFromCenterForValue(this.max) + 5);
var pointLabelPosition = this.getPointPosition(i, this.getDistanceFromCenterForValue(this.options.reverse ? this.min : this.max) + 5);
ctx.font = helpers.fontString(this.options.pointLabels.fontSize, this.options.pointLabels.fontStyle, this.options.pointLabels.fontFamily);
ctx.fillStyle = this.options.pointLabels.fontColor;