Laclic
/
Souke
Suivre 5
Ajouter aux favoris 0
Bifurcation 1
Code Tickets 1 Demandes d'ajout 0 Versions 0 Wiki Activité
Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.
423 Révisions
6 Branches
Aborescence: dd46e00d7a
Branches Tags
${ item.name }
Créer la branche ${ searchTerm }
de 'dd46e00d7a'
${ noResults }
Souke/vendor/bower/chartjs/test/controller.radar.tests.js

465 lines
14KB
Brut Annotations Historique 

  1. // Test the polar area controller

  2. describe('Radar controller tests', function() {

  3. 	beforeEach(function() {

  4. 		window.addDefaultMatchers(jasmine);

  5. 	});

  6. 

  7. 	afterEach(function() {

  8. 		window.releaseAllCharts();

  9. 	});

  10. 

  11. 	it('Should be constructed', function() {

  12. 		var chart = window.acquireChart({

  13. 			type: 'radar',

  14. 			data: {

  15. 				datasets: [{

  16. 					data: []

  17. 				}],

  18. 				labels: []

  19. 			}

  20. 		});

  21. 

  22. 		var meta = chart.getDatasetMeta(0);

  23. 		expect(meta.type).toBe('radar');

  24. 		expect(meta.controller).not.toBe(undefined);

  25. 		expect(meta.controller.index).toBe(0);

  26. 		expect(meta.data).toEqual([]);

  27. 

  28. 		meta.controller.updateIndex(1);

  29. 		expect(meta.controller.index).toBe(1);

  30. 	});

  31. 

  32. 	it('Should create arc elements for each data item during initialization', function() {

  33. 		var chart = window.acquireChart({

  34. 			type: 'radar',

  35. 			data: {

  36. 				datasets: [{

  37. 					data: [10, 15, 0, 4]

  38. 				}],

  39. 				labels: ['label1', 'label2', 'label3', 'label4']

  40. 			}

  41. 		});

  42. 

  43. 		var controller = new Chart.controllers.radar(chart, 0);

  44. 

  45. 		var meta = chart.getDatasetMeta(0);

  46. 		expect(meta.dataset instanceof Chart.elements.Line).toBe(true); // line element

  47. 		expect(meta.data.length).toBe(4); // 4 points created

  48. 		expect(meta.data[0] instanceof Chart.elements.Point).toBe(true);

  49. 		expect(meta.data[1] instanceof Chart.elements.Point).toBe(true);

  50. 		expect(meta.data[2] instanceof Chart.elements.Point).toBe(true);

  51. 		expect(meta.data[3] instanceof Chart.elements.Point).toBe(true);

  52. 	});

  53. 

  54. 	it('should draw all elements', function() {

  55. 		var chart = window.acquireChart({

  56. 			type: 'radar',

  57. 			data: {

  58. 				datasets: [{

  59. 					data: [10, 15, 0, 4]

  60. 				}],

  61. 				labels: ['label1', 'label2', 'label3', 'label4']

  62. 			}

  63. 		});

  64. 

  65. 		var meta = chart.getDatasetMeta(0);

  66. 

  67. 		spyOn(meta.dataset, 'draw');

  68. 		spyOn(meta.data[0], 'draw');

  69. 		spyOn(meta.data[1], 'draw');

  70. 		spyOn(meta.data[2], 'draw');

  71. 		spyOn(meta.data[3], 'draw');

  72. 

  73. 		chart.update();

  74. 

  75. 		expect(meta.dataset.draw.calls.count()).toBe(1);

  76. 		expect(meta.data[0].draw.calls.count()).toBe(1);

  77. 		expect(meta.data[1].draw.calls.count()).toBe(1);

  78. 		expect(meta.data[2].draw.calls.count()).toBe(1);

  79. 		expect(meta.data[3].draw.calls.count()).toBe(1);

  80. 	});

  81. 

  82. 	it('should update elements', function() {

  83. 		var chart = window.acquireChart({

  84. 			type: 'radar',

  85. 			data: {

  86. 				datasets: [{

  87. 					data: [10, 15, 0, 4]

  88. 				}],

  89. 				labels: ['label1', 'label2', 'label3', 'label4']

  90. 			},

  91. 			options: {

  92. 				showLines: true,

  93. 				elements: {

  94. 					line: {

  95. 						backgroundColor: 'rgb(255, 0, 0)',

  96. 						borderCapStyle: 'round',

  97. 						borderColor: 'rgb(0, 255, 0)',

  98. 						borderDash: [],

  99. 						borderDashOffset: 0.1,

  100. 						borderJoinStyle: 'bevel',

  101. 						borderWidth: 1.2,

  102. 						fill: true,

  103. 						tension: 0.1,

  104. 					},

  105. 					point: {

  106. 						backgroundColor: Chart.defaults.global.defaultColor,

  107. 						borderWidth: 1,

  108. 						borderColor: Chart.defaults.global.defaultColor,

  109. 						hitRadius: 1,

  110. 						hoverRadius: 4,

  111. 						hoverBorderWidth: 1,

  112. 						radius: 3,

  113. 						pointStyle: 'circle'

  114. 					}

  115. 				}

  116. 			}

  117. 		});

  118. 

  119. 		var meta = chart.getDatasetMeta(0);

  120. 

  121. 		meta.controller.reset(); // reset first

  122. 

  123. 		// Line element

  124. 		expect(meta.dataset._model.scaleTop).toBeCloseToPixel(32);

  125. 		expect(meta.dataset._model.scaleBottom).toBeCloseToPixel(512);

  126. 		expect(meta.dataset._model.scaleZero.x).toBeCloseToPixel(256);

  127. 		expect(meta.dataset._model.scaleZero.y).toBeCloseToPixel(272);

  128. 		expect(meta.dataset._model).toEqual(jasmine.objectContaining({

  129. 			backgroundColor: 'rgb(255, 0, 0)',

  130. 			borderCapStyle: 'round',

  131. 			borderColor: 'rgb(0, 255, 0)',

  132. 			borderDash: [],

  133. 			borderDashOffset: 0.1,

  134. 			borderJoinStyle: 'bevel',

  135. 			borderWidth: 1.2,

  136. 			fill: true,

  137. 			tension: 0.1,

  138. 		}));

  139. 

  140. 		[ 

  141. 			{ x: 256, y: 272, cppx: 256, cppy: 272, cpnx: 256, cpny: 272},

  142. 			{ x: 256, y: 272, cppx: 256, cppy: 272, cpnx: 256, cpny: 272},

  143. 			{ x: 256, y: 272, cppx: 256, cppy: 272, cpnx: 256, cpny: 272},

  144. 			{ x: 256, y: 272, cppx: 256, cppy: 272, cpnx: 256, cpny: 272},

  145. 		].forEach(function(expected, i) {

  146. 			expect(meta.data[i]._model.x).toBeCloseToPixel(expected.x);

  147. 			expect(meta.data[i]._model.y).toBeCloseToPixel(expected.y);

  148. 			expect(meta.data[i]._model.controlPointPreviousX).toBeCloseToPixel(expected.cppx);

  149. 			expect(meta.data[i]._model.controlPointPreviousY).toBeCloseToPixel(expected.cppy);

  150. 			expect(meta.data[i]._model.controlPointNextX).toBeCloseToPixel(expected.cpnx);

  151. 			expect(meta.data[i]._model.controlPointNextY).toBeCloseToPixel(expected.cpny);

  152. 			expect(meta.data[i]._model).toEqual(jasmine.objectContaining({

  153. 				backgroundColor: Chart.defaults.global.defaultColor,

  154. 				borderWidth: 1,

  155. 				borderColor: Chart.defaults.global.defaultColor,

  156. 				hitRadius: 1,

  157. 				radius: 3,

  158. 				pointStyle: 'circle',

  159. 				skip: false,

  160. 				tension: 0.1,

  161. 			}));

  162. 		});

  163. 

  164. 		// Now update controller and ensure proper updates

  165. 		meta.controller.update();

  166. 		

  167. 		[ 

  168. 			{ x: 256, y: 133, cppx: 246, cppy: 133, cpnx: 272, cpny: 133 },

  169. 			{ x: 464, y: 272, cppx: 464, cppy: 264, cpnx: 464, cpny: 278 },

  170. 			{ x: 256, y: 272, cppx: 276.9, cppy: 272, cpnx: 250.4, cpny: 272 },

  171. 			{ x: 200, y: 272, cppx: 200, cppy: 275, cpnx: 200, cpny: 261 },

  172. 		].forEach(function(expected, i) {

  173. 			expect(meta.data[i]._model.x).toBeCloseToPixel(expected.x);

  174. 			expect(meta.data[i]._model.y).toBeCloseToPixel(expected.y);

  175. 			expect(meta.data[i]._model.controlPointPreviousX).toBeCloseToPixel(expected.cppx);

  176. 			expect(meta.data[i]._model.controlPointPreviousY).toBeCloseToPixel(expected.cppy);

  177. 			expect(meta.data[i]._model.controlPointNextX).toBeCloseToPixel(expected.cpnx);

  178. 			expect(meta.data[i]._model.controlPointNextY).toBeCloseToPixel(expected.cpny);

  179. 			expect(meta.data[i]._model).toEqual(jasmine.objectContaining({

  180. 				backgroundColor: Chart.defaults.global.defaultColor,

  181. 				borderWidth: 1,

  182. 				borderColor: Chart.defaults.global.defaultColor,

  183. 				hitRadius: 1,

  184. 				radius: 3,

  185. 				pointStyle: 'circle',

  186. 				skip: false,

  187. 				tension: 0.1,

  188. 			}));

  189. 		});

  190. 

  191. 		// Use dataset level styles for lines & points

  192. 		chart.data.datasets[0].tension = 0;

  193. 		chart.data.datasets[0].backgroundColor = 'rgb(98, 98, 98)';

  194. 		chart.data.datasets[0].borderColor = 'rgb(8, 8, 8)';

  195. 		chart.data.datasets[0].borderWidth = 0.55;

  196. 		chart.data.datasets[0].borderCapStyle = 'butt';

  197. 		chart.data.datasets[0].borderDash = [2, 3];

  198. 		chart.data.datasets[0].borderDashOffset = 7;

  199. 		chart.data.datasets[0].borderJoinStyle = 'miter';

  200. 		chart.data.datasets[0].fill = false;

  201. 

  202. 		// point styles

  203. 		chart.data.datasets[0].pointRadius = 22;

  204. 		chart.data.datasets[0].hitRadius = 3.3;

  205. 		chart.data.datasets[0].pointBackgroundColor = 'rgb(128, 129, 130)';

  206. 		chart.data.datasets[0].pointBorderColor = 'rgb(56, 57, 58)';

  207. 		chart.data.datasets[0].pointBorderWidth = 1.123;

  208. 

  209. 		meta.controller.update();

  210. 

  211. 		expect(meta.dataset._model.scaleTop).toBeCloseToPixel(32);

  212. 		expect(meta.dataset._model.scaleBottom).toBeCloseToPixel(512);

  213. 		expect(meta.dataset._model.scaleZero.x).toBeCloseToPixel(256);

  214. 		expect(meta.dataset._model.scaleZero.y).toBeCloseToPixel(272);

  215. 		expect(meta.dataset._model).toEqual(jasmine.objectContaining({

  216. 			backgroundColor: 'rgb(98, 98, 98)',

  217. 			borderCapStyle: 'butt',

  218. 			borderColor: 'rgb(8, 8, 8)',

  219. 			borderDash: [2, 3],

  220. 			borderDashOffset: 7,

  221. 			borderJoinStyle: 'miter',

  222. 			borderWidth: 0.55,

  223. 			fill: false,

  224. 			tension: 0,

  225. 		}));

  226. 

  227. 		// Since tension is now 0, we don't care about the control points

  228. 		[ 

  229. 			{ x: 256, y: 133 },

  230. 			{ x: 464, y: 272 },

  231. 			{ x: 256, y: 272 },

  232. 			{ x: 200, y: 272 },

  233. 		].forEach(function(expected, i) {

  234. 			expect(meta.data[i]._model.x).toBeCloseToPixel(expected.x);

  235. 			expect(meta.data[i]._model.y).toBeCloseToPixel(expected.y);

  236. 			expect(meta.data[i]._model).toEqual(jasmine.objectContaining({

  237. 				backgroundColor: 'rgb(128, 129, 130)',

  238. 				borderWidth: 1.123,

  239. 				borderColor: 'rgb(56, 57, 58)',

  240. 				hitRadius: 3.3,

  241. 				radius: 22,

  242. 				pointStyle: 'circle',

  243. 				skip: false,

  244. 				tension: 0,

  245. 			}));

  246. 		});

  247. 

  248. 		

  249. 		// Use custom styles for lines & first point

  250. 		meta.dataset.custom = {

  251. 			tension: 0.25,

  252. 			backgroundColor: 'rgb(55, 55, 54)',

  253. 			borderColor: 'rgb(8, 7, 6)',

  254. 			borderWidth: 0.3,

  255. 			borderCapStyle: 'square',

  256. 			borderDash: [4, 3],

  257. 			borderDashOffset: 4.4,

  258. 			borderJoinStyle: 'round',

  259. 			fill: true,

  260. 		};

  261. 

  262. 		// point styles

  263. 		meta.data[0].custom = {

  264. 			radius: 2.2,

  265. 			backgroundColor: 'rgb(0, 1, 3)',

  266. 			borderColor: 'rgb(4, 6, 8)',

  267. 			borderWidth: 0.787,

  268. 			tension: 0.15,

  269. 			skip: true,

  270. 			hitRadius: 5,

  271. 		};

  272. 

  273. 		meta.controller.update();

  274. 

  275. 		expect(meta.dataset._model.scaleTop).toBeCloseToPixel(32);

  276. 		expect(meta.dataset._model.scaleBottom).toBeCloseToPixel(512);

  277. 		expect(meta.dataset._model.scaleZero.x).toBeCloseToPixel(256);

  278. 		expect(meta.dataset._model.scaleZero.y).toBeCloseToPixel(272);

  279. 		expect(meta.dataset._model).toEqual(jasmine.objectContaining({

  280. 			backgroundColor: 'rgb(55, 55, 54)',

  281. 			borderCapStyle: 'square',

  282. 			borderColor: 'rgb(8, 7, 6)',

  283. 			borderDash: [4, 3],

  284. 			borderDashOffset: 4.4,

  285. 			borderJoinStyle: 'round',

  286. 			borderWidth: 0.3,

  287. 			fill: true,

  288. 			tension: 0.25,

  289. 		}));

  290. 

  291. 		expect(meta.data[0]._model.x).toBeCloseToPixel(256);

  292. 		expect(meta.data[0]._model.y).toBeCloseToPixel(133);

  293. 		expect(meta.data[0]._model.controlPointPreviousX).toBeCloseToPixel(241);

  294. 		expect(meta.data[0]._model.controlPointPreviousY).toBeCloseToPixel(133);

  295. 		expect(meta.data[0]._model.controlPointNextX).toBeCloseToPixel(281);

  296. 		expect(meta.data[0]._model.controlPointNextY).toBeCloseToPixel(133);

  297. 		expect(meta.data[0]._model).toEqual(jasmine.objectContaining({

  298. 			radius: 2.2,

  299. 			backgroundColor: 'rgb(0, 1, 3)',

  300. 			borderColor: 'rgb(4, 6, 8)',

  301. 			borderWidth: 0.787,

  302. 			tension: 0.15,

  303. 			skip: true,

  304. 			hitRadius: 5,

  305. 		}));

  306. 	});

  307. 

  308. 	it('should set point hover styles', function() {

  309. 		var chart = window.acquireChart({

  310. 			type: 'radar',

  311. 			data: {

  312. 				datasets: [{

  313. 					data: [10, 15, 0, 4]

  314. 				}],

  315. 				labels: ['label1', 'label2', 'label3', 'label4']

  316. 			},

  317. 			options: {

  318. 				showLines: true,

  319. 				elements: {

  320. 					line: {

  321. 						backgroundColor: 'rgb(255, 0, 0)',

  322. 						borderCapStyle: 'round',

  323. 						borderColor: 'rgb(0, 255, 0)',

  324. 						borderDash: [],

  325. 						borderDashOffset: 0.1,

  326. 						borderJoinStyle: 'bevel',

  327. 						borderWidth: 1.2,

  328. 						fill: true,

  329. 						skipNull: true,

  330. 						tension: 0.1,

  331. 					},

  332. 					point: {

  333. 						backgroundColor: 'rgb(255, 255, 0)',

  334. 						borderWidth: 1,

  335. 						borderColor: 'rgb(255, 255, 255)',

  336. 						hitRadius: 1,

  337. 						hoverRadius: 4,

  338. 						hoverBorderWidth: 1,

  339. 						radius: 3,

  340. 					}

  341. 				}

  342. 			}

  343. 		});

  344. 

  345. 		var meta = chart.getDatasetMeta(0);

  346. 

  347. 		meta.controller.update(); // reset first

  348. 

  349. 		var point = meta.data[0];

  350. 

  351. 		meta.controller.setHoverStyle(point);

  352. 		expect(point._model.backgroundColor).toBe('rgb(229, 230, 0)');

  353. 		expect(point._model.borderColor).toBe('rgb(230, 230, 230)');

  354. 		expect(point._model.borderWidth).toBe(1);

  355. 		expect(point._model.radius).toBe(4);

  356. 

  357. 		// Can set hover style per dataset

  358. 		chart.data.datasets[0].pointHoverRadius = 3.3;

  359. 		chart.data.datasets[0].pointHoverBackgroundColor = 'rgb(77, 79, 81)';

  360. 		chart.data.datasets[0].pointHoverBorderColor = 'rgb(123, 125, 127)';

  361. 		chart.data.datasets[0].pointHoverBorderWidth = 2.1;

  362. 

  363. 		meta.controller.setHoverStyle(point);

  364. 		expect(point._model.backgroundColor).toBe('rgb(77, 79, 81)');

  365. 		expect(point._model.borderColor).toBe('rgb(123, 125, 127)');

  366. 		expect(point._model.borderWidth).toBe(2.1);

  367. 		expect(point._model.radius).toBe(3.3);

  368. 

  369. 		// Custom style

  370. 		point.custom = {

  371. 			hoverRadius: 4.4,

  372. 			hoverBorderWidth: 5.5,

  373. 			hoverBackgroundColor: 'rgb(0, 0, 0)',

  374. 			hoverBorderColor: 'rgb(10, 10, 10)'

  375. 		};

  376. 

  377. 		meta.controller.setHoverStyle(point);

  378. 		expect(point._model.backgroundColor).toBe('rgb(0, 0, 0)');

  379. 		expect(point._model.borderColor).toBe('rgb(10, 10, 10)');

  380. 		expect(point._model.borderWidth).toBe(5.5);

  381. 		expect(point._model.radius).toBe(4.4);

  382. 	});

  383. 

  384. 

  385. 	it('should remove hover styles', function() {

  386. 		var chart = window.acquireChart({

  387. 			type: 'radar',

  388. 			data: {

  389. 				datasets: [{

  390. 					data: [10, 15, 0, 4]

  391. 				}],

  392. 				labels: ['label1', 'label2', 'label3', 'label4']

  393. 			},

  394. 			options: {

  395. 				showLines: true,

  396. 				elements: {

  397. 					line: {

  398. 						backgroundColor: 'rgb(255, 0, 0)',

  399. 						borderCapStyle: 'round',

  400. 						borderColor: 'rgb(0, 255, 0)',

  401. 						borderDash: [],

  402. 						borderDashOffset: 0.1,

  403. 						borderJoinStyle: 'bevel',

  404. 						borderWidth: 1.2,

  405. 						fill: true,

  406. 						skipNull: true,

  407. 						tension: 0.1,

  408. 					},

  409. 					point: {

  410. 						backgroundColor: 'rgb(255, 255, 0)',

  411. 						borderWidth: 1,

  412. 						borderColor: 'rgb(255, 255, 255)',

  413. 						hitRadius: 1,

  414. 						hoverRadius: 4,

  415. 						hoverBorderWidth: 1,

  416. 						radius: 3,

  417. 					}

  418. 				}

  419. 			}

  420. 		});

  421. 

  422. 		var meta = chart.getDatasetMeta(0);

  423. 

  424. 		meta.controller.update(); // reset first

  425. 

  426. 		var point = meta.data[0];

  427. 

  428. 		chart.options.elements.point.backgroundColor = 'rgb(45, 46, 47)';

  429. 		chart.options.elements.point.borderColor = 'rgb(50, 51, 52)';

  430. 		chart.options.elements.point.borderWidth = 10.1;

  431. 		chart.options.elements.point.radius = 1.01;

  432. 

  433. 		meta.controller.removeHoverStyle(point);

  434. 		expect(point._model.backgroundColor).toBe('rgb(45, 46, 47)');

  435. 		expect(point._model.borderColor).toBe('rgb(50, 51, 52)');

  436. 		expect(point._model.borderWidth).toBe(10.1);

  437. 		expect(point._model.radius).toBe(1.01);

  438. 

  439. 		// Can set hover style per dataset

  440. 		chart.data.datasets[0].radius = 3.3;

  441. 		chart.data.datasets[0].pointBackgroundColor = 'rgb(77, 79, 81)';

  442. 		chart.data.datasets[0].pointBorderColor = 'rgb(123, 125, 127)';

  443. 		chart.data.datasets[0].pointBorderWidth = 2.1;

  444. 

  445. 		meta.controller.removeHoverStyle(point);

  446. 		expect(point._model.backgroundColor).toBe('rgb(77, 79, 81)');

  447. 		expect(point._model.borderColor).toBe('rgb(123, 125, 127)');

  448. 		expect(point._model.borderWidth).toBe(2.1);

  449. 		expect(point._model.radius).toBe(3.3);

  450. 

  451. 		// Custom style

  452. 		point.custom = {

  453. 			radius: 4.4,

  454. 			borderWidth: 5.5,

  455. 			backgroundColor: 'rgb(0, 0, 0)',

  456. 			borderColor: 'rgb(10, 10, 10)'

  457. 		};

  458. 

  459. 		meta.controller.removeHoverStyle(point);

  460. 		expect(point._model.backgroundColor).toBe('rgb(0, 0, 0)');

  461. 		expect(point._model.borderColor).toBe('rgb(10, 10, 10)');

  462. 		expect(point._model.borderWidth).toBe(5.5);

  463. 		expect(point._model.radius).toBe(4.4);

  464. 	});

  465. });