jquery.flot.Test.js 44 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182
  1. describe('flot', function() {
  2. describe('setRange', function() {
  3. var placeholder, plot;
  4. var options = {
  5. series: {
  6. shadowSize: 0, // don't draw shadows
  7. lines: { show: false },
  8. points: { show: true, fill: false, symbol: 'circle' }
  9. }
  10. };
  11. beforeEach(function() {
  12. placeholder = setFixtures('<div id="test-container" style="width: 600px;height: 400px">')
  13. .find('#test-container');
  14. });
  15. it('should keep the axis min and max for none autoscaling if no data is set', function () {
  16. options.xaxis = {autoScale: 'none', min: 0, max: 50};
  17. options.yaxis = {autoScale: 'none', min: 0, max: 100};
  18. plot = $.plot(placeholder, [[]], options);
  19. var axes = plot.getAxes();
  20. expect(axes.xaxis.min).toBe(0);
  21. expect(axes.xaxis.max).toBe(50);
  22. expect(axes.yaxis.min).toBe(0);
  23. expect(axes.yaxis.max).toBe(100);
  24. });
  25. it('should swap the axis min and max for min > max', function () {
  26. options.xaxis = {autoScale: 'none', min: 50, max: 0};
  27. options.yaxis = {autoScale: 'none', min: 100, max: 0};
  28. plot = $.plot(placeholder, [[]], options);
  29. var axes = plot.getAxes();
  30. expect(axes.xaxis.min).toBe(0);
  31. expect(axes.xaxis.max).toBe(50);
  32. expect(axes.yaxis.min).toBe(0);
  33. expect(axes.yaxis.max).toBe(100);
  34. });
  35. it('should keep the axis min and max for exact autoscaling if no data is set', function () {
  36. options.xaxis = {autoScale: 'exact', min: 0, max: 50};
  37. options.yaxis = {autoScale: 'exact', min: 0, max: 100};
  38. plot = $.plot(placeholder, [[]], options);
  39. var axes = plot.getAxes();
  40. expect(axes.xaxis.min).toBe(0);
  41. expect(axes.xaxis.max).toBe(50);
  42. expect(axes.yaxis.min).toBe(0);
  43. expect(axes.yaxis.max).toBe(100);
  44. });
  45. it('should keep the axis min and max for grow-exact autoscaling if no data is set', function () {
  46. options.xaxis = {autoScale: 'exact', growOnly: true, min: 0, max: 50};
  47. options.yaxis = {autoScale: 'exact', growOnly: true, min: 0, max: 100};
  48. plot = $.plot(placeholder, [[]], options);
  49. var axes = plot.getAxes();
  50. expect(axes.xaxis.min).toBe(0);
  51. expect(axes.xaxis.max).toBe(50);
  52. expect(axes.yaxis.min).toBe(0);
  53. expect(axes.yaxis.max).toBe(100);
  54. });
  55. it('should keep the axis min and max for loose autoscaling if no data is set', function () {
  56. options.xaxis = {autoScale: 'loose', min: 0, max: 50};
  57. options.yaxis = {autoScale: 'loose', min: 0, max: 100};
  58. plot = $.plot(placeholder, [[]], options);
  59. var axes = plot.getAxes();
  60. expect(axes.xaxis.min).toBe(0);
  61. expect(axes.xaxis.max).toBe(50);
  62. expect(axes.yaxis.min).toBe(0);
  63. expect(axes.yaxis.max).toBe(100);
  64. });
  65. it('should keep the axis min and max for grow-loose autoscaling if no data is set', function () {
  66. options.xaxis = {autoScale: 'loose', growOnly: true, min: 0, max: 50};
  67. options.yaxis = {autoScale: 'loose', growOnly: true, min: 0, max: 100};
  68. plot = $.plot(placeholder, [[]], options);
  69. var axes = plot.getAxes();
  70. expect(axes.xaxis.min).toBe(0);
  71. expect(axes.xaxis.max).toBe(50);
  72. expect(axes.yaxis.min).toBe(0);
  73. expect(axes.yaxis.max).toBe(100);
  74. });
  75. it('should keep the axis min and max for window autoscaling if no data is set', function () {
  76. options.xaxis = {autoScale: 'sliding-window', min: 0, max: 50};
  77. options.yaxis = {autoScale: 'sliding-window', min: 0, max: 100};
  78. plot = $.plot(placeholder, [[]], options);
  79. var axes = plot.getAxes();
  80. expect(axes.xaxis.min).toBe(0);
  81. expect(axes.xaxis.max).toBe(50);
  82. expect(axes.yaxis.min).toBe(0);
  83. expect(axes.yaxis.max).toBe(100);
  84. });
  85. it('should not shift the axis min and max for window autoscaling if data is in window', function () {
  86. options.xaxis = {autoScale: 'sliding-window', min: 0, max: 10};
  87. options.yaxis = {autoScale: 'sliding-window', min: 0, max: 10};
  88. // default window size is 100
  89. plot = $.plot(placeholder, [[]], options);
  90. plot.setData([[[0, 0], [50, 50], [100, 100]]]);
  91. plot.setupGrid(true);
  92. plot.draw();
  93. var axes = plot.getAxes();
  94. expect(axes.xaxis.min).toBe(0);
  95. expect(axes.xaxis.max).toBe(100);
  96. expect(axes.yaxis.min).toBe(0);
  97. expect(axes.yaxis.max).toBe(100);
  98. });
  99. it('should shift the axis min and max for window autoscaling if data is bigger than window', function () {
  100. options.xaxis = {autoScale: 'sliding-window', min: 0, max: 10};
  101. options.yaxis = {autoScale: 'sliding-window', min: 0, max: 10};
  102. // default window size is 100
  103. plot = $.plot(placeholder, [[]], options);
  104. plot.setData([[[0, 0], [100, 100], [200, 200]]]);
  105. plot.setupGrid(true);
  106. plot.draw();
  107. var axes = plot.getAxes();
  108. expect(axes.xaxis.min).toBe(100);
  109. expect(axes.xaxis.max).toBe(200);
  110. expect(axes.yaxis.min).toBe(100);
  111. expect(axes.yaxis.max).toBe(200);
  112. });
  113. it('should widen the axis max if axis min is the same as axis max', function () {
  114. options.xaxis = {min: 0, max: 0};
  115. options.yaxis = {min: 2, max: 2};
  116. plot = $.plot(placeholder, [[]], options);
  117. var axes = plot.getAxes();
  118. expect(axes.xaxis.min).toBe(0);
  119. expect(axes.xaxis.max).toBe(1);
  120. expect(axes.yaxis.min).toBe(2);
  121. expect(axes.yaxis.max).toBe(2.01);
  122. });
  123. it('should widen the axis min and max if both are null', function () {
  124. options.xaxis = {};
  125. options.yaxis = {};
  126. plot = $.plot(placeholder, [[]], options);
  127. var axes = plot.getAxes();
  128. expect(axes.xaxis.min).toBe(-0.01);
  129. expect(axes.xaxis.max).toBe(0.01);
  130. expect(axes.yaxis.min).toBe(-0.01);
  131. expect(axes.yaxis.max).toBe(0.01);
  132. });
  133. it('should widen the axis min if is null', function () {
  134. options.xaxis = {max: 1};
  135. options.yaxis = {max: 0};
  136. plot = $.plot(placeholder, [[]], options);
  137. var axes = plot.getAxes();
  138. expect(axes.xaxis.min).toBe(-1);
  139. expect(axes.xaxis.max).toBe(1);
  140. expect(axes.yaxis.min).toBe(-1);
  141. expect(axes.yaxis.max).toBe(0);
  142. });
  143. it('should not change the axis min and max for none autoscaling if data is set', function () {
  144. options.xaxis = {autoScale: 'none', min: 0, max: 50};
  145. options.yaxis = {autoScale: 'none', min: 0, max: 100};
  146. plot = $.plot(placeholder, [[]], options);
  147. var axes = plot.getAxes();
  148. plot.setData([[[0, 1], [1, 2]]]);
  149. plot.setupGrid(true);
  150. plot.draw();
  151. expect(axes.xaxis.min).toBe(0);
  152. expect(axes.xaxis.max).toBe(50);
  153. expect(axes.yaxis.min).toBe(0);
  154. expect(axes.yaxis.max).toBe(100);
  155. });
  156. it('should change the axis min and max for exact autoscaling if data is set', function () {
  157. options.xaxis = {autoScale: 'exact', min: 0, max: 50};
  158. options.yaxis = {autoScale: 'exact', min: 0, max: 100};
  159. plot = $.plot(placeholder, [[]], options);
  160. var axes = plot.getAxes();
  161. plot.setData([[[0, 1], [1, 2]]]);
  162. plot.setupGrid(true);
  163. plot.draw();
  164. expect(axes.xaxis.min).toBe(0);
  165. expect(axes.xaxis.max).toBe(1);
  166. expect(axes.yaxis.min).toBe(1);
  167. expect(axes.yaxis.max).toBe(2);
  168. });
  169. it('should change the axis min and max for loose autoscaling if data is set', function () {
  170. options.xaxis = {autoScale: 'loose', min: 0, max: 50};
  171. options.yaxis = {autoScale: 'loose', min: 0, max: 100};
  172. plot = $.plot(placeholder, [[]], options);
  173. var axes = plot.getAxes();
  174. plot.setData([[[-0.2, -15], [10, 100]]]);
  175. plot.setupGrid(true);
  176. plot.draw();
  177. expect(axes.xaxis.min).toBe(-1);
  178. expect(axes.xaxis.max).toBe(11);
  179. expect(axes.yaxis.min).toBe(-20);
  180. expect(axes.yaxis.max).toBe(120);
  181. });
  182. it('should keep the axis min 0 for loose autoscaling if all values are positive', function () {
  183. options.xaxis = {autoScale: 'loose', min: 0, max: 50};
  184. options.yaxis = {autoScale: 'loose', min: 0, max: 100};
  185. plot = $.plot(placeholder, [[]], options);
  186. var axes = plot.getAxes();
  187. plot.setData([[[0, 0.1], [10, 100]]]);
  188. plot.setupGrid(true);
  189. plot.draw();
  190. expect(axes.xaxis.min).toBe(0);
  191. expect(axes.yaxis.min).toBe(0);
  192. });
  193. it('should ignore NaN, Infinity and -Infinity values', function () {
  194. options.xaxis = {autoScale: 'exact'};
  195. options.yaxis = {autoScale: 'exact'};
  196. plot = $.plot(placeholder, [[[Infinity, 0], [NaN, NaN], [0, Infinity], [10, -Infinity], [-Infinity, 10], [3, 5], [8, 2]]], options);
  197. var axes = plot.getAxes();
  198. expect(axes.xaxis.min).toBe(0);
  199. expect(axes.xaxis.max).toBe(10);
  200. expect(axes.yaxis.min).toBe(0);
  201. expect(axes.yaxis.max).toBe(10);
  202. });
  203. });
  204. describe('computeRangeForDataSeries', function() {
  205. var placeholder, plot;
  206. var options = {
  207. series: {
  208. shadowSize: 0, // don't draw shadows
  209. lines: { show: false },
  210. points: { show: true, fill: false, symbol: 'circle' }
  211. }
  212. };
  213. beforeEach(function() {
  214. placeholder = setFixtures('<div id="test-container" style="width: 600px;height: 400px">')
  215. .find('#test-container');
  216. });
  217. it('should return Infinity and -Infinity for the minimum and the maximum respectively of x and y for an empty series', function () {
  218. plot = $.plot(placeholder, [[]], options);
  219. var series = plot.getData();
  220. var limits = plot.computeRangeForDataSeries(series[0]);
  221. expect(limits.xmin).toBe(Infinity);
  222. expect(limits.xmax).toBe(-Infinity);
  223. expect(limits.ymin).toBe(Infinity);
  224. expect(limits.ymax).toBe(-Infinity);
  225. });
  226. it('should return the minimum and the maximum of x and y for a series', function () {
  227. plot = $.plot(placeholder, [[[0, 1], [1, 2], [2, 3]]], options);
  228. var series = plot.getData();
  229. var limits = plot.computeRangeForDataSeries(series[0]);
  230. expect(limits.xmin).toBe(0);
  231. expect(limits.xmax).toBe(2);
  232. expect(limits.ymin).toBe(1);
  233. expect(limits.ymax).toBe(3);
  234. });
  235. it('should return the minimum and the maximum of x and y for an xy series', function () {
  236. plot = $.plot(placeholder, [[[10, 1], [11, 2], [12, 3]]], options);
  237. var series = plot.getData();
  238. var limits = plot.computeRangeForDataSeries(series[0]);
  239. expect(limits.xmin).toBe(10);
  240. expect(limits.xmax).toBe(12);
  241. expect(limits.ymin).toBe(1);
  242. expect(limits.ymax).toBe(3);
  243. });
  244. it('should not compute the minimum and the maximum when autoScale="none"', function () {
  245. options.xaxis = {autoScale: 'none'};
  246. options.yaxis = {autoScale: 'none'};
  247. plot = $.plot(placeholder, [[[0, 1], [1, 2], [2, 3]]], options);
  248. var series = plot.getData();
  249. var limits = plot.computeRangeForDataSeries(series[0]);
  250. expect(limits.xmin).toBe(Infinity);
  251. expect(limits.xmax).toBe(-Infinity);
  252. expect(limits.ymin).toBe(Infinity);
  253. expect(limits.ymax).toBe(-Infinity);
  254. });
  255. it('should compute the minimum and the maximum when autoScale="none" and force=true', function () {
  256. options.xaxis = {autoScale: 'none'};
  257. options.yaxis = {autoScale: 'none'};
  258. plot = $.plot(placeholder, [[[0, 1], [1, 2], [2, 3]]], options);
  259. var series = plot.getData();
  260. var limits = plot.computeRangeForDataSeries(series[0], true);
  261. expect(limits.xmin).toBe(0);
  262. expect(limits.xmax).toBe(2);
  263. expect(limits.ymin).toBe(1);
  264. expect(limits.ymax).toBe(3);
  265. });
  266. });
  267. describe('adjustSeriesDataRange', function() {
  268. var placeholder, plot;
  269. beforeEach(function() {
  270. placeholder = setFixtures('<div id="test-container" style="width: 600px;height: 400px">')
  271. .find('#test-container');
  272. plot = $.plot(placeholder, [[]], {});
  273. });
  274. it('should set the minimum to zero if needed when {lines|bars}.show=true and {lines|bars}.zero=true', function () {
  275. [true, false].forEach(function(show) {
  276. var series = {
  277. lines: { show: show, zero: show },
  278. bars: { show: !show, zero: !show, barWidth: 0.8 },
  279. datapoints: { pointsize: 1 }
  280. },
  281. limits = {xmin: 10, ymin: 11, xmax: 12, ymax: 13};
  282. limits = plot.adjustSeriesDataRange(series, limits);
  283. expect(limits.ymin).toBe(0);
  284. expect(limits.ymax).toBe(13);
  285. });
  286. });
  287. it('should set the maximum to zero if needed when {lines|bars}.show=true and {lines|bars}.zero=true', function () {
  288. [true, false].forEach(function(show) {
  289. var series = {
  290. lines: { show: show, zero: show },
  291. bars: { show: !show, zero: !show, barWidth: 0.8 },
  292. datapoints: { pointsize: 1 }
  293. },
  294. limits = {xmin: 10, ymin: -11, xmax: 12, ymax: -9};
  295. limits = plot.adjustSeriesDataRange(series, limits);
  296. expect(limits.ymin).toBe(-11);
  297. expect(limits.ymax).toBe(0);
  298. });
  299. });
  300. it('should not change the limits of the y when {lines|bars}.show=true, {lines|bars}.zero=true, but datapoints.pointsize>2', function () {
  301. [true, false].forEach(function(show) {
  302. var series = {
  303. lines: { show: show, zero: show },
  304. bars: { show: !show, zero: !show, barWidth: 0.8 },
  305. datapoints: { pointsize: 3 }
  306. },
  307. limits = {xmin: 10, ymin: -11, xmax: 12, ymax: -9};
  308. limits = plot.adjustSeriesDataRange(series, limits);
  309. expect(limits.ymin).toBe(-11);
  310. expect(limits.ymax).toBe(-9);
  311. });
  312. });
  313. it('should change the limits of x to fit the width of the bars', function () {
  314. var series = {
  315. lines: { show: false },
  316. bars: { show: true, align: 'center', barWidth: 6 }
  317. },
  318. limits = {xmin: 10, ymin: 11, xmax: 12, ymax: 13};
  319. limits = plot.adjustSeriesDataRange(series, limits);
  320. expect(limits.xmin).toBe(10 - 6 / 2);
  321. expect(limits.xmax).toBe(12 + 6 / 2);
  322. });
  323. it('should change the limits of x to reserve only the needed space given by width of the bars', function () {
  324. var series = {
  325. lines: { show: false },
  326. bars: { show: true, align: 'center', barWidth: 6 },
  327. datapoints: {points: [0.1, 1, 0.2, 10], pointsize: 2}
  328. },
  329. limits = {xmin: 10, ymin: 11, xmax: 12, ymax: 13};
  330. limits = plot.adjustSeriesDataRange(series, limits);
  331. expect(limits.xmin).toBeCloseTo(10 - ((0.1 * 6) / 2));
  332. expect(limits.xmax).toBeCloseTo(12 - ((0.1 * 6) / 2) + (0.1 * 6));
  333. });
  334. });
  335. describe('findNearbyItem', function() {
  336. var placeholder, plot, sampledata = [[0, 1], [1, 1.1], [2, 1.2]];
  337. beforeEach(function() {
  338. placeholder = setFixtures('<div id="test-container" style="width: 600px;height: 400px">')
  339. .find('#test-container');
  340. });
  341. it('should be able to find the nearest point to the given coordinates', function() {
  342. plot = $.plot(placeholder, [sampledata], {});
  343. var item = plot.findNearbyItem(0, 0, function() {
  344. return true;
  345. }, Number.MAX_VALUE);
  346. expect(item.datapoint[0]).toEqual(sampledata[0][0]);
  347. expect(item.datapoint[1]).toEqual(sampledata[0][1]);
  348. expect(item.dataIndex).toEqual(0);
  349. });
  350. it('should be able to search in a certain radius', function() {
  351. plot = $.plot(placeholder, [sampledata], {});
  352. var item = plot.findNearbyItem(0, 0, function() {
  353. return true;
  354. }, 1);
  355. expect(item).toEqual(null);
  356. item = plot.findNearbyItem(0, 0, function() {
  357. return true;
  358. }, 1000);
  359. expect(item).not.toEqual(null);
  360. });
  361. it('should work for bars', function() {
  362. plot = $.plot(placeholder, [sampledata], {
  363. bars: {show: true}
  364. });
  365. item = plot.findNearbyItem(0, 0, function() {
  366. return true;
  367. }, 1000);
  368. expect(item).not.toEqual(null);
  369. });
  370. });
  371. describe('findNearbyInterpolationPoint', function() {
  372. var placeholder, plot, sampledata = [[0, 1], [1, 1.1], [2, 1.2]];
  373. beforeEach(function() {
  374. placeholder = setFixtures('<div id="test-container" style="width: 600px;height: 400px">')
  375. .find('#test-container');
  376. });
  377. it('should be able to find the nearest point to the given coordinates', function() {
  378. plot = $.plot(placeholder, [sampledata], {});
  379. var item = plot.findNearbyInterpolationPoint(0, 0, function() {
  380. return true;
  381. });
  382. expect(item.datapoint[0]).toEqual(sampledata[0][0]);
  383. expect(item.datapoint[1]).toEqual(sampledata[0][1]);
  384. });
  385. it('should interpolate the intersections properly with linear scales', function() {
  386. plot = $.plot(placeholder, [sampledata], {});
  387. var item = plot.findNearbyInterpolationPoint(0.5, 0, function() {
  388. return true;
  389. });
  390. var expectedY = sampledata[0][1] + (sampledata[1][1] - sampledata[0][1]) / 2;
  391. expect(item.datapoint[0]).toEqual(0.5);
  392. expect(item.datapoint[1]).toEqual(expectedY);
  393. });
  394. it('should return the interpolation with the closest point for multiple series', function() {
  395. plot = $.plot(placeholder, [[[-10, 0], [10, 1], [100, 2]], [[5, 0], [20, 1], [21, 2]], [[0, 0], [2, 1], [4, 2]]], {});
  396. var item = plot.findNearbyInterpolationPoint(1, 1, function() {
  397. return true;
  398. });
  399. var expectedY = 0 + (1 - 0) / 2;
  400. expect(item.datapoint[0]).toEqual(1);
  401. expect(item.datapoint[1]).toEqual(expectedY);
  402. });
  403. it('should interpolate correctly if data comes in reverse order', function () {
  404. const reversedData = [[4, 1.4], [3, 1.3], [2, 1.2], [1, 1.1], [0, 1.0], [-1, 0.9]];
  405. plot = $.plot(placeholder, [reversedData], {});
  406. var point1 = plot.findNearbyInterpolationPoint(0.5, 0, function() {
  407. return true;
  408. });
  409. expect(point1.datapoint[0]).toEqual(0.5);
  410. expect(point1.datapoint[1]).toEqual(1.05);
  411. var point2 = plot.findNearbyInterpolationPoint(2.25, 0, function () {
  412. return true;
  413. });
  414. expect(point2.datapoint[0]).toEqual(2.25);
  415. expect(point2.datapoint[1]).toEqual(1.225);
  416. var point3 = plot.findNearbyInterpolationPoint(-0.5, 0, function () {
  417. return true;
  418. });
  419. expect(point3.datapoint[0]).toEqual(-0.5);
  420. expect(point3.datapoint[1]).toEqual(0.95);
  421. });
  422. it('should return null for empty dataseries', function() {
  423. plot = $.plot(placeholder, [], {});
  424. var item = plot.findNearbyInterpolationPoint(0.5, 0, function() {
  425. return true;
  426. });
  427. expect(item).toEqual(null);
  428. });
  429. it('for a dataserie with a single point should return null', function() {
  430. plot = $.plot(placeholder, [[[1, 2]]], {});
  431. var item = plot.findNearbyInterpolationPoint(0, 0, function() {
  432. return true;
  433. });
  434. expect(item).toEqual(null);
  435. });
  436. it('should return null if below the data bounds', function () {
  437. plot = $.plot(placeholder, [[[-10, 0], [10, 1], [100, 2]]], {});
  438. var item = plot.findNearbyInterpolationPoint(-20, 1, function() {
  439. return true;
  440. });
  441. expect(item).toBe(null);
  442. });
  443. it('should return null if above the data bounds', function () {
  444. plot = $.plot(placeholder, [[[-10, 0], [10, 1], [100, 2]]], {});
  445. var item = plot.findNearbyInterpolationPoint(120, 1, function() {
  446. return true;
  447. });
  448. expect(item).toBe(null);
  449. });
  450. });
  451. describe('setupTickFormatter', function() {
  452. var placeholder, plot, sampledata = [[0, 1], [1, 1.1], [2, 1.2]];
  453. beforeEach(function() {
  454. placeholder = setFixtures('<div id="test-container" style="width: 600px;height: 400px">')
  455. .find('#test-container');
  456. });
  457. it('should set a default tick formatter to each default axis', function () {
  458. plot = $.plot(placeholder, [sampledata], { });
  459. plot.getXAxes().concat(plot.getYAxes()).forEach(function(axis) {
  460. expect(typeof axis.tickFormatter).toBe('function');
  461. });
  462. });
  463. it('should set a default tick formatter to each specified axis', function () {
  464. plot = $.plot(placeholder, [sampledata], {
  465. xaxis: { autoScale: 'exact' },
  466. yaxes: [
  467. { autoScale: 'exact' },
  468. { autoScale: 'none', min: -1, max: 1 }
  469. ]
  470. });
  471. plot.getXAxes().concat(plot.getYAxes()).forEach(function(axis) {
  472. expect(typeof axis.tickFormatter).toBe('function');
  473. });
  474. });
  475. it('should set and use the specified tick formatter', function () {
  476. var formatters = [
  477. jasmine.createSpy('formatter'),
  478. jasmine.createSpy('formatter'),
  479. jasmine.createSpy('formatter')
  480. ];
  481. plot = $.plot(placeholder, [sampledata], {
  482. xaxis: { autoScale: 'exact', tickFormatter: formatters[0] },
  483. yaxes: [
  484. { autoScale: 'exact', tickFormatter: formatters[1] },
  485. { autoScale: 'none', min: -1, max: 1, tickFormatter: formatters[2], show: true }
  486. ]
  487. });
  488. formatters.forEach(function(formatter) {
  489. expect(formatter).toHaveBeenCalled();
  490. });
  491. });
  492. it('should leave the formatter set to the axis unchanged when updating the plot', function () {
  493. var formatter = jasmine.createSpy('formatter');
  494. plot = $.plot(placeholder, [sampledata], { });
  495. // the absolute/relative time plugin is setting the tickFormatter
  496. //directly to the axes just like here:
  497. plot.getXAxes()[0].tickFormatter = formatter;
  498. plot.setData([sampledata, sampledata]);
  499. plot.setupGrid();
  500. plot.draw();
  501. expect(plot.getXAxes()[0].tickFormatter).toBe(formatter);
  502. });
  503. });
  504. describe('computeTickSize', function() {
  505. var placeholder;
  506. var plot;
  507. var sampledata = [[0, 1], [1, 1.1], [2, 1.2]];
  508. beforeEach(function() {
  509. placeholder = setFixtures('<div id="test-container" style="width: 600px;height: 400px">')
  510. .find('#test-container');
  511. });
  512. it('should return the correct size', function () {
  513. plot = $.plot(placeholder, [sampledata], {});
  514. var testVector = [
  515. [1, 10, 10, 1],
  516. [1, 1.01, 10, 0.001],
  517. [0.99963, 0.99964, 5, 0.000002],
  518. [1, 1.1, 5, 0.02],
  519. [0, 10000, 5, 2000],
  520. [0, 10, 4, 2.5],
  521. [0, 750, 10, 100],
  522. [0, 740, 10, 50]
  523. ];
  524. testVector.forEach(function (t) {
  525. var min = t[0],
  526. max = t[1],
  527. ticks = t[2],
  528. expectedValue = t[3],
  529. size = plot.computeTickSize(min, max, ticks);
  530. expect(size).toEqual(expectedValue);
  531. });
  532. });
  533. it('should depend on tickDecimals when specified', function() {
  534. plot = $.plot(placeholder, [sampledata], {});
  535. var testVector = [
  536. [1, 10, 10, 3, 1],
  537. [1, 1.01, 10, 2, 0.01],
  538. [0.99963, 0.99964, 5, 3, 0.001],
  539. [1, 1.1, 5, 1, 0.1],
  540. [0, 10000, 5, 1, 2000],
  541. [1, 1.00000000000001, 10, 5, 0.00001],
  542. [0, 10, 4, 0, 2],
  543. [0, 750, 10, 1, 100],
  544. [0, 740, 10, 10, 50],
  545. [0, 1000, 4, 2, 250]
  546. ];
  547. testVector.forEach(function(t) {
  548. var min = t[0],
  549. max = t[1],
  550. ticks = t[2],
  551. tickDecimals = t[3],
  552. expectedValue = t[4];
  553. var size = plot.computeTickSize(min, max, ticks, tickDecimals);
  554. expect(size).toEqual(expectedValue);
  555. });
  556. });
  557. });
  558. describe('defaultTickGenerator', function() {
  559. var placeholder;
  560. beforeEach(function() {
  561. placeholder = setFixtures('<div id="test-container" style="width: 600px;height: 400px">')
  562. .find('#test-container');
  563. });
  564. it('works for the maximum axis interval', function () {
  565. var plot = $.plot(placeholder, [[[0, -Number.MAX_VALUE], [1, Number.MAX_VALUE]]], {});
  566. var yaxis = plot.getYAxes()[0];
  567. expect(yaxis.ticks).not.toEqual([]);
  568. });
  569. });
  570. describe('drawAxisLabels', function() {
  571. var placeholder, sampledata = [[1.1e18, 0.1], [1.2e18, 5.1], [1.3e18, 10.1]];
  572. beforeEach(function() {
  573. placeholder = setFixtures('<div id="test-container" style="width: 600px;height: 400px">')
  574. .find('#test-container');
  575. });
  576. it('should draw no tick labels when showTickLabels = none', function () {
  577. $.plot(placeholder, [sampledata], {
  578. xaxis: {
  579. autoScale: 'loose',
  580. showTickLabels: 'none'
  581. }
  582. });
  583. var tickLabels = xTickLabels(placeholder);
  584. expect(tickLabels.length).toBe(0);
  585. });
  586. it('should draw two tick labels when showTickLabels = endpoints', function () {
  587. $.plot(placeholder, [sampledata], {
  588. xaxis: {
  589. autoScale: 'loose',
  590. showTickLabels: 'endpoints'
  591. }
  592. });
  593. var tickLabels = xTickLabels(placeholder);
  594. expect(tickLabels.length).toBe(2);
  595. });
  596. it('should draw multiple tick labels when showTickLabels = all', function () {
  597. $.plot(placeholder, [sampledata], {
  598. xaxis: {
  599. autoScale: 'loose',
  600. showTickLabels: 'all'
  601. }
  602. });
  603. var tickLabels = xTickLabels(placeholder);
  604. expect(tickLabels.length).toBeGreaterThan(2);
  605. });
  606. ['major', 'endpoints', 'all'].forEach(function(showTickLabels) {
  607. it('should not overlap the tick labels when the values are large and showTickLabels = ' + showTickLabels, function () {
  608. $.plot(placeholder, [sampledata], {
  609. xaxis: {
  610. autoScale: 'exact',
  611. showTickLabels: showTickLabels
  612. }
  613. });
  614. var tickLabelBoxes = xTickLabelBoxes(placeholder),
  615. overlaps = tickLabelBoxes.some(function(b1) {
  616. return tickLabelBoxes.some(function(b2) {
  617. return b1 !== b2 && overlapping(b1, b2);
  618. });
  619. });
  620. expect(overlaps).toBe(false);
  621. });
  622. });
  623. function xTickLabels(placeholder) {
  624. var labels$ = placeholder.find('.flot-x-axis').find('.flot-tick-label'),
  625. labels = labels$.map(function(i, label) {
  626. return label.textContent;
  627. }).get();
  628. return labels;
  629. }
  630. function xTickLabelBoxes(placeholder) {
  631. var labels$ = placeholder.find('.flot-x-axis').find('.flot-tick-label'),
  632. boxes = labels$.map(function(i, label) {
  633. var label$ = $(label),
  634. pos = label$.position();
  635. return {
  636. x1: pos.left, y1: pos.top, x2: label$.outerWidth() + pos.left, y2: label$.outerHeight() + pos.top
  637. };
  638. }).get();
  639. return boxes;
  640. }
  641. overlapping = function(b1, b2) {
  642. return (b1.x1 <= b2.x1 && b2.x1 <= b1.x2) || (b2.x1 <= b1.x1 && b1.x1 <= b2.x2);
  643. }
  644. describe('for bars', function() {
  645. it('should not show x axis endpoints for bars with showTickLabels = all', function() {
  646. var plot = $.plot(placeholder, [[[-3, 1], [30, 15], [20, 7], [5, 2]]], {
  647. xaxis: {
  648. autoScale: 'exact',
  649. showTickLabels: 'all'
  650. },
  651. yaxis: {
  652. autoScale: 'exact',
  653. showTickLabels: 'all'
  654. },
  655. series: {
  656. bars: {
  657. lineWidth: 1,
  658. show: true,
  659. fillColor: 'blue',
  660. barWidth: 0.8
  661. }
  662. }
  663. });
  664. var xaxis = plot.getXAxes()[0],
  665. yaxis = plot.getYAxes()[0],
  666. ticks = xaxis.ticks;
  667. expect(xaxis.min).not.toEqual(ticks[0].v);
  668. expect(xaxis.max).not.toEqual(ticks[ticks.length - 1].v);
  669. ticks = yaxis.ticks;
  670. expect(yaxis.min).toEqual(ticks[0].v);
  671. expect(yaxis.max).toEqual(ticks[ticks.length - 1].v);
  672. });
  673. it('should show endpoints for multiple series type where showTickLabels = all', function() {
  674. var plot = $.plot(placeholder, [{
  675. data: [[-3, 2], [20, 15], [4, 5]],
  676. lines: { show: true, fill: true }
  677. }, {
  678. data: [[-3, 1], [30, 15], [20, 7], [5, 2]],
  679. bars: { show: true }
  680. }, {
  681. data: [[-1, 1], [30, 10], [20, 7], [6, 3]],
  682. points: { show: true }
  683. }], {
  684. xaxis: {
  685. autoScale: 'exact',
  686. showTickLabels: 'all'
  687. }});
  688. var xaxis = plot.getXAxes()[0],
  689. ticks = xaxis.ticks;
  690. expect(xaxis.min).toEqual(ticks[0].v);
  691. expect(xaxis.max).toEqual(ticks[ticks.length - 1].v);
  692. });
  693. });
  694. });
  695. describe('decimation', function () {
  696. var placeholder;
  697. beforeEach(function() {
  698. placeholder = setFixtures('<div id="test-container" style="width: 600px;height: 400px">')
  699. .find('#test-container');
  700. });
  701. it('calls the "decimate" function of data series when the plot type is line', function () {
  702. var expected = [1, 2, 3, 3];
  703. var decimate = jasmine.createSpy('decimate').and.returnValue(expected);
  704. var data = [{data: [], decimate: decimate}];
  705. $.plot(placeholder, data, {series: {lines: {show: true}}});
  706. expect(decimate).toHaveBeenCalled();
  707. });
  708. it('calls the "decimatePoints" function of data series when the plot type is points', function () {
  709. var expected = [1, 2, 3, 3];
  710. var decimatePoints = jasmine.createSpy('decimate').and.returnValue(expected);
  711. var data = [{data: [], decimatePoints: decimatePoints}];
  712. $.plot(placeholder, data, {series: {lines: {show: false}, points: {show: true}}});
  713. expect(decimatePoints).toHaveBeenCalled();
  714. });
  715. it('calls the "decimate" function of data series when the plot type is bars', function () {
  716. var expected = [1, 2, 3, 3];
  717. var decimateBars = jasmine.createSpy('decimate').and.returnValue(expected);
  718. var data = [{data: [], decimate: decimateBars}];
  719. $.plot(placeholder, data, {series: {lines: {show: false}, bars: {show: true}}});
  720. expect(decimateBars).toHaveBeenCalled();
  721. });
  722. });
  723. describe('setData', function () {
  724. var placeholder;
  725. var data = [[[1, 2], [3, 4]]];
  726. beforeEach(function() {
  727. placeholder = setFixtures('<div id="test-container" style="width: 600px;height: 400px">')
  728. .find('#test-container');
  729. });
  730. it('stores data in the internal buffer', function () {
  731. var expected = [1, 2, 3, 4];
  732. var plot = $.plot(placeholder, [], {});
  733. plot.setData(data);
  734. var series = plot.getData();
  735. expect(series.length).toEqual(1);
  736. expect(series[0].data).toEqual(data[0]);
  737. expect(series[0].datapoints.points).toEqual(expected);
  738. expect(series[0].datapoints.pointsize).toEqual(2);
  739. });
  740. it('reuses the internal buffer', function () {
  741. var plot = $.plot(placeholder, [[]], {});
  742. var buffer = plot.getData()[0].datapoints.points;
  743. plot.setData(data);
  744. expect(plot.getData()[0].datapoints.points).toBe(buffer);
  745. });
  746. it('expands the internal buffer as neccessary', function () {
  747. var plot = $.plot(placeholder, [[[3, 4]]], {});
  748. expect(plot.getData()[0].datapoints.points.length).toBe(2);
  749. plot.setData(data);
  750. expect(plot.getData()[0].datapoints.points.length).toBe(4);
  751. });
  752. it('shrinks the internal buffer as neccessary', function () {
  753. var plot = $.plot(placeholder, [[[3, 4], [5, 6], [6, 7], [8, 9]]], {});
  754. expect(plot.getData()[0].datapoints.points.length).toBe(8);
  755. plot.setData(data);
  756. expect(plot.getData()[0].datapoints.points.length).toBe(4);
  757. });
  758. });
  759. describe('draw axis', function() {
  760. var placeholder;
  761. beforeEach(function() {
  762. placeholder = setFixtures('<div id="test-container" style="width: 600px;height: 400px">')
  763. .find('#test-container');
  764. });
  765. ['left', 'right'].forEach(function(axisPosition) {
  766. it('should draw ' + axisPosition + ' y axis next to plot', function() {
  767. var testVector = [
  768. [200000000000, 4000000000000],
  769. [200000000000000, 400000000000000],
  770. [20000000000000000, 40000000000000000],
  771. [200000000000000000, 400000000000000000],
  772. [2000000000000000000, 4000000000000000000],
  773. [200000000000000000000, 400000000000000000000],
  774. [20000000000000000000000, 40000000000000000000000]];
  775. testVector.forEach(function (testValue) {
  776. var plot = $.plot(placeholder, [[1, 2, 3]], {
  777. xaxis: {
  778. autoScale: 'none',
  779. min: testValue[0],
  780. max: testValue[1],
  781. showTickLabels: 'all'
  782. },
  783. yaxis: {
  784. position: axisPosition
  785. }});
  786. var yaxis = plot.getYAxes()[0];
  787. if (axisPosition === 'left') {
  788. expect(yaxis.box.left + yaxis.box.width).toBeCloseTo(plot.getPlotOffset().left, -1);
  789. } else {
  790. expect(yaxis.box.left).toBeCloseTo(plot.getPlotOffset().left + plot.width(), -1);
  791. }
  792. });
  793. });
  794. });
  795. ['top', 'bottom'].forEach(function(axisPosition) {
  796. it('should draw ' + axisPosition + ' x axis next to plot', function() {
  797. var testVector = [20, 28, 36, 44, 52, 60, 68, 76, 84];
  798. testVector.forEach(function (fontSize) {
  799. var plot = $.plot(placeholder, [[1, 2, 3]], {
  800. xaxis: {
  801. position: axisPosition
  802. },
  803. yaxis: {
  804. font: {
  805. size: fontSize
  806. }
  807. }});
  808. var xaxis = plot.getXAxes()[0];
  809. if (axisPosition === 'top') {
  810. expect(xaxis.box.top + xaxis.box.height).toBeCloseTo(plot.getPlotOffset().top, -1);
  811. } else {
  812. expect(xaxis.box.top).toBeCloseTo(plot.getPlotOffset().top + plot.height(), -1);
  813. }
  814. });
  815. });
  816. });
  817. it('should draw y axis next to plot for multiple axis on the same side', function() {
  818. var testVector = [
  819. [200000000000, 4000000000000],
  820. [200000000000000, 400000000000000],
  821. [20000000000000000, 40000000000000000],
  822. [200000000000000000, 400000000000000000],
  823. [2000000000000000000, 4000000000000000000],
  824. [200000000000000000000, 400000000000000000000],
  825. [20000000000000000000000, 40000000000000000000000]];
  826. testVector.forEach(function (testValue) {
  827. var plot = $.plot(placeholder, [[1, 2, 3]], {
  828. xaxis: {
  829. autoScale: 'none',
  830. min: testValue[0],
  831. max: testValue[1],
  832. showTickLabels: 'all',
  833. font: {
  834. size: 48
  835. }
  836. },
  837. yaxes: [{
  838. position: 'left',
  839. show: true
  840. }, {
  841. position: 'left',
  842. show: true
  843. }, {
  844. position: 'left',
  845. show: true
  846. }]});
  847. var yaxis = plot.getYAxes()[0];
  848. expect(yaxis.box.left + yaxis.box.width).toBeCloseTo(plot.getPlotOffset().left, -1);
  849. });
  850. });
  851. });
  852. describe('Grid margin', function() {
  853. var placeholder, placeholder2, fixtures;
  854. beforeEach(function() {
  855. fixtures = setFixtures('<div id="test-container" style="width: 600px;height: 400px"/>' +
  856. '<div id="test-container2" style="width: 600px;height: 400px"/>');
  857. placeholder = fixtures.find('#test-container');
  858. placeholder2 = fixtures.find('#test-container2');
  859. });
  860. it('should change plot dimensions', function() {
  861. var testVector = [
  862. [-20, 0, 0, 0],
  863. [20, 0, 0, 0],
  864. [20, -20, 0, 0],
  865. [-20, -20, 0, 0],
  866. [-20, 20, 0, 0],
  867. [20, 20, 0, 0],
  868. [0, 0, -20, 0],
  869. [0, 0, 20, 0],
  870. [0, 0, -20, 20],
  871. [0, 0, -20, -20],
  872. [0, 0, 20, 20],
  873. [0, 0, 20, -20],
  874. [20, 20, 20, 20],
  875. [-20, -20, -20, -20]
  876. ];
  877. testVector.forEach(function (testValue) {
  878. var plot1 = $.plot(placeholder, [[]], {}),
  879. plot2 = $.plot(placeholder2, [[]], {
  880. grid: { margin: {
  881. left: testValue[0],
  882. right: testValue[1],
  883. top: testValue[2],
  884. bottom: testValue[3]
  885. }}});
  886. expect(plot2.width()).toBe(plot1.width() - testValue[0] - testValue[1]);
  887. expect(plot2.height()).toBe(plot1.height() - testValue[2] - testValue[3]);
  888. });
  889. });
  890. it('should move the axis according to grid margin', function() {
  891. var testVector = [
  892. [-20, 0, 0, 0],
  893. [20, 0, 0, 0],
  894. [20, -20, 0, 0],
  895. [-20, -20, 0, 0],
  896. [-20, 20, 0, 0],
  897. [20, 20, 0, 0],
  898. [0, 0, -20, 0],
  899. [0, 0, 20, 0],
  900. [0, 0, -20, 20],
  901. [0, 0, -20, -20],
  902. [0, 0, 20, 20],
  903. [0, 0, 20, -20],
  904. [20, 20, 20, 20],
  905. [-20, -20, -20, -20]
  906. ];
  907. testVector.forEach(function (testValue) {
  908. var plot1 = $.plot(placeholder, [[]], {
  909. xaxes: [{
  910. position: 'bottom',
  911. show: true
  912. }, {
  913. position: 'top',
  914. show: true
  915. }],
  916. yaxes: [{
  917. position: 'left',
  918. show: true
  919. }, {
  920. position: 'right',
  921. show: true
  922. }]
  923. }),
  924. plot2 = $.plot(placeholder2, [[]], {
  925. xaxes: [{
  926. position: 'bottom',
  927. show: true
  928. }, {
  929. position: 'top',
  930. show: true
  931. }],
  932. yaxes: [{
  933. position: 'left',
  934. show: true
  935. }, {
  936. position: 'right',
  937. show: true
  938. }],
  939. grid: { margin: {
  940. left: testValue[0],
  941. right: testValue[1],
  942. top: testValue[2],
  943. bottom: testValue[3]
  944. }}});
  945. var yaxis1 = plot1.getYAxes()[0],
  946. yaxis2 = plot2.getYAxes()[0];
  947. expect(yaxis1.box.left + testValue[0]).toEqual(yaxis2.box.left);
  948. yaxis1 = plot1.getYAxes()[1];
  949. yaxis2 = plot2.getYAxes()[1];
  950. expect(yaxis1.box.left - testValue[1]).toEqual(yaxis2.box.left);
  951. var xaxis1 = plot1.getXAxes()[0],
  952. xaxis2 = plot2.getXAxes()[0];
  953. expect(xaxis1.box.top - testValue[3]).toEqual(xaxis2.box.top);
  954. xaxis1 = plot1.getXAxes()[1];
  955. xaxis2 = plot2.getXAxes()[1];
  956. expect(xaxis1.box.top + testValue[2]).toEqual(xaxis2.box.top);
  957. });
  958. });
  959. it('should work for margin: number', function() {
  960. var plot1 = $.plot(placeholder, [[]], {}),
  961. plot2 = $.plot(placeholder2, [[]], {
  962. grid: { margin: 20 }
  963. });
  964. expect(plot2.width()).toBe(plot1.width() - 20 - 20);
  965. expect(plot2.height()).toBe(plot1.height() - 20 - 20);
  966. });
  967. });
  968. });