You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

424 lines
10KB

  1. // Tests for the radial linear scale used by the polar area and radar charts
  2. describe('Test the radial linear scale', function() {
  3. var chartInstance;
  4. beforeEach(function() {
  5. window.addDefaultMatchers(jasmine);
  6. });
  7. afterEach(function() {
  8. if (chartInstance) {
  9. releaseChart(chartInstance);
  10. }
  11. });
  12. it('Should register the constructor with the scale service', function() {
  13. var Constructor = Chart.scaleService.getScaleConstructor('radialLinear');
  14. expect(Constructor).not.toBe(undefined);
  15. expect(typeof Constructor).toBe('function');
  16. });
  17. it('Should have the correct default config', function() {
  18. var defaultConfig = Chart.scaleService.getScaleDefaults('radialLinear');
  19. expect(defaultConfig).toEqual({
  20. angleLines: {
  21. display: true,
  22. color: "rgba(0, 0, 0, 0.1)",
  23. lineWidth: 1
  24. },
  25. animate: true,
  26. display: true,
  27. gridLines: {
  28. color: "rgba(0, 0, 0, 0.1)",
  29. drawBorder: true,
  30. drawOnChartArea: true,
  31. drawTicks: true,
  32. tickMarkLength: 10,
  33. lineWidth: 1,
  34. offsetGridLines: false,
  35. display: true,
  36. zeroLineColor: "rgba(0,0,0,0.25)",
  37. zeroLineWidth: 1,
  38. },
  39. lineArc: false,
  40. pointLabels: {
  41. fontSize: 10,
  42. callback: defaultConfig.pointLabels.callback, // make this nicer, then check explicitly below
  43. },
  44. position: "chartArea",
  45. scaleLabel: {
  46. labelString: '',
  47. display: false,
  48. },
  49. ticks: {
  50. backdropColor: "rgba(255,255,255,0.75)",
  51. backdropPaddingY: 2,
  52. backdropPaddingX: 2,
  53. beginAtZero: false,
  54. minRotation: 0,
  55. maxRotation: 50,
  56. mirror: false,
  57. padding: 10,
  58. reverse: false,
  59. showLabelBackdrop: true,
  60. display: true,
  61. callback: defaultConfig.ticks.callback, // make this nicer, then check explicitly below
  62. autoSkip: true,
  63. autoSkipPadding: 0,
  64. labelOffset: 0
  65. },
  66. });
  67. // Is this actually a function
  68. expect(defaultConfig.ticks.callback).toEqual(jasmine.any(Function));
  69. expect(defaultConfig.pointLabels.callback).toEqual(jasmine.any(Function));
  70. });
  71. it('Should correctly determine the max & min data values', function() {
  72. chartInstance = window.acquireChart({
  73. type: 'radar',
  74. data: {
  75. datasets: [{
  76. data: [10, 5, 0, -5, 78, -100]
  77. }, {
  78. data: [150]
  79. }],
  80. labels: ['lablel1', 'label2', 'label3', 'label4', 'label5', 'label6']
  81. },
  82. options: {
  83. scales: {
  84. }
  85. }
  86. });
  87. expect(chartInstance.scale.min).toBe(-100);
  88. expect(chartInstance.scale.max).toBe(150);
  89. });
  90. it('Should correctly determine the max & min of string data values', function() {
  91. chartInstance = window.acquireChart({
  92. type: 'radar',
  93. data: {
  94. datasets: [{
  95. data: ['10', '5', '0', '-5', '78', '-100']
  96. }, {
  97. data: ['150']
  98. }],
  99. labels: ['lablel1', 'label2', 'label3', 'label4', 'label5', 'label6']
  100. },
  101. options: {
  102. scales: {
  103. }
  104. }
  105. });
  106. expect(chartInstance.scale.min).toBe(-100);
  107. expect(chartInstance.scale.max).toBe(150);
  108. });
  109. it('Should correctly determine the max & min data values when there are hidden datasets', function() {
  110. chartInstance = window.acquireChart({
  111. type: 'radar',
  112. data: {
  113. datasets: [{
  114. data: ['10', '5', '0', '-5', '78', '-100']
  115. }, {
  116. data: ['150']
  117. }, {
  118. data: [1000],
  119. hidden: true
  120. }],
  121. labels: ['lablel1', 'label2', 'label3', 'label4', 'label5', 'label6']
  122. },
  123. options: {
  124. scales: {
  125. }
  126. }
  127. });
  128. expect(chartInstance.scale.min).toBe(-100);
  129. expect(chartInstance.scale.max).toBe(150);
  130. });
  131. it('Should correctly determine the max & min data values when there is NaN data', function() {
  132. chartInstance = window.acquireChart({
  133. type: 'radar',
  134. data: {
  135. datasets: [{
  136. data: [50, 60, NaN, 70, null, undefined]
  137. }],
  138. labels: ['lablel1', 'label2', 'label3', 'label4', 'label5', 'label6']
  139. },
  140. options: {
  141. scales: {
  142. }
  143. }
  144. });
  145. expect(chartInstance.scale.min).toBe(50);
  146. expect(chartInstance.scale.max).toBe(70);
  147. });
  148. it('Should ensure that the scale has a max and min that are not equal', function() {
  149. var scaleID = 'myScale';
  150. var mockData = {
  151. datasets: [],
  152. labels: []
  153. };
  154. var mockContext = window.createMockContext();
  155. var Constructor = Chart.scaleService.getScaleConstructor('radialLinear');
  156. var scale = new Constructor({
  157. ctx: mockContext,
  158. options: Chart.scaleService.getScaleDefaults('radialLinear'), // use default config for scale
  159. chart: {
  160. data: mockData
  161. },
  162. id: scaleID,
  163. });
  164. scale.update(200, 300);
  165. expect(scale.min).toBe(-1);
  166. expect(scale.max).toBe(1);
  167. });
  168. it('Should use the suggestedMin and suggestedMax options', function() {
  169. chartInstance = window.acquireChart({
  170. type: 'radar',
  171. data: {
  172. datasets: [{
  173. data: [1, 1, 1, 2, 1, 0]
  174. }],
  175. labels: ['lablel1', 'label2', 'label3', 'label4', 'label5', 'label6']
  176. },
  177. options: {
  178. scale: {
  179. ticks: {
  180. suggestedMin: -10,
  181. suggestedMax: 10
  182. }
  183. }
  184. }
  185. });
  186. expect(chartInstance.scale.min).toBe(-10);
  187. expect(chartInstance.scale.max).toBe(10);
  188. });
  189. it('Should use the min and max options', function() {
  190. chartInstance = window.acquireChart({
  191. type: 'radar',
  192. data: {
  193. datasets: [{
  194. data: [1, 1, 1, 2, 1, 0]
  195. }],
  196. labels: ['lablel1', 'label2', 'label3', 'label4', 'label5', 'label6']
  197. },
  198. options: {
  199. scale: {
  200. ticks: {
  201. min: -1010,
  202. max: 1010
  203. }
  204. }
  205. }
  206. });
  207. expect(chartInstance.scale.min).toBe(-1010);
  208. expect(chartInstance.scale.max).toBe(1010);
  209. expect(chartInstance.scale.ticks).toEqual(['-1010', '-1000', '-500', '0', '500', '1000', '1010']);
  210. });
  211. it('should forcibly include 0 in the range if the beginAtZero option is used', function() {
  212. chartInstance = window.acquireChart({
  213. type: 'radar',
  214. data: {
  215. datasets: [{
  216. data: [20, 30, 40, 50]
  217. }],
  218. labels: ['lablel1', 'label2', 'label3', 'label4']
  219. },
  220. options: {
  221. scale: {
  222. ticks: {
  223. beginAtZero: false
  224. }
  225. }
  226. }
  227. });
  228. expect(chartInstance.scale.ticks).toEqual(['20', '25', '30', '35', '40', '45', '50']);
  229. chartInstance.scale.options.ticks.beginAtZero = true;
  230. chartInstance.update();
  231. expect(chartInstance.scale.ticks).toEqual(['0', '5', '10', '15', '20', '25', '30', '35', '40', '45', '50']);
  232. chartInstance.data.datasets[0].data = [-20, -30, -40, -50];
  233. chartInstance.update();
  234. expect(chartInstance.scale.ticks).toEqual(['-50', '-45', '-40', '-35', '-30', '-25', '-20', '-15', '-10', '-5', '0']);
  235. chartInstance.scale.options.ticks.beginAtZero = false;
  236. chartInstance.update();
  237. expect(chartInstance.scale.ticks).toEqual(['-50', '-45', '-40', '-35', '-30', '-25', '-20']);
  238. });
  239. it('Should generate tick marks in the correct order in reversed mode', function() {
  240. chartInstance = window.acquireChart({
  241. type: 'radar',
  242. data: {
  243. datasets: [{
  244. data: [10, 5, 0, 25, 78]
  245. }],
  246. labels: ['lablel1', 'label2', 'label3', 'label4', 'label5']
  247. },
  248. options: {
  249. scale: {
  250. ticks: {
  251. reverse: true
  252. }
  253. }
  254. }
  255. });
  256. expect(chartInstance.scale.ticks).toEqual(['80', '70', '60', '50', '40', '30', '20', '10', '0']);
  257. expect(chartInstance.scale.start).toBe(80);
  258. expect(chartInstance.scale.end).toBe(0);
  259. });
  260. it('Should build labels using the user supplied callback', function() {
  261. chartInstance = window.acquireChart({
  262. type: 'radar',
  263. data: {
  264. datasets: [{
  265. data: [10, 5, 0, 25, 78]
  266. }],
  267. labels: ['label1', 'label2', 'label3', 'label4', 'label5']
  268. },
  269. options: {
  270. scale: {
  271. ticks: {
  272. callback: function(value, index) {
  273. return index.toString();
  274. }
  275. }
  276. }
  277. }
  278. });
  279. expect(chartInstance.scale.ticks).toEqual(['0', '1', '2', '3', '4', '5', '6', '7', '8']);
  280. expect(chartInstance.scale.pointLabels).toEqual(['label1', 'label2', 'label3', 'label4', 'label5']);
  281. });
  282. it('Should build point labels using the user supplied callback', function() {
  283. chartInstance = window.acquireChart({
  284. type: 'radar',
  285. data: {
  286. datasets: [{
  287. data: [10, 5, 0, 25, 78]
  288. }],
  289. labels: ['label1', 'label2', 'label3', 'label4', 'label5']
  290. },
  291. options: {
  292. scale: {
  293. pointLabels: {
  294. callback: function(value, index) {
  295. return index.toString();
  296. }
  297. }
  298. }
  299. }
  300. });
  301. expect(chartInstance.scale.pointLabels).toEqual(['0', '1', '2', '3', '4']);
  302. });
  303. it('should correctly set the center point', function() {
  304. chartInstance = window.acquireChart({
  305. type: 'radar',
  306. data: {
  307. datasets: [{
  308. data: [10, 5, 0, 25, 78]
  309. }],
  310. labels: ['label1', 'label2', 'label3', 'label4', 'label5']
  311. },
  312. options: {
  313. scale: {
  314. pointLabels: {
  315. callback: function(value, index) {
  316. return index.toString();
  317. }
  318. }
  319. }
  320. }
  321. });
  322. expect(chartInstance.scale.drawingArea).toBe(225);
  323. expect(chartInstance.scale.xCenter).toBe(256);
  324. expect(chartInstance.scale.yCenter).toBe(272);
  325. });
  326. it('should correctly get the label for a given data index', function() {
  327. chartInstance = window.acquireChart({
  328. type: 'radar',
  329. data: {
  330. datasets: [{
  331. data: [10, 5, 0, 25, 78]
  332. }],
  333. labels: ['label1', 'label2', 'label3', 'label4', 'label5']
  334. },
  335. options: {
  336. scale: {
  337. pointLabels: {
  338. callback: function(value, index) {
  339. return index.toString();
  340. }
  341. }
  342. }
  343. }
  344. });
  345. expect(chartInstance.scale.getLabelForIndex(1, 0)).toBe(5);
  346. });
  347. it('should get the correct distance from the center point', function() {
  348. chartInstance = window.acquireChart({
  349. type: 'radar',
  350. data: {
  351. datasets: [{
  352. data: [10, 5, 0, 25, 78]
  353. }],
  354. labels: ['label1', 'label2', 'label3', 'label4', 'label5']
  355. },
  356. options: {
  357. scale: {
  358. pointLabels: {
  359. callback: function(value, index) {
  360. return index.toString();
  361. }
  362. }
  363. }
  364. }
  365. });
  366. expect(chartInstance.scale.getDistanceFromCenterForValue(chartInstance.scale.min)).toBe(0);
  367. expect(chartInstance.scale.getDistanceFromCenterForValue(chartInstance.scale.max)).toBe(225);
  368. expect(chartInstance.scale.getPointPositionForValue(1, 5)).toEqual({
  369. x: 269,
  370. y: 268,
  371. });
  372. chartInstance.scale.options.reverse = true;
  373. chartInstance.update();
  374. expect(chartInstance.scale.getDistanceFromCenterForValue(chartInstance.scale.min)).toBe(225);
  375. expect(chartInstance.scale.getDistanceFromCenterForValue(chartInstance.scale.max)).toBe(0);
  376. });
  377. });