2015-08-23 23:17:46 +02:00
|
|
|
describe('Linear Scale', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
var chartInstance;
|
|
|
|
|
|
|
|
beforeEach(function() {
|
|
|
|
window.addDefaultMatchers(jasmine);
|
|
|
|
});
|
|
|
|
|
|
|
|
afterEach(function() {
|
|
|
|
if (chartInstance)
|
|
|
|
{
|
|
|
|
releaseChart(chartInstance);
|
|
|
|
}
|
|
|
|
});
|
2015-08-23 23:17:46 +02:00
|
|
|
|
2015-09-26 03:04:45 +02:00
|
|
|
it('Should register the constructor with the scale service', function() {
|
|
|
|
var Constructor = Chart.scaleService.getScaleConstructor('linear');
|
|
|
|
expect(Constructor).not.toBe(undefined);
|
|
|
|
expect(typeof Constructor).toBe('function');
|
|
|
|
});
|
|
|
|
|
|
|
|
it('Should have the correct default config', function() {
|
|
|
|
var defaultConfig = Chart.scaleService.getScaleDefaults('linear');
|
|
|
|
expect(defaultConfig).toEqual({
|
|
|
|
display: true,
|
|
|
|
|
|
|
|
gridLines: {
|
|
|
|
color: "rgba(0, 0, 0, 0.1)",
|
|
|
|
drawOnChartArea: true,
|
|
|
|
drawTicks: true, // draw ticks extending towards the label
|
2016-04-17 03:49:08 +02:00
|
|
|
tickMarkLength: 10,
|
2015-09-26 03:04:45 +02:00
|
|
|
lineWidth: 1,
|
|
|
|
offsetGridLines: false,
|
2015-11-25 01:18:15 +01:00
|
|
|
display: true,
|
2015-09-26 03:04:45 +02:00
|
|
|
zeroLineColor: "rgba(0,0,0,0.25)",
|
|
|
|
zeroLineWidth: 1,
|
|
|
|
},
|
|
|
|
position: "left",
|
|
|
|
scaleLabel: {
|
|
|
|
labelString: '',
|
2015-11-25 01:18:15 +01:00
|
|
|
display: false,
|
2015-09-26 03:04:45 +02:00
|
|
|
},
|
|
|
|
ticks: {
|
|
|
|
beginAtZero: false,
|
2016-04-17 00:38:03 +02:00
|
|
|
maxRotation: 50,
|
2015-09-26 03:04:45 +02:00
|
|
|
mirror: false,
|
|
|
|
padding: 10,
|
|
|
|
reverse: false,
|
2015-11-25 01:18:15 +01:00
|
|
|
display: true,
|
2015-10-19 01:48:57 +02:00
|
|
|
callback: defaultConfig.ticks.callback, // make this work nicer, then check below
|
2015-12-21 23:47:38 +01:00
|
|
|
autoSkip: true,
|
2016-04-17 00:38:03 +02:00
|
|
|
autoSkipPadding: 0
|
2015-09-26 03:04:45 +02:00
|
|
|
}
|
2015-08-23 23:17:46 +02:00
|
|
|
});
|
2015-10-19 01:48:57 +02:00
|
|
|
|
|
|
|
expect(defaultConfig.ticks.callback).toEqual(jasmine.any(Function));
|
2015-09-26 03:04:45 +02:00
|
|
|
});
|
2015-08-23 23:17:46 +02:00
|
|
|
|
2015-09-26 03:04:45 +02:00
|
|
|
it('Should correctly determine the max & min data values', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'bar',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [10, 5, 0, -5, 78, -100]
|
|
|
|
}, {
|
|
|
|
yAxisID: 'yScale1',
|
|
|
|
data: [-1000, 1000],
|
|
|
|
}, {
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [150]
|
|
|
|
}],
|
|
|
|
labels: ['a', 'b', 'c', 'd', 'e', 'f']
|
2015-11-13 15:38:35 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear'
|
|
|
|
}, {
|
|
|
|
id: 'yScale1',
|
|
|
|
type: 'linear'
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2015-08-23 23:17:46 +02:00
|
|
|
});
|
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
expect(chartInstance.scales.yScale0).not.toEqual(undefined); // must construct
|
|
|
|
expect(chartInstance.scales.yScale0.min).toBe(-100);
|
|
|
|
expect(chartInstance.scales.yScale0.max).toBe(150);
|
2015-11-18 00:43:18 +01:00
|
|
|
});
|
|
|
|
|
|
|
|
it('Should correctly determine the max & min of string data values', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'bar',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: ['10', '5', '0', '-5', '78', '-100']
|
|
|
|
}, {
|
|
|
|
yAxisID: 'yScale1',
|
|
|
|
data: ['-1000', '1000'],
|
|
|
|
}, {
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: ['150']
|
|
|
|
}],
|
|
|
|
labels: ['a', 'b', 'c', 'd', 'e', 'f']
|
2015-11-18 00:43:18 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear'
|
|
|
|
}, {
|
|
|
|
id: 'yScale1',
|
|
|
|
type: 'linear'
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2015-11-18 00:43:18 +01:00
|
|
|
});
|
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
expect(chartInstance.scales.yScale0).not.toEqual(undefined); // must construct
|
|
|
|
expect(chartInstance.scales.yScale0.min).toBe(-100);
|
|
|
|
expect(chartInstance.scales.yScale0.max).toBe(150);
|
2015-09-26 03:04:45 +02:00
|
|
|
});
|
2015-08-23 23:17:46 +02:00
|
|
|
|
2015-10-08 01:37:53 +02:00
|
|
|
it('Should correctly determine the max & min data values ignoring hidden datasets', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'bar',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: ['10', '5', '0', '-5', '78', '-100']
|
|
|
|
}, {
|
|
|
|
yAxisID: 'yScale1',
|
|
|
|
data: ['-1000', '1000'],
|
|
|
|
}, {
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: ['150'],
|
|
|
|
hidden: true
|
|
|
|
}],
|
|
|
|
labels: ['a', 'b', 'c', 'd', 'e', 'f']
|
2015-11-13 15:38:35 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear'
|
|
|
|
}, {
|
|
|
|
id: 'yScale1',
|
|
|
|
type: 'linear'
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2015-10-08 01:37:53 +02:00
|
|
|
});
|
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
expect(chartInstance.scales.yScale0).not.toEqual(undefined); // must construct
|
|
|
|
expect(chartInstance.scales.yScale0.min).toBe(-100);
|
|
|
|
expect(chartInstance.scales.yScale0.max).toBe(80);
|
2015-10-08 01:37:53 +02:00
|
|
|
});
|
|
|
|
|
2016-01-23 18:44:55 +01:00
|
|
|
it('Should correctly determine the max & min data values ignoring data that is NaN', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'bar',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [null, 90, NaN, undefined, 45, 30]
|
|
|
|
}],
|
|
|
|
labels: ['a', 'b', 'c', 'd', 'e', 'f']
|
2016-01-23 18:44:55 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear'
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2016-01-23 18:44:55 +01:00
|
|
|
});
|
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
expect(chartInstance.scales.yScale0.min).toBe(30);
|
|
|
|
expect(chartInstance.scales.yScale0.max).toBe(90);
|
2016-01-23 18:44:55 +01:00
|
|
|
|
|
|
|
// Scale is now stacked
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance.scales.yScale0.options.stacked = true;
|
|
|
|
chartInstance.update();
|
2016-01-23 18:44:55 +01:00
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
expect(chartInstance.scales.yScale0.min).toBe(0);
|
|
|
|
expect(chartInstance.scales.yScale0.max).toBe(90);
|
2016-01-23 18:44:55 +01:00
|
|
|
});
|
|
|
|
|
2015-09-26 03:04:45 +02:00
|
|
|
it('Should correctly determine the max & min for scatter data', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'line',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
xAxisID: 'xScale0',
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [{
|
|
|
|
x: 10,
|
|
|
|
y: 100
|
|
|
|
}, {
|
|
|
|
x: -10,
|
|
|
|
y: 0
|
|
|
|
}, {
|
|
|
|
x: 0,
|
|
|
|
y: 0
|
|
|
|
}, {
|
|
|
|
x: 99,
|
|
|
|
y: 7
|
|
|
|
}]
|
|
|
|
}],
|
2015-11-13 15:38:35 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
xAxes: [{
|
|
|
|
id: 'xScale0',
|
|
|
|
type: 'linear',
|
|
|
|
position: 'bottom'
|
|
|
|
}],
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear'
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2015-08-23 23:17:46 +02:00
|
|
|
});
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance.update();
|
2015-08-23 23:17:46 +02:00
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
expect(chartInstance.scales.xScale0.min).toBe(-20);
|
|
|
|
expect(chartInstance.scales.xScale0.max).toBe(100);
|
|
|
|
expect(chartInstance.scales.yScale0.min).toBe(0);
|
|
|
|
expect(chartInstance.scales.yScale0.max).toBe(100);
|
2015-09-26 03:04:45 +02:00
|
|
|
});
|
|
|
|
|
2016-01-23 18:44:55 +01:00
|
|
|
it('Should correctly get the label for the given index', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'line',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
xAxisID: 'xScale0',
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [{
|
|
|
|
x: 10,
|
|
|
|
y: 100
|
|
|
|
}, {
|
|
|
|
x: -10,
|
|
|
|
y: 0
|
|
|
|
}, {
|
|
|
|
x: 0,
|
|
|
|
y: 0
|
|
|
|
}, {
|
|
|
|
x: 99,
|
|
|
|
y: 7
|
|
|
|
}]
|
|
|
|
}],
|
2016-01-23 18:44:55 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
xAxes: [{
|
|
|
|
id: 'xScale0',
|
|
|
|
type: 'linear',
|
|
|
|
position: 'bottom'
|
|
|
|
}],
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear'
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2016-01-23 18:44:55 +01:00
|
|
|
});
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance.update();
|
2016-01-23 18:44:55 +01:00
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
expect(chartInstance.scales.yScale0.getLabelForIndex(3, 0)).toBe(7);
|
2016-01-23 18:44:55 +01:00
|
|
|
});
|
|
|
|
|
2015-09-26 03:04:45 +02:00
|
|
|
it('Should correctly determine the min and max data values when stacked mode is turned on', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'line',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [10, 5, 0, -5, 78, -100],
|
|
|
|
type: 'bar'
|
|
|
|
}, {
|
|
|
|
yAxisID: 'yScale1',
|
|
|
|
data: [-1000, 1000],
|
|
|
|
}, {
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [150, 0, 0, -100, -10, 9],
|
|
|
|
type: 'bar'
|
|
|
|
}, {
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [10, 10, 10, 10, 10, 10],
|
|
|
|
type: 'line'
|
|
|
|
}],
|
|
|
|
labels: ['a', 'b', 'c', 'd', 'e', 'f']
|
2015-11-13 15:38:35 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear',
|
|
|
|
stacked: true
|
|
|
|
}, {
|
|
|
|
id: 'yScale1',
|
|
|
|
type: 'linear'
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2015-10-08 01:37:53 +02:00
|
|
|
});
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance.update();
|
2015-10-08 01:37:53 +02:00
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
expect(chartInstance.scales.yScale0.min).toBe(-150);
|
|
|
|
expect(chartInstance.scales.yScale0.max).toBe(200);
|
2015-10-08 01:37:53 +02:00
|
|
|
});
|
|
|
|
|
|
|
|
it('Should correctly determine the min and max data values when stacked mode is turned on and there are hidden datasets', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'bar',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [10, 5, 0, -5, 78, -100],
|
|
|
|
}, {
|
|
|
|
yAxisID: 'yScale1',
|
|
|
|
data: [-1000, 1000],
|
|
|
|
}, {
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [150, 0, 0, -100, -10, 9],
|
|
|
|
}, {
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [10, 20, 30, 40, 50, 60],
|
|
|
|
hidden: true
|
|
|
|
}],
|
|
|
|
labels: ['a', 'b', 'c', 'd', 'e', 'f']
|
2015-11-13 15:38:35 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear',
|
|
|
|
stacked: true
|
|
|
|
}, {
|
|
|
|
id: 'yScale1',
|
|
|
|
type: 'linear'
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2015-09-26 03:04:45 +02:00
|
|
|
});
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance.update();
|
2015-09-25 04:08:25 +02:00
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
expect(chartInstance.scales.yScale0.min).toBe(-150);
|
|
|
|
expect(chartInstance.scales.yScale0.max).toBe(200);
|
2015-09-26 03:04:45 +02:00
|
|
|
});
|
|
|
|
|
2016-01-09 15:51:04 +01:00
|
|
|
it('Should correctly determine the min and max data values when stacked mode is turned on there are multiple types of datasets', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'bar',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
type: 'bar',
|
|
|
|
data: [10, 5, 0, -5, 78, -100]
|
|
|
|
}, {
|
|
|
|
type: 'line',
|
|
|
|
data: [10, 10, 10, 10, 10, 10],
|
|
|
|
}, {
|
|
|
|
type: 'bar',
|
|
|
|
data: [150, 0, 0, -100, -10, 9]
|
|
|
|
}],
|
|
|
|
labels: ['a', 'b', 'c', 'd', 'e', 'f']
|
2016-01-09 15:51:04 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear',
|
|
|
|
stacked: true
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2016-01-09 15:51:04 +01:00
|
|
|
});
|
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance.scales.yScale0.determineDataLimits();
|
|
|
|
expect(chartInstance.scales.yScale0.min).toBe(-105);
|
|
|
|
expect(chartInstance.scales.yScale0.max).toBe(160);
|
2016-01-09 15:51:04 +01:00
|
|
|
});
|
|
|
|
|
2015-09-26 03:04:45 +02:00
|
|
|
it('Should ensure that the scale has a max and min that are not equal', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'bar',
|
|
|
|
data: {
|
|
|
|
datasets: [],
|
|
|
|
labels: ['a', 'b', 'c', 'd', 'e', 'f']
|
2015-11-13 15:38:35 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear'
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2015-09-26 03:04:45 +02:00
|
|
|
});
|
2015-09-25 04:08:25 +02:00
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
expect(chartInstance.scales.yScale0).not.toEqual(undefined); // must construct
|
|
|
|
expect(chartInstance.scales.yScale0.min).toBe(-1);
|
|
|
|
expect(chartInstance.scales.yScale0.max).toBe(1);
|
2015-09-26 03:04:45 +02:00
|
|
|
});
|
2015-09-25 04:08:25 +02:00
|
|
|
|
2015-10-31 16:40:51 +01:00
|
|
|
it('Should use the suggestedMin and suggestedMax options', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'bar',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [1, 1, 1, 2, 1, 0]
|
|
|
|
}],
|
|
|
|
labels: ['a', 'b', 'c', 'd', 'e', 'f']
|
2015-11-13 15:38:35 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear',
|
|
|
|
ticks: {
|
|
|
|
suggestedMax: 10,
|
|
|
|
suggestedMin: -10
|
|
|
|
}
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2015-10-31 16:40:51 +01:00
|
|
|
});
|
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
expect(chartInstance.scales.yScale0).not.toEqual(undefined); // must construct
|
|
|
|
expect(chartInstance.scales.yScale0.min).toBe(-10);
|
|
|
|
expect(chartInstance.scales.yScale0.max).toBe(10);
|
2015-10-31 16:40:51 +01:00
|
|
|
});
|
|
|
|
|
2015-12-14 08:39:11 +01:00
|
|
|
it('Should use the min and max options', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'bar',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [1, 1, 1, 2, 1, 0]
|
|
|
|
}],
|
|
|
|
labels: ['a', 'b', 'c', 'd', 'e', 'f']
|
2015-12-14 08:39:11 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear',
|
|
|
|
ticks: {
|
|
|
|
max: 1010,
|
|
|
|
min: -1010
|
|
|
|
}
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2015-12-14 08:39:11 +01:00
|
|
|
});
|
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
expect(chartInstance.scales.yScale0).not.toEqual(undefined); // must construct
|
|
|
|
expect(chartInstance.scales.yScale0.min).toBe(-1010);
|
|
|
|
expect(chartInstance.scales.yScale0.max).toBe(1010);
|
|
|
|
expect(chartInstance.scales.yScale0.ticks[0]).toBe('1010');
|
|
|
|
expect(chartInstance.scales.yScale0.ticks[chartInstance.scales.yScale0.ticks.length - 1]).toBe('-1010');
|
2015-12-14 08:39:11 +01:00
|
|
|
});
|
|
|
|
|
2015-09-26 03:04:45 +02:00
|
|
|
it('should forcibly include 0 in the range if the beginAtZero option is used', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'bar',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [20, 30, 40, 50]
|
|
|
|
}],
|
|
|
|
labels: ['a', 'b', 'c', 'd']
|
2015-11-13 15:38:35 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear',
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2015-08-23 23:17:46 +02:00
|
|
|
});
|
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
expect(chartInstance.scales.yScale0).not.toEqual(undefined); // must construct
|
|
|
|
expect(chartInstance.scales.yScale0.ticks).toEqual(['50', '45', '40', '35', '30', '25', '20']);
|
2015-09-26 03:04:45 +02:00
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance.scales.yScale0.options.ticks.beginAtZero = true;
|
|
|
|
chartInstance.update();
|
|
|
|
expect(chartInstance.scales.yScale0.ticks).toEqual(['50', '45', '40', '35', '30', '25', '20', '15', '10', '5', '0']);
|
2015-09-26 03:04:45 +02:00
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance.data.datasets[0].data = [-20, -30, -40, -50];
|
|
|
|
chartInstance.update();
|
|
|
|
expect(chartInstance.scales.yScale0.ticks).toEqual(['0', '-5', '-10', '-15', '-20', '-25', '-30', '-35', '-40', '-45', '-50']);
|
2015-09-26 03:04:45 +02:00
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance.scales.yScale0.options.ticks.beginAtZero = false;
|
|
|
|
chartInstance.update();
|
|
|
|
expect(chartInstance.scales.yScale0.ticks).toEqual(['-20', '-25', '-30', '-35', '-40', '-45', '-50']);
|
2015-09-26 03:04:45 +02:00
|
|
|
});
|
|
|
|
|
|
|
|
it('Should generate tick marks in the correct order in reversed mode', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'bar',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [10, 5, 0, 25, 78]
|
|
|
|
}],
|
|
|
|
labels: ['a', 'b', 'c', 'd']
|
2015-11-13 15:38:35 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear',
|
|
|
|
ticks: {
|
|
|
|
reverse: true
|
|
|
|
}
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2015-08-23 23:17:46 +02:00
|
|
|
});
|
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
expect(chartInstance.scales.yScale0.ticks).toEqual(['0', '10', '20', '30', '40', '50', '60', '70', '80']);
|
|
|
|
expect(chartInstance.scales.yScale0.start).toBe(80);
|
|
|
|
expect(chartInstance.scales.yScale0.end).toBe(0);
|
2015-09-26 03:04:45 +02:00
|
|
|
});
|
|
|
|
|
2015-10-24 04:00:59 +02:00
|
|
|
it('should use the correct number of decimal places in the default format function', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'bar',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [0.06, 0.005, 0, 0.025, 0.0078]
|
|
|
|
}],
|
|
|
|
labels: ['a', 'b', 'c', 'd']
|
2015-11-13 15:38:35 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear',
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2015-10-24 04:00:59 +02:00
|
|
|
});
|
2016-04-28 03:19:02 +02:00
|
|
|
expect(chartInstance.scales.yScale0.ticks).toEqual(['0.06', '0.05', '0.04', '0.03', '0.02', '0.01', '0']);
|
2015-10-24 04:00:59 +02:00
|
|
|
});
|
|
|
|
|
2015-09-26 03:04:45 +02:00
|
|
|
it('Should build labels using the user supplied callback', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'bar',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [10, 5, 0, 25, 78]
|
|
|
|
}],
|
|
|
|
labels: ['a', 'b', 'c', 'd']
|
2015-11-13 15:38:35 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear',
|
|
|
|
ticks: {
|
|
|
|
callback: function(value, index) {
|
|
|
|
return index.toString();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2015-09-01 02:42:29 +02:00
|
|
|
});
|
|
|
|
|
2015-09-26 03:04:45 +02:00
|
|
|
// Just the index
|
2016-04-28 03:19:02 +02:00
|
|
|
expect(chartInstance.scales.yScale0.ticks).toEqual(['0', '1', '2', '3', '4', '5', '6', '7', '8']);
|
2015-09-26 03:04:45 +02:00
|
|
|
});
|
|
|
|
|
|
|
|
it('Should get the correct pixel value for a point', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'line',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
xAxisID: 'xScale0',
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: []
|
|
|
|
}],
|
2015-11-13 15:38:35 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
xAxes: [{
|
|
|
|
id: 'xScale0',
|
|
|
|
type: 'linear',
|
|
|
|
position: 'bottom'
|
|
|
|
}],
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear'
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2015-09-01 02:42:29 +02:00
|
|
|
});
|
2016-04-28 03:19:02 +02:00
|
|
|
|
|
|
|
var xScale = chartInstance.scales.xScale0;
|
|
|
|
expect(xScale.getPixelForValue(1, 0, 0)).toBeCloseToPixel(501); // right - paddingRight
|
|
|
|
expect(xScale.getPixelForValue(-1, 0, 0)).toBeCloseToPixel(41); // left + paddingLeft
|
|
|
|
expect(xScale.getPixelForValue(0, 0, 0)).toBeCloseToPixel(271); // halfway*/
|
|
|
|
|
|
|
|
var yScale = chartInstance.scales.yScale0;
|
|
|
|
expect(yScale.getPixelForValue(1, 0, 0)).toBeCloseToPixel(32); // top + paddingTop
|
|
|
|
expect(yScale.getPixelForValue(-1, 0, 0)).toBeCloseToPixel(484); // bottom - paddingBottom
|
|
|
|
expect(yScale.getPixelForValue(0, 0, 0)).toBeCloseToPixel(258); // halfway
|
2015-09-26 03:04:45 +02:00
|
|
|
});
|
|
|
|
|
|
|
|
it('should fit correctly', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'line',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
xAxisID: 'xScale0',
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [{
|
|
|
|
x: 10,
|
|
|
|
y: 100
|
|
|
|
}, {
|
|
|
|
x: -10,
|
|
|
|
y: 0
|
|
|
|
}, {
|
|
|
|
x: 0,
|
|
|
|
y: 0
|
|
|
|
}, {
|
|
|
|
x: 99,
|
|
|
|
y: 7
|
|
|
|
}]
|
|
|
|
}],
|
2015-11-13 15:38:35 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
xAxes: [{
|
|
|
|
id: 'xScale0',
|
|
|
|
type: 'linear',
|
|
|
|
position: 'bottom'
|
|
|
|
}],
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear'
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2015-09-01 02:42:29 +02:00
|
|
|
});
|
2015-09-21 01:41:48 +02:00
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
var xScale = chartInstance.scales.xScale0;
|
|
|
|
expect(xScale.paddingTop).toBe(0);
|
|
|
|
expect(xScale.paddingBottom).toBe(0);
|
|
|
|
expect(xScale.paddingLeft).toBe(0);
|
|
|
|
expect(xScale.paddingRight).toBe(13.5);
|
|
|
|
expect(xScale.width).toBeCloseToPixel(471);
|
|
|
|
expect(xScale.height).toBeCloseToPixel(28);
|
|
|
|
|
|
|
|
var yScale = chartInstance.scales.yScale0;
|
|
|
|
expect(yScale.paddingTop).toBe(0);
|
|
|
|
expect(yScale.paddingBottom).toBe(0);
|
|
|
|
expect(yScale.paddingLeft).toBe(0);
|
|
|
|
expect(yScale.paddingRight).toBe(0);
|
|
|
|
expect(yScale.width).toBeCloseToPixel(41);
|
|
|
|
expect(yScale.height).toBeCloseToPixel(452);
|
2015-09-26 03:04:45 +02:00
|
|
|
|
|
|
|
// Extra size when scale label showing
|
2016-04-28 03:19:02 +02:00
|
|
|
xScale.options.scaleLabel.display = true;
|
|
|
|
yScale.options.scaleLabel.display = true;
|
|
|
|
chartInstance.update();
|
|
|
|
|
|
|
|
expect(xScale.paddingTop).toBe(0);
|
|
|
|
expect(xScale.paddingBottom).toBe(0);
|
|
|
|
expect(xScale.paddingLeft).toBe(0);
|
|
|
|
expect(xScale.paddingRight).toBe(13.5);
|
|
|
|
expect(xScale.width).toBeCloseToPixel(453);
|
|
|
|
expect(xScale.height).toBeCloseToPixel(46);
|
|
|
|
|
|
|
|
expect(yScale.paddingTop).toBe(0);
|
|
|
|
expect(yScale.paddingBottom).toBe(0);
|
|
|
|
expect(yScale.paddingLeft).toBe(0);
|
|
|
|
expect(yScale.paddingRight).toBe(0);
|
|
|
|
expect(yScale.width).toBeCloseToPixel(59);
|
|
|
|
expect(yScale.height).toBeCloseToPixel(434);
|
2015-09-26 03:04:45 +02:00
|
|
|
});
|
|
|
|
|
2015-10-17 05:14:07 +02:00
|
|
|
it('Should draw correctly horizontally', function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'line',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
xAxisID: 'xScale0',
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [{
|
|
|
|
x: 10,
|
|
|
|
y: -5
|
|
|
|
}, {
|
|
|
|
x: -10,
|
|
|
|
y: 0
|
|
|
|
}, {
|
|
|
|
x: 0,
|
|
|
|
y: 2
|
|
|
|
}, {
|
|
|
|
x: 99,
|
|
|
|
y: -3
|
|
|
|
}]
|
|
|
|
}],
|
2015-11-13 15:38:35 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
xAxes: [{
|
|
|
|
id: 'xScale0',
|
|
|
|
type: 'linear',
|
|
|
|
position: 'bottom'
|
|
|
|
}],
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear'
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2015-09-26 03:04:45 +02:00
|
|
|
});
|
2015-09-21 01:41:48 +02:00
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
var xScale = chartInstance.scales.xScale0;
|
|
|
|
var mockContext = window.createMockContext();
|
|
|
|
xScale.ctx = mockContext;
|
2015-09-21 01:41:48 +02:00
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance.draw();
|
2015-09-26 03:04:45 +02:00
|
|
|
|
|
|
|
var expected = [{
|
|
|
|
"name": "setFillStyle",
|
|
|
|
"args": ["#666"]
|
|
|
|
}, {
|
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
|
|
|
}, {
|
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0, 0, 0, 0.1)"]
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31.5, 484]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31.5, 494]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31.5, 32]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31.5, 484]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "save",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "translate",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 494]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": ["-20", 0, 0]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
|
|
|
}, {
|
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0,0,0,0.25)"]
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [109.5, 484]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [109.5, 494]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [109.5, 32]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [109.5, 484]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "save",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "translate",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [109, 494]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
|
|
|
"args": ["0", 0, 0]
|
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
|
|
|
}, {
|
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0, 0, 0, 0.1)"]
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [187.5, 484]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [187.5, 494]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [187.5, 32]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [187.5, 484]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "save",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "translate",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [187, 494]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": ["20", 0, 0]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
2016-01-19 03:35:35 +01:00
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [265.5, 484]
|
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
|
|
|
"args": [265.5, 494]
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
|
|
|
"args": [265.5, 32]
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [265.5, 484]
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "save",
|
|
|
|
"args": []
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "translate",
|
|
|
|
"args": [265, 494]
|
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
|
|
|
"args": ["40", 0, 0]
|
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
2016-04-28 03:19:02 +02:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
|
|
|
"args": [343.5, 484]
|
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
|
|
|
"args": [343.5, 494]
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
|
|
|
"args": [343.5, 32]
|
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
|
|
|
"args": [343.5, 484]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "save",
|
|
|
|
"args": []
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "translate",
|
|
|
|
"args": [343, 494]
|
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
|
|
|
"args": ["60", 0, 0]
|
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
2016-04-28 03:19:02 +02:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
|
|
|
"args": [421.5, 484]
|
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
|
|
|
"args": [421.5, 494]
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
|
|
|
"args": [421.5, 32]
|
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
|
|
|
"args": [421.5, 484]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "save",
|
|
|
|
"args": []
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "translate",
|
|
|
|
"args": [421, 494]
|
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
|
|
|
"args": ["80", 0, 0]
|
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
2016-04-28 03:19:02 +02:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
|
|
|
"args": [499.5, 484]
|
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
|
|
|
"args": [499.5, 494]
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
|
|
|
"args": [499.5, 32]
|
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
|
|
|
"args": [499.5, 484]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
2015-10-19 01:57:06 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "save",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "translate",
|
|
|
|
"args": [499, 494]
|
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": ["100", 0, 0]
|
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
|
|
|
}, {
|
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0, 0, 0, 0.1)"]
|
2016-01-19 03:35:35 +01:00
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 484.5]
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [512, 484.5]
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
2016-04-28 03:19:02 +02:00
|
|
|
}];
|
|
|
|
expect(mockContext.getCalls()).toEqual(expected);
|
2015-09-26 03:04:45 +02:00
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
// Turn off some drawing
|
|
|
|
xScale.options.gridLines.drawTicks = false;
|
|
|
|
xScale.options.gridLines.drawOnChartArea = false;
|
|
|
|
xScale.options.ticks.display = false;
|
|
|
|
xScale.options.scaleLabel.display = true;
|
|
|
|
xScale.options.scaleLabel.labelString = 'myLabel';
|
2015-09-26 03:04:45 +02:00
|
|
|
|
|
|
|
mockContext.resetCalls();
|
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance.draw();
|
2015-09-26 03:04:45 +02:00
|
|
|
expect(mockContext.getCalls()).toEqual([{
|
|
|
|
"name": "setFillStyle",
|
|
|
|
"args": ["#666"]
|
|
|
|
}, {
|
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
|
|
|
}, {
|
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0, 0, 0, 0.1)"]
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0,0,0,0.25)"]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "beginPath",
|
2015-09-26 03:04:45 +02:00
|
|
|
"args": []
|
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "stroke",
|
2015-09-26 03:04:45 +02:00
|
|
|
"args": []
|
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0, 0, 0, 0.1)"]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "stroke",
|
2015-09-26 03:04:45 +02:00
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "beginPath",
|
2015-09-26 03:04:45 +02:00
|
|
|
"args": []
|
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "setFillStyle",
|
|
|
|
"args": ["#666"]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": ["myLabel", 271.5, 506]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
|
|
|
}, {
|
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0, 0, 0, 0.1)"]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 484.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [512, 484.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
2016-04-28 03:19:02 +02:00
|
|
|
}]);
|
|
|
|
|
|
|
|
// Turn off display
|
|
|
|
|
|
|
|
mockContext.resetCalls();
|
|
|
|
xScale.options.display = false;
|
|
|
|
chartInstance.draw();
|
|
|
|
expect(mockContext.getCalls()).toEqual([]);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('Should draw correctly vertically', function() {
|
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'line',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
xAxisID: 'xScale0',
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [{
|
|
|
|
x: 10,
|
|
|
|
y: -5
|
|
|
|
}, {
|
|
|
|
x: -10,
|
|
|
|
y: 0
|
|
|
|
}, {
|
|
|
|
x: 0,
|
|
|
|
y: 2
|
|
|
|
}, {
|
|
|
|
x: 99,
|
|
|
|
y: -3
|
|
|
|
}]
|
|
|
|
}],
|
|
|
|
},
|
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
xAxes: [{
|
|
|
|
id: 'xScale0',
|
|
|
|
type: 'linear',
|
|
|
|
position: 'bottom'
|
|
|
|
}],
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear'
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
var yScale = chartInstance.scales.yScale0;
|
|
|
|
var mockContext = window.createMockContext();
|
|
|
|
yScale.ctx = mockContext;
|
|
|
|
|
|
|
|
chartInstance.draw();
|
|
|
|
|
|
|
|
expect(mockContext.getCalls()).toEqual([{
|
|
|
|
"name": "setFillStyle",
|
|
|
|
"args": ["#666"]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
2016-04-28 03:19:02 +02:00
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0, 0, 0, 0.1)"]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [26, 32.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 32.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 32.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [512, 32.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "save",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "translate",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [21, 32]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
|
|
|
"args": ["2", 0, 0]
|
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [26, 97.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 97.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 97.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [512, 97.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "save",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "translate",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [21, 97]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
|
|
|
"args": ["1", 0, 0]
|
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
|
|
|
}, {
|
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0,0,0,0.25)"]
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [26, 161.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 161.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 161.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [512, 161.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "save",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "translate",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [21, 161]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
|
|
|
"args": ["0", 0, 0]
|
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
|
|
|
}, {
|
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0, 0, 0, 0.1)"]
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [26, 226.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 226.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 226.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [512, 226.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "save",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "translate",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [21, 226]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
|
|
|
"args": ["-1", 0, 0]
|
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [26, 290.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 290.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 290.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [512, 290.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "save",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "translate",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [21, 290]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
|
|
|
"args": ["-2", 0, 0]
|
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [26, 355.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 355.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 355.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [512, 355.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "save",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "translate",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [21, 355]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
|
|
|
"args": ["-3", 0, 0]
|
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [26, 419.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 419.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 419.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [512, 419.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "save",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "translate",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [21, 419]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
|
|
|
"args": ["-4", 0, 0]
|
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [26, 484.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 484.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 484.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [512, 484.5]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "save",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "translate",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [21, 484]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
|
|
|
"args": ["-5", 0, 0]
|
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
|
|
|
}, {
|
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0, 0, 0, 0.1)"]
|
2016-01-19 03:35:35 +01:00
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31.5, 32]
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31.5, 484]
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
2015-09-26 03:04:45 +02:00
|
|
|
}]);
|
|
|
|
|
|
|
|
// Turn off some drawing
|
2016-04-28 03:19:02 +02:00
|
|
|
yScale.options.gridLines.drawTicks = false;
|
|
|
|
yScale.options.gridLines.drawOnChartArea = false;
|
|
|
|
yScale.options.ticks.display = false;
|
|
|
|
yScale.options.scaleLabel.display = true;
|
2015-09-26 03:04:45 +02:00
|
|
|
|
|
|
|
mockContext.resetCalls();
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance.draw();
|
2015-09-26 03:04:45 +02:00
|
|
|
|
|
|
|
expect(mockContext.getCalls()).toEqual([{
|
|
|
|
"name": "setFillStyle",
|
|
|
|
"args": ["#666"]
|
|
|
|
}, {
|
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
|
|
|
}, {
|
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0, 0, 0, 0.1)"]
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
|
|
|
}, {
|
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0,0,0,0.25)"]
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
|
|
|
}, {
|
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0, 0, 0, 0.1)"]
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "save",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "translate",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [6, 258]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-1.5707963267948966]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
2015-10-21 02:12:56 +02:00
|
|
|
"name": "setFillStyle",
|
|
|
|
"args": ["#666"]
|
2015-09-26 03:04:45 +02:00
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
|
|
|
"args": ["", 0, 0]
|
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
|
|
|
}, {
|
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0, 0, 0, 0.1)"]
|
2016-01-19 03:35:35 +01:00
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31.5, 32]
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31.5, 484]
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
2015-09-26 03:04:45 +02:00
|
|
|
}]);
|
|
|
|
});
|
2015-11-12 03:49:07 +01:00
|
|
|
|
|
|
|
it("should not draw lines where the callback function returned null or undefined", function() {
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance = window.acquireChart({
|
|
|
|
type: 'line',
|
|
|
|
data: {
|
|
|
|
datasets: [{
|
|
|
|
xAxisID: 'xScale0',
|
|
|
|
yAxisID: 'yScale0',
|
|
|
|
data: [{
|
|
|
|
x: 10,
|
|
|
|
y: -5
|
|
|
|
}, {
|
|
|
|
x: -10,
|
|
|
|
y: 0
|
|
|
|
}, {
|
|
|
|
x: 0,
|
|
|
|
y: 2
|
|
|
|
}, {
|
|
|
|
x: 99,
|
|
|
|
y: -3
|
|
|
|
}]
|
|
|
|
}],
|
2015-11-18 00:38:19 +01:00
|
|
|
},
|
2016-04-28 03:19:02 +02:00
|
|
|
options: {
|
|
|
|
scales: {
|
|
|
|
xAxes: [{
|
|
|
|
id: 'xScale0',
|
|
|
|
type: 'linear',
|
|
|
|
position: 'bottom'
|
|
|
|
}],
|
|
|
|
yAxes: [{
|
|
|
|
id: 'yScale0',
|
|
|
|
type: 'linear',
|
|
|
|
ticks: {
|
|
|
|
callback: function(tickValue, index) {
|
|
|
|
return index % 2 === 0 ? null : tickValue.toString();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
}
|
2015-11-12 03:49:07 +01:00
|
|
|
});
|
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
var yScale = chartInstance.scales.yScale0;
|
|
|
|
var mockContext = window.createMockContext();
|
|
|
|
yScale.ctx = mockContext;
|
2015-11-12 03:49:07 +01:00
|
|
|
|
2016-04-28 03:19:02 +02:00
|
|
|
chartInstance.draw();
|
2015-11-12 03:49:07 +01:00
|
|
|
|
|
|
|
expect(mockContext.getCalls()).toEqual([{
|
|
|
|
"name": "setFillStyle",
|
|
|
|
"args": ["#666"]
|
|
|
|
}, {
|
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
|
|
|
}, {
|
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0, 0, 0, 0.1)"]
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [26, 97.5]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 97.5]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 97.5]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [512, 97.5]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "save",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "translate",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [21, 97]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": ["1", 0, 0]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [26, 226.5]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 226.5]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 226.5]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [512, 226.5]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "save",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "translate",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [21, 226]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": ["-1", 0, 0]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [26, 355.5]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 355.5]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 355.5]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [512, 355.5]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "save",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "translate",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [21, 355]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": ["-3", 0, 0]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [26, 484.5]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 484.5]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31, 484.5]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [512, 484.5]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "save",
|
|
|
|
"args": []
|
|
|
|
}, {
|
|
|
|
"name": "translate",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [21, 484]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "rotate",
|
|
|
|
"args": [-0]
|
|
|
|
}, {
|
|
|
|
"name": "fillText",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": ["-5", 0, 0]
|
2015-11-12 03:49:07 +01:00
|
|
|
}, {
|
|
|
|
"name": "restore",
|
|
|
|
"args": []
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "setLineWidth",
|
|
|
|
"args": [1]
|
|
|
|
}, {
|
|
|
|
"name": "setStrokeStyle",
|
|
|
|
"args": ["rgba(0, 0, 0, 0.1)"]
|
2016-01-19 03:35:35 +01:00
|
|
|
}, {
|
|
|
|
"name": "beginPath",
|
|
|
|
"args": []
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "moveTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31.5, 32]
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "lineTo",
|
2016-04-28 03:19:02 +02:00
|
|
|
"args": [31.5, 484]
|
2015-12-28 15:26:59 +01:00
|
|
|
}, {
|
|
|
|
"name": "stroke",
|
|
|
|
"args": []
|
2015-11-12 03:49:07 +01:00
|
|
|
}])
|
|
|
|
});
|
2016-04-17 00:38:03 +02:00
|
|
|
});
|