mirror of
https://github.com/chartjs/Chart.js.git
synced 2024-10-06 12:19:08 +02:00
Add tests for polarArea chart animations (#8455)
* Add tests for polarArea chart animations * Remove commented code
This commit is contained in:
parent
e2a47342ba
commit
e6742e31ac
75
test/fixtures/controller.polarArea/polar-area-animation-rotate.js
vendored
Normal file
75
test/fixtures/controller.polarArea/polar-area-animation-rotate.js
vendored
Normal file
@ -0,0 +1,75 @@
|
||||
const canvas = document.createElement('canvas');
|
||||
canvas.width = 512;
|
||||
canvas.height = 512;
|
||||
const ctx = canvas.getContext('2d');
|
||||
|
||||
module.exports = {
|
||||
config: {
|
||||
type: 'polarArea',
|
||||
data: {
|
||||
labels: ['A', 'B', 'C', 'D', 'E'],
|
||||
datasets: [{
|
||||
data: [1, 5, 10, 2, 4],
|
||||
backgroundColor: [
|
||||
'rgba(255, 99, 132, 0.8)',
|
||||
'rgba(54, 162, 235, 0.8)',
|
||||
'rgba(255, 206, 86, 0.8)',
|
||||
'rgba(75, 192, 192, 0.8)',
|
||||
'rgba(153, 102, 255, 0.8)'
|
||||
],
|
||||
borderWidth: 4,
|
||||
borderColor: [
|
||||
'rgb(255, 99, 132)',
|
||||
'rgb(54, 162, 235)',
|
||||
'rgb(255, 206, 86)',
|
||||
'rgb(75, 192, 192)',
|
||||
'rgb(153, 102, 255)'
|
||||
]
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
animation: {
|
||||
animateRotate: true,
|
||||
animateScale: false,
|
||||
duration: 800,
|
||||
easing: 'linear'
|
||||
},
|
||||
responsive: false,
|
||||
plugins: {
|
||||
legend: false,
|
||||
title: false,
|
||||
tooltip: false,
|
||||
filler: false
|
||||
},
|
||||
scales: {
|
||||
r: {
|
||||
ticks: {
|
||||
display: false,
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
options: {
|
||||
canvas: {
|
||||
height: 512,
|
||||
width: 512
|
||||
},
|
||||
run: function(chart) {
|
||||
const animator = Chart.animator;
|
||||
const start = animator._getAnims(chart).items[0]._start;
|
||||
animator._running = false;
|
||||
return new Promise((resolve) => setTimeout(() => {
|
||||
for (let i = 0; i < 16; i++) {
|
||||
animator._update(start + i * 50);
|
||||
let x = i % 4 * 128;
|
||||
let y = Math.floor(i / 4) * 128;
|
||||
ctx.drawImage(chart.canvas, x, y, 128, 128);
|
||||
}
|
||||
Chart.helpers.clearCanvas(chart.canvas);
|
||||
chart.ctx.drawImage(canvas, 0, 0);
|
||||
resolve();
|
||||
}, 100));
|
||||
}
|
||||
}
|
||||
};
|
BIN
test/fixtures/controller.polarArea/polar-area-animation-rotate.png
vendored
Normal file
BIN
test/fixtures/controller.polarArea/polar-area-animation-rotate.png
vendored
Normal file
Binary file not shown.
After Width: | Height: | Size: 67 KiB |
75
test/fixtures/controller.polarArea/polar-area-animation-scale.js
vendored
Normal file
75
test/fixtures/controller.polarArea/polar-area-animation-scale.js
vendored
Normal file
@ -0,0 +1,75 @@
|
||||
const canvas = document.createElement('canvas');
|
||||
canvas.width = 512;
|
||||
canvas.height = 512;
|
||||
const ctx = canvas.getContext('2d');
|
||||
|
||||
module.exports = {
|
||||
config: {
|
||||
type: 'polarArea',
|
||||
data: {
|
||||
labels: ['A', 'B', 'C', 'D', 'E'],
|
||||
datasets: [{
|
||||
data: [1, 5, 10, 2, 4],
|
||||
backgroundColor: [
|
||||
'rgba(255, 99, 132, 0.8)',
|
||||
'rgba(54, 162, 235, 0.8)',
|
||||
'rgba(255, 206, 86, 0.8)',
|
||||
'rgba(75, 192, 192, 0.8)',
|
||||
'rgba(153, 102, 255, 0.8)'
|
||||
],
|
||||
borderWidth: 4,
|
||||
borderColor: [
|
||||
'rgb(255, 99, 132)',
|
||||
'rgb(54, 162, 235)',
|
||||
'rgb(255, 206, 86)',
|
||||
'rgb(75, 192, 192)',
|
||||
'rgb(153, 102, 255)'
|
||||
]
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
animation: {
|
||||
animateRotate: false,
|
||||
animateScale: true,
|
||||
duration: 800,
|
||||
easing: 'linear'
|
||||
},
|
||||
responsive: false,
|
||||
plugins: {
|
||||
legend: false,
|
||||
title: false,
|
||||
tooltip: false,
|
||||
filler: false
|
||||
},
|
||||
scales: {
|
||||
r: {
|
||||
ticks: {
|
||||
display: false,
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
options: {
|
||||
canvas: {
|
||||
height: 512,
|
||||
width: 512
|
||||
},
|
||||
run: function(chart) {
|
||||
const animator = Chart.animator;
|
||||
const start = animator._getAnims(chart).items[0]._start;
|
||||
animator._running = false;
|
||||
return new Promise((resolve) => setTimeout(() => {
|
||||
for (let i = 0; i < 16; i++) {
|
||||
animator._update(start + i * 50);
|
||||
let x = i % 4 * 128;
|
||||
let y = Math.floor(i / 4) * 128;
|
||||
ctx.drawImage(chart.canvas, x, y, 128, 128);
|
||||
}
|
||||
Chart.helpers.clearCanvas(chart.canvas);
|
||||
chart.ctx.drawImage(canvas, 0, 0);
|
||||
resolve();
|
||||
}, 100));
|
||||
}
|
||||
}
|
||||
};
|
BIN
test/fixtures/controller.polarArea/polar-area-animation-scale.png
vendored
Normal file
BIN
test/fixtures/controller.polarArea/polar-area-animation-scale.png
vendored
Normal file
Binary file not shown.
After Width: | Height: | Size: 52 KiB |
Loading…
Reference in New Issue
Block a user