123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423 |
- // Tests for the radial linear scale used by the polar area and radar charts
- describe('Test the radial linear scale', function() {
- var chartInstance;
- beforeEach(function() {
- window.addDefaultMatchers(jasmine);
- });
- afterEach(function() {
- if (chartInstance) {
- releaseChart(chartInstance);
- }
- });
- it('Should register the constructor with the scale service', function() {
- var Constructor = Chart.scaleService.getScaleConstructor('radialLinear');
- expect(Constructor).not.toBe(undefined);
- expect(typeof Constructor).toBe('function');
- });
- it('Should have the correct default config', function() {
- var defaultConfig = Chart.scaleService.getScaleDefaults('radialLinear');
- expect(defaultConfig).toEqual({
- angleLines: {
- display: true,
- color: "rgba(0, 0, 0, 0.1)",
- lineWidth: 1
- },
- animate: true,
- display: true,
- gridLines: {
- color: "rgba(0, 0, 0, 0.1)",
- drawBorder: true,
- drawOnChartArea: true,
- drawTicks: true,
- tickMarkLength: 10,
- lineWidth: 1,
- offsetGridLines: false,
- display: true,
- zeroLineColor: "rgba(0,0,0,0.25)",
- zeroLineWidth: 1,
- },
- lineArc: false,
- pointLabels: {
- fontSize: 10,
- callback: defaultConfig.pointLabels.callback, // make this nicer, then check explicitly below
- },
- position: "chartArea",
- scaleLabel: {
- labelString: '',
- display: false,
- },
- ticks: {
- backdropColor: "rgba(255,255,255,0.75)",
- backdropPaddingY: 2,
- backdropPaddingX: 2,
- beginAtZero: false,
- minRotation: 0,
- maxRotation: 50,
- mirror: false,
- padding: 10,
- reverse: false,
- showLabelBackdrop: true,
- display: true,
- callback: defaultConfig.ticks.callback, // make this nicer, then check explicitly below
- autoSkip: true,
- autoSkipPadding: 0,
- labelOffset: 0
- },
- });
- // Is this actually a function
- expect(defaultConfig.ticks.callback).toEqual(jasmine.any(Function));
- expect(defaultConfig.pointLabels.callback).toEqual(jasmine.any(Function));
- });
- it('Should correctly determine the max & min data values', function() {
- chartInstance = window.acquireChart({
- type: 'radar',
- data: {
- datasets: [{
- data: [10, 5, 0, -5, 78, -100]
- }, {
- data: [150]
- }],
- labels: ['lablel1', 'label2', 'label3', 'label4', 'label5', 'label6']
- },
- options: {
- scales: {
- }
- }
- });
- expect(chartInstance.scale.min).toBe(-100);
- expect(chartInstance.scale.max).toBe(150);
- });
- it('Should correctly determine the max & min of string data values', function() {
- chartInstance = window.acquireChart({
- type: 'radar',
- data: {
- datasets: [{
- data: ['10', '5', '0', '-5', '78', '-100']
- }, {
- data: ['150']
- }],
- labels: ['lablel1', 'label2', 'label3', 'label4', 'label5', 'label6']
- },
- options: {
- scales: {
- }
- }
- });
- expect(chartInstance.scale.min).toBe(-100);
- expect(chartInstance.scale.max).toBe(150);
- });
- it('Should correctly determine the max & min data values when there are hidden datasets', function() {
- chartInstance = window.acquireChart({
- type: 'radar',
- data: {
- datasets: [{
- data: ['10', '5', '0', '-5', '78', '-100']
- }, {
- data: ['150']
- }, {
- data: [1000],
- hidden: true
- }],
- labels: ['lablel1', 'label2', 'label3', 'label4', 'label5', 'label6']
- },
- options: {
- scales: {
- }
- }
- });
- expect(chartInstance.scale.min).toBe(-100);
- expect(chartInstance.scale.max).toBe(150);
- });
- it('Should correctly determine the max & min data values when there is NaN data', function() {
- chartInstance = window.acquireChart({
- type: 'radar',
- data: {
- datasets: [{
- data: [50, 60, NaN, 70, null, undefined]
- }],
- labels: ['lablel1', 'label2', 'label3', 'label4', 'label5', 'label6']
- },
- options: {
- scales: {
- }
- }
- });
- expect(chartInstance.scale.min).toBe(50);
- expect(chartInstance.scale.max).toBe(70);
- });
- it('Should ensure that the scale has a max and min that are not equal', function() {
- var scaleID = 'myScale';
- var mockData = {
- datasets: [],
- labels: []
- };
- var mockContext = window.createMockContext();
- var Constructor = Chart.scaleService.getScaleConstructor('radialLinear');
- var scale = new Constructor({
- ctx: mockContext,
- options: Chart.scaleService.getScaleDefaults('radialLinear'), // use default config for scale
- chart: {
- data: mockData
- },
- id: scaleID,
- });
- scale.update(200, 300);
- expect(scale.min).toBe(-1);
- expect(scale.max).toBe(1);
- });
- it('Should use the suggestedMin and suggestedMax options', function() {
- chartInstance = window.acquireChart({
- type: 'radar',
- data: {
- datasets: [{
- data: [1, 1, 1, 2, 1, 0]
- }],
- labels: ['lablel1', 'label2', 'label3', 'label4', 'label5', 'label6']
- },
- options: {
- scale: {
- ticks: {
- suggestedMin: -10,
- suggestedMax: 10
- }
- }
- }
- });
- expect(chartInstance.scale.min).toBe(-10);
- expect(chartInstance.scale.max).toBe(10);
- });
- it('Should use the min and max options', function() {
- chartInstance = window.acquireChart({
- type: 'radar',
- data: {
- datasets: [{
- data: [1, 1, 1, 2, 1, 0]
- }],
- labels: ['lablel1', 'label2', 'label3', 'label4', 'label5', 'label6']
- },
- options: {
- scale: {
- ticks: {
- min: -1010,
- max: 1010
- }
- }
- }
- });
- expect(chartInstance.scale.min).toBe(-1010);
- expect(chartInstance.scale.max).toBe(1010);
- expect(chartInstance.scale.ticks).toEqual(['-1010', '-1000', '-500', '0', '500', '1000', '1010']);
- });
- it('should forcibly include 0 in the range if the beginAtZero option is used', function() {
- chartInstance = window.acquireChart({
- type: 'radar',
- data: {
- datasets: [{
- data: [20, 30, 40, 50]
- }],
- labels: ['lablel1', 'label2', 'label3', 'label4']
- },
- options: {
- scale: {
- ticks: {
- beginAtZero: false
- }
- }
- }
- });
- expect(chartInstance.scale.ticks).toEqual(['20', '25', '30', '35', '40', '45', '50']);
- chartInstance.scale.options.ticks.beginAtZero = true;
- chartInstance.update();
- expect(chartInstance.scale.ticks).toEqual(['0', '5', '10', '15', '20', '25', '30', '35', '40', '45', '50']);
- chartInstance.data.datasets[0].data = [-20, -30, -40, -50];
- chartInstance.update();
- expect(chartInstance.scale.ticks).toEqual(['-50', '-45', '-40', '-35', '-30', '-25', '-20', '-15', '-10', '-5', '0']);
- chartInstance.scale.options.ticks.beginAtZero = false;
- chartInstance.update();
- expect(chartInstance.scale.ticks).toEqual(['-50', '-45', '-40', '-35', '-30', '-25', '-20']);
- });
- it('Should generate tick marks in the correct order in reversed mode', function() {
- chartInstance = window.acquireChart({
- type: 'radar',
- data: {
- datasets: [{
- data: [10, 5, 0, 25, 78]
- }],
- labels: ['lablel1', 'label2', 'label3', 'label4', 'label5']
- },
- options: {
- scale: {
- ticks: {
- reverse: true
- }
- }
- }
- });
- expect(chartInstance.scale.ticks).toEqual(['80', '70', '60', '50', '40', '30', '20', '10', '0']);
- expect(chartInstance.scale.start).toBe(80);
- expect(chartInstance.scale.end).toBe(0);
- });
- it('Should build labels using the user supplied callback', function() {
- chartInstance = window.acquireChart({
- type: 'radar',
- data: {
- datasets: [{
- data: [10, 5, 0, 25, 78]
- }],
- labels: ['label1', 'label2', 'label3', 'label4', 'label5']
- },
- options: {
- scale: {
- ticks: {
- callback: function(value, index) {
- return index.toString();
- }
- }
- }
- }
- });
- expect(chartInstance.scale.ticks).toEqual(['0', '1', '2', '3', '4', '5', '6', '7', '8']);
- expect(chartInstance.scale.pointLabels).toEqual(['label1', 'label2', 'label3', 'label4', 'label5']);
- });
- it('Should build point labels using the user supplied callback', function() {
- chartInstance = window.acquireChart({
- type: 'radar',
- data: {
- datasets: [{
- data: [10, 5, 0, 25, 78]
- }],
- labels: ['label1', 'label2', 'label3', 'label4', 'label5']
- },
- options: {
- scale: {
- pointLabels: {
- callback: function(value, index) {
- return index.toString();
- }
- }
- }
- }
- });
- expect(chartInstance.scale.pointLabels).toEqual(['0', '1', '2', '3', '4']);
- });
- it('should correctly set the center point', function() {
- chartInstance = window.acquireChart({
- type: 'radar',
- data: {
- datasets: [{
- data: [10, 5, 0, 25, 78]
- }],
- labels: ['label1', 'label2', 'label3', 'label4', 'label5']
- },
- options: {
- scale: {
- pointLabels: {
- callback: function(value, index) {
- return index.toString();
- }
- }
- }
- }
- });
- expect(chartInstance.scale.drawingArea).toBe(225);
- expect(chartInstance.scale.xCenter).toBe(256);
- expect(chartInstance.scale.yCenter).toBe(272);
- });
- it('should correctly get the label for a given data index', function() {
- chartInstance = window.acquireChart({
- type: 'radar',
- data: {
- datasets: [{
- data: [10, 5, 0, 25, 78]
- }],
- labels: ['label1', 'label2', 'label3', 'label4', 'label5']
- },
- options: {
- scale: {
- pointLabels: {
- callback: function(value, index) {
- return index.toString();
- }
- }
- }
- }
- });
- expect(chartInstance.scale.getLabelForIndex(1, 0)).toBe(5);
- });
- it('should get the correct distance from the center point', function() {
- chartInstance = window.acquireChart({
- type: 'radar',
- data: {
- datasets: [{
- data: [10, 5, 0, 25, 78]
- }],
- labels: ['label1', 'label2', 'label3', 'label4', 'label5']
- },
- options: {
- scale: {
- pointLabels: {
- callback: function(value, index) {
- return index.toString();
- }
- }
- }
- }
- });
- expect(chartInstance.scale.getDistanceFromCenterForValue(chartInstance.scale.min)).toBe(0);
- expect(chartInstance.scale.getDistanceFromCenterForValue(chartInstance.scale.max)).toBe(225);
- expect(chartInstance.scale.getPointPositionForValue(1, 5)).toEqual({
- x: 269,
- y: 268,
- });
- chartInstance.scale.options.reverse = true;
- chartInstance.update();
- expect(chartInstance.scale.getDistanceFromCenterForValue(chartInstance.scale.min)).toBe(225);
- expect(chartInstance.scale.getDistanceFromCenterForValue(chartInstance.scale.max)).toBe(0);
- });
- });
|