req_gatling-png--306285301.html 38 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <link rel="shortcut icon" type="image/x-icon" href="style/favicon.ico"/>
  6. <link href="style/style.css" rel="stylesheet" type="text/css" />
  7. <link href="style/bootstrap.min.css" rel="stylesheet" type="text/css" />
  8. <script src="js/jquery-3.5.1.min.js"></script>
  9. <script src="js/bootstrap.min.js"></script>
  10. <script src="js/gatling.js"></script>
  11. <script src="js/menu.js"></script>
  12. <script src="js/ellipsis.js"></script>
  13. <script src="js/all_sessions.js"></script>
  14. <script src="js/stats.js"></script>
  15. <script src="js/highstock.js"></script>
  16. <script src="js/highcharts-more.js"></script>
  17. <script src="js/theme.js"></script>
  18. <script src="js/unpack.js"></script>
  19. <title>Gatling Stats - gatling.png</title>
  20. </head>
  21. <body>
  22. <script>
  23. const storedTheme = localStorage.getItem('theme') || (window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light");
  24. if (storedTheme) document.documentElement.setAttribute('data-theme', storedTheme)
  25. function toggleTheme() {
  26. const currentTheme = document.documentElement.getAttribute("data-theme");
  27. const targetTheme = currentTheme === "light" ? "dark" : "light";
  28. document.documentElement.setAttribute('data-theme', targetTheme)
  29. localStorage.setItem('theme', targetTheme);
  30. };
  31. </script>
  32. <div class="app-container">
  33. <div class="frise"></div>
  34. <div class="head">
  35. <div class="gatling-open-source">
  36. <a class="gatling-logo gatling-logo-light" href="https://gatling.io" target="blank_" title="Gatling Home Page"><img alt="Gatling" src="style/logo-light.svg"/></a>
  37. <a class="gatling-logo gatling-logo-dark" href="https://gatling.io" target="blank_" title="Gatling Home Page"><img alt="Gatling" src="style/logo-dark.svg"/></a>
  38. <a class="gatling-documentation" href="https://gatling.io/docs/" target="_blank">Documentation</a>
  39. </div>
  40. <div class="nav spacer"></div>
  41. <a class="enterprise" href="https://gatling.io/enterprise/next-step/" target="_blank"><strong>Try</strong>
  42. <img class="logo-enterprise-light" alt="Gatling Enterprise" src="style/logo-enterprise-light.svg"/>
  43. <img class="logo-enterprise-dark" alt="Gatling Enterprise" src="style/logo-enterprise-dark.svg"/>
  44. </a>
  45. <button id="theme-toggle" class="theme-toggle" type="button" onclick="toggleTheme()" aria-label="Toggle user interface mode">
  46. <span class="toggle-dark"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-moon"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path></svg></span>
  47. <span class="toggle-light"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-sun"><circle cx="12" cy="12" r="5"></circle><line x1="12" y1="1" x2="12" y2="3"></line><line x1="12" y1="21" x2="12" y2="23"></line><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line><line x1="1" y1="12" x2="3" y2="12"></line><line x1="21" y1="12" x2="23" y2="12"></line><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line></svg></span>
  48. </button>
  49. </div>
  50. <div class="container details">
  51. <div class="nav">
  52. <ul></ul>
  53. </div>
  54. <div class="cadre">
  55. <div class="content">
  56. <div class="content-header">
  57. <div class="onglet">
  58. ProductsPageSimulation
  59. </div>
  60. <div class="sous-menu" id="sousMenu">
  61. <div class="sous-menu-spacer">
  62. <div class="item "><a href="index.html">Global</a></div>
  63. <div class="item ouvert"><a id="details_link" href="#">Details</a></div>
  64. </div>
  65. </div>
  66. </div>
  67. <div class="content-in">
  68. <div class="container-article">
  69. <div class="article">
  70. <div class="schema-container">
  71. <div id="ranges" class="schema ranges-large">
  72. </div>
  73. <div class="infos">
  74. <div class="infos-in">
  75. <div class="infos-title">Stats</div>
  76. <div class="info">
  77. <h2 class="first">Executions</h2>
  78. <table>
  79. <thead>
  80. <tr><th></th><th>Total</th><th>OK</th><th>KO</th></tr>
  81. </thead>
  82. <tbody>
  83. <tr>
  84. <td class="title">Total count</td>
  85. <td id="numberOfRequests" class="total"></td>
  86. <td id="numberOfRequestsOK" class="ok"></td>
  87. <td id="numberOfRequestsKO" class="ko"></td>
  88. </tr>
  89. <tr>
  90. <td class="title">Mean count/s</abbr></td>
  91. <td id="meanNumberOfRequestsPerSecond" class="total"></td>
  92. <td id="meanNumberOfRequestsPerSecondOK" class="ok"></td>
  93. <td id="meanNumberOfRequestsPerSecondKO" class="ko"></td>
  94. </tr>
  95. </tbody>
  96. </table>
  97. <h2 class="second">Response Time (ms)</h2>
  98. <table>
  99. <thead>
  100. <tr>
  101. <th></th>
  102. <th>Total</th>
  103. <th>OK</th>
  104. <th>KO</th>
  105. </tr>
  106. </thead>
  107. <tbody>
  108. <tr>
  109. <td class="title">Min</td>
  110. <td id="minResponseTime" class="total"></td>
  111. <td id="minResponseTimeOK" class="ok"></td>
  112. <td id="minResponseTimeKO" class="ko"></td>
  113. </tr>
  114. <tr>
  115. <td class="title">50th percentile</td>
  116. <td id="percentiles1" class="total"></td>
  117. <td id="percentiles1OK" class="ok"></td>
  118. <td id="percentiles1KO" class="ko"></td>
  119. </tr>
  120. <tr>
  121. <td class="title">75th percentile</td>
  122. <td id="percentiles2" class="total"></td>
  123. <td id="percentiles2OK" class="ok"></td>
  124. <td id="percentiles2KO" class="ko"></td>
  125. </tr>
  126. <tr>
  127. <td class="title">95th percentile</td>
  128. <td id="percentiles3" class="total"></td>
  129. <td id="percentiles3OK" class="ok"></td>
  130. <td id="percentiles3KO" class="ko"></td>
  131. </tr>
  132. <tr>
  133. <td class="title">99th percentile</td>
  134. <td id="percentiles4" class="total"></td>
  135. <td id="percentiles4OK" class="ok"></td>
  136. <td id="percentiles4KO" class="ko"></td>
  137. </tr>
  138. <tr>
  139. <td class="title">Max</td>
  140. <td id="maxResponseTime" class="total"></td>
  141. <td id="maxResponseTimeOK" class="ok"></td>
  142. <td id="maxResponseTimeKO" class="ko"></td>
  143. </tr>
  144. <tr>
  145. <td class="title">Mean</td>
  146. <td id="meanResponseTime" class="total"></td>
  147. <td id="meanResponseTimeOK" class="ok"></td>
  148. <td id="meanResponseTimeKO" class="ko"></td>
  149. </tr>
  150. <tr>
  151. <td class="title">Standard Deviation</td>
  152. <td id="standardDeviation" class="total"></td>
  153. <td id="standardDeviationOK" class="ok"></td>
  154. <td id="standardDeviationKO" class="ko"></td>
  155. </tr>
  156. </tbody>
  157. </table>
  158. </div>
  159. </div>
  160. </div>
  161. </div>
  162. <div class="statistics extensible-geant collapsed">
  163. <div class="title">
  164. Errors
  165. </div>
  166. <table id="container_errors" class="statistics-in extensible-geant">
  167. <thead>
  168. <tr>
  169. <th id="error-col-1" class="header sortable"><span>Error</span></th>
  170. <th id="error-col-2" class="header sortable"><span>Count</span></th>
  171. <th id="error-col-3" class="header sortable"><span>Percentage</span></th>
  172. </tr>
  173. </thead>
  174. <tbody>
  175. <tr>
  176. <td class="error-col-1 total ko">Request timeout to ecomm.gatling.io/18.164.246.48:443 after 60000 ms<span class="value" style="display:none">0</span></td>
  177. <td class="value error-col-2 total ko">106</td>
  178. <td class="value error-col-3 total ko">27.97%</td>
  179. </tr>
  180. <tr>
  181. <td class="error-col-1 total ko">Request timeout to ecomm.gatling.io/18.164.246.56:443 after 60000 ms<span class="value" style="display:none">1</span></td>
  182. <td class="value error-col-2 total ko">100</td>
  183. <td class="value error-col-3 total ko">26.39%</td>
  184. </tr>
  185. <tr>
  186. <td class="error-col-1 total ko">Request timeout to ecomm.gatling.io/18.164.246.108:443 after 60000 ms<span class="value" style="display:none">2</span></td>
  187. <td class="value error-col-2 total ko">87</td>
  188. <td class="value error-col-3 total ko">22.96%</td>
  189. </tr>
  190. <tr>
  191. <td class="error-col-1 total ko">Request timeout to ecomm.gatling.io/18.164.246.111:443 after 60000 ms<span class="value" style="display:none">3</span></td>
  192. <td class="value error-col-2 total ko">86</td>
  193. <td class="value error-col-3 total ko">22.69%</td>
  194. </tr>
  195. </tbody>
  196. </table>
  197. </div>
  198. <div class="schema geant">
  199. <div id="responsetimeDistributionContainer" class="geant"></div>
  200. </div>
  201. <div class="schema geant">
  202. <div id="responsetimepercentilesovertimeokPercentilesContainer" class="geant"></div>
  203. </div>
  204. <div class="schema geant">
  205. <div id="requests" class="geant"></div>
  206. </div>
  207. <div class="schema geant">
  208. <div id="responses" class="geant"></div>
  209. </div>
  210. <div class="schema geant">
  211. <div id="container_response_time_dispersion" class="geant"></div>
  212. </div>
  213. </div>
  214. </div>
  215. </div>
  216. </div>
  217. </div>
  218. </div>
  219. <script>
  220. var pageStats = stats.contents['req_gatling-png--306285301'].stats;
  221. $(document).ready(function() {
  222. $('.simulation-tooltip').popover({trigger:'hover', placement:'left'});
  223. setDetailsLinkUrl();
  224. setDetailsMenu();
  225. setActiveMenu();
  226. fillStats(pageStats);
  227. Highcharts.setOptions({
  228. global: { useUTC: false }
  229. });
  230. var rangesChart = new Highcharts.Chart({
  231. chart: {
  232. renderTo: 'ranges',
  233. marginRight: 100
  234. },
  235. credits: { enabled: false },
  236. legend: { enabled: false },
  237. title: { text: 'A title to let highcharts reserve the place for the title set later' },
  238. xAxis: {
  239. categories: [
  240. pageStats.group1.htmlName,
  241. pageStats.group2.htmlName,
  242. pageStats.group3.htmlName,
  243. pageStats.group4.htmlName
  244. ]
  245. },
  246. yAxis: {
  247. title: { text: 'Number of Requests' },
  248. reversedStacks: false
  249. },
  250. tooltip: {
  251. formatter: function() {
  252. var s;
  253. if (this.point.name) { // the pie chart
  254. s = ''+ this.point.name +': '+ this.y +'% requests';
  255. } else {
  256. s = ''+ this.y + ' requests';
  257. }
  258. return s;
  259. }
  260. },
  261. plotOptions: {
  262. series: {
  263. stacking: 'normal',
  264. shadow: true
  265. }
  266. },
  267. series: [
  268. {
  269. type: 'column',
  270. data: [{
  271. color: '#68b65c',
  272. y: pageStats.group1.count
  273. },
  274. {
  275. color: '#FFDD00',
  276. y: pageStats.group2.count
  277. },
  278. {
  279. color: '#FFA900',
  280. y: pageStats.group3.count
  281. },
  282. {
  283. color: '#f15b4f',
  284. y: pageStats.group4.count
  285. }]
  286. },
  287. {
  288. type: 'pie',
  289. name: 'Percentages',
  290. data: [
  291. {
  292. name: pageStats.group1.name,
  293. y: pageStats.group1.percentage,
  294. color: '#68b65c'
  295. },
  296. {
  297. name: pageStats.group2.name,
  298. y: pageStats.group2.percentage,
  299. color: '#FFDD00'
  300. },
  301. {
  302. name: pageStats.group3.name,
  303. y: pageStats.group3.percentage,
  304. color: '#FFA900'
  305. },
  306. {
  307. name: pageStats.group4.name,
  308. y: pageStats.group4.percentage,
  309. color: '#f15b4f'
  310. }
  311. ],
  312. center: [368, 0],
  313. size: 90,
  314. showInLegend: false,
  315. dataLabels: { enabled: false }
  316. }
  317. ]
  318. });
  319. rangesChart.setTitle({
  320. text: '<span class="chart_title">Response Time Ranges</span>',
  321. useHTML: true
  322. });
  323. $('#container_errors').sortable('#container_errors');
  324. var responsetimeDistributionChart = new Highcharts.Chart({
  325. chart: {
  326. renderTo: 'responsetimeDistributionContainer',
  327. type: 'column',
  328. marginBottom: 60
  329. },
  330. credits: { enabled: false },
  331. legend: {
  332. enabled: true,
  333. floating: true,
  334. y: 5,
  335. borderWidth: 0,
  336. itemStyle: { fontWeight: "normal" },
  337. symbolRadius: 0
  338. },
  339. title: { text: 'A title to let highcharts reserve the place for the title set later' },
  340. navigator: {
  341. maskInside: false
  342. },
  343. xAxis: {
  344. categories: ['437', '1036', '1635', '2234', '2833', '3432', '4031', '4630', '5228', '5827', '6426', '7025', '7624', '8223', '8822', '9421', '10020', '10618', '11217', '11816', '12415', '13014', '13613', '14212', '14811', '15409', '16008', '16607', '17206', '17805', '18404', '19003', '19602', '20200', '20799', '21398', '21997', '22596', '23195', '23794', '24393', '24992', '25590', '26189', '26788', '27387', '27986', '28585', '29184', '29783', '30381', '30980', '31579', '32178', '32777', '33376', '33975', '34574', '35172', '35771', '36370', '36969', '37568', '38167', '38766', '39365', '39964', '40562', '41161', '41760', '42359', '42958', '43557', '44156', '44755', '45353', '45952', '46551', '47150', '47749', '48348', '48947', '49546', '50144', '50743', '51342', '51941', '52540', '53139', '53738', '54337', '54936', '55534', '56133', '56732', '57331', '57930', '58529', '59128', '59727'],
  345. tickInterval: 20
  346. },
  347. yAxis: {
  348. min: 0,
  349. title: { text: 'Percentage of Requests' },
  350. reversedStacks: false
  351. },
  352. tooltip: {
  353. formatter: function() {
  354. return '<b>'+ this.x +' ms</b><br/>'+
  355. this.series.name +': '+ this.y +' %<br/>'+
  356. 'Total: '+ this.point.stackTotal + ' %';
  357. }
  358. },
  359. plotOptions: {
  360. series: {
  361. groupPadding: 0,
  362. stacking: 'normal',
  363. shadow: true
  364. }
  365. },
  366. series: [
  367. {
  368. type: 'column',
  369. color: '#68b65c',
  370. name: 'OK',
  371. data: [
  372. 7.77,10.38,12.63,12.3,8.19,5.66,7.83,3.9,1.15,2.85,2.38,1.7,0.93,0.34,0.4,0.36,0.4,0.2,0.18,0.18,0.44,0.56,0.48,0.46,0.3,0.28,0.32,0.56,0.4,0.3,0.28,0.14,0.12,0.2,0.16,0.24,0.12,0.16,0.26,0.24,0.34,0.36,0.3,0.18,0.32,0.12,0.14,0.12,0.16,0.08,0.04,0.06,0.02,0.02,0.06,0.2,0.04,0.04,0.0,0.02,0.06,0.04,0.02,0.04,0.04,0.02,0.02,0.02,0.02,0.06,0.0,0.0,0.02,0.06,0.04,0.02,0.04,0.08,0.02,0.06,0.02,0.14,0.16,0.12,0.1,0.28,0.26,0.12,0.14,0.2,0.26,0.1,0.12,0.14,0.16,0.02,0.06,0.2,0.3,0.14
  373. ],
  374. tooltip: { yDecimals: 0, ySuffix: 'ms' }
  375. },
  376. {
  377. type: 'column',
  378. color: '#f15b4f',
  379. name: 'KO',
  380. data: [
  381. 0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,7.67
  382. ],
  383. tooltip: { yDecimals: 0, ySuffix: 'ms' }
  384. }
  385. ]
  386. });
  387. responsetimeDistributionChart.setTitle({
  388. text: '<span class="chart_title">Response Time Distribution</span>',
  389. useHTML: true
  390. });
  391. var responsetimepercentilesovertimeokPercentiles = unpack([[1744913838,null],[1744913839,null],[1744913840,[896,2605,2912,6429,6435,6549,6563,6576,6836,6836]],[1744913841,[1934,2771,4096,4210,4221,4234,4243,6222,6298,6301]],[1744913842,null],[1744913843,[3441,3901,4238,4576,4586,4596,4628,4647,4768,4768]],[1744913844,null],[1744913845,[4028,5400,5563,5578,5580,5581,5614,5615,5615,5615]],[1744913846,[3011,3210,4370,4552,4641,4649,4697,4756,5394,5397]],[1744913847,[1988,3425,3867,5775,5778,5783,5796,5997,6027,6028]],[1744913848,[1955,1964,2036,2779,2787,2895,2922,2931,2932,2932]],[1744913849,[1117,1709,2304,5793,6884,9419,17236,25858,55626,59754]],[1744913850,[510,1162,1714,3245,5550,6771,13712,25553,58779,59297]],[1744913851,[432,1740,1952,3853,5402,6962,16639,26380,58580,59592]],[1744913852,[221,1189,3925,12270,17223,20028,27987,52010,59259,59767]],[1744913853,[986,2736,4399,16106,18677,25342,41948,53320,58970,59452]],[1744913854,[289,2066,2780,7102,12672,17382,23195,48882,55244,59839]],[1744913855,[138,490,1075,1963,1999,2527,4812,6447,54199,54199]],[1744913856,[308,369,591,1882,1894,2701,3631,4151,6356,6356]],[1744913857,[192,605,1726,3829,6957,12402,15330,29275,59570,59570]],[1744913858,[356,1162,1953,3269,4283,6855,7580,27924,54684,54684]],[1744913859,[456,924,2234,3804,5282,7364,8868,15638,54411,54411]],[1744913860,[318,999,1919,4701,6373,9181,9805,14541,54193,54193]],[1744913861,[308,1011,1411,3522,4225,5277,6743,13299,44654,44654]],[1744913862,[276,944,1411,3884,5480,7123,7540,15252,58356,58356]],[1744913863,[285,639,1114,2352,2503,2706,3845,14695,26891,26891]],[1744913864,[297,729,1182,2009,2617,3394,3834,8599,52973,52973]],[1744913865,[326,470,1072,1380,1991,2080,3613,4305,6452,6452]],[1744913866,[287,547,976,1737,2128,3140,3729,14159,48153,48153]],[1744913867,[166,591,1097,2249,2450,2755,3778,9230,13443,13443]],[1744913868,[193,1195,1500,1804,1827,2170,3590,11929,24604,24604]],[1744913869,[162,586,930,1336,1781,2127,2136,4455,4455,4455]],[1744913870,[179,599,1033,1315,1842,3209,3834,6519,14352,14352]],[1744913871,[429,610,1000,1364,1857,3281,3771,3791,4298,4298]],[1744913872,[302,577,1189,1931,2045,2226,3526,4272,30170,30170]],[1744913873,[279,585,1047,2057,2099,2198,2250,4028,7170,7170]],[1744913874,[175,381,732,1137,1217,1459,1784,2224,29800,29800]],[1744913875,[182,465,673,1198,1336,2108,2184,4019,4757,4757]],[1744913876,[182,422,473,763,876,1441,2519,2530,3733,3733]],[1744913877,[178,443,606,1144,1222,2033,3266,7113,29679,29679]],[1744913878,[287,452,865,1463,2663,3589,7119,7607,14547,14547]],[1744913879,[340,972,1703,7510,8842,27529,28694,29322,29344,29344]],[1744913880,[470,872,2450,27039,27323,27595,28490,28633,28633,28633]],[1744913881,[433,1302,2478,5634,7823,14401,26640,29958,29958,29958]],[1744913882,[586,1023,2080,2347,2715,2715,4093,28956,28956,28956]],[1744913883,[437,747,1303,2553,9802,9802,28049,28049,28049,28049]],[1744913884,[596,1167,1752,3513,3513,4030,4030,27221,27221,27221]],[1744913885,[472,472,1281,7134,7134,7134,7134,7134,7134,7134]],[1744913886,[1187,1280,2438,3920,9577,9577,9577,9577,9577,9577]],[1744913887,[593,593,8059,8059,8059,8059,8059,8059,8059,8059]],[1744913888,[1097,1097,29264,29264,29264,29264,29264,29264,29264,29264]],[1744913889,[15393,15393,15393,15393,15393,15393,15393,15393,15393,15393]],[1744913890,[14291,14291,14291,14291,14291,14291,14291,14291,14291,14291]],[1744913891,[1311,1311,1311,1311,1311,1311,1311,1311,1311,1311]],[1744913892,null],[1744913893,null],[1744913894,null],[1744913895,null],[1744913896,[3998,3998,3998,3998,3998,3998,3998,3998,3998,3998]],[1744913897,[7928,7928,7928,7928,7928,7928,7928,7928,7928,7928]],[1744913898,[6116,6116,6116,6116,6116,6116,6116,6116,6116,6116]],[1744913899,null],[1744913900,[2785,2785,2785,2785,2785,2785,2785,2785,2785,2785]],[1744913901,null],[1744913902,null],[1744913903,null],[1744913904,null],[1744913905,null],[1744913906,null],[1744913907,null],[1744913908,null],[1744913909,null],[1744913910,null],[1744913911,null],[1744913912,null],[1744913913,null],[1744913914,null],[1744913915,null],[1744913916,null],[1744913917,null],[1744913918,null],[1744913919,null],[1744913920,null],[1744913921,null],[1744913922,null],[1744913923,null],[1744913924,null],[1744913925,null],[1744913926,null],[1744913927,null],[1744913928,null],[1744913929,null],[1744913930,null],[1744913931,null],[1744913932,null],[1744913933,null],[1744913934,null],[1744913935,null],[1744913936,null],[1744913937,null],[1744913938,null],[1744913939,null],[1744913940,null],[1744913941,null],[1744913942,null],[1744913943,null],[1744913944,null]]);
  392. var responsetimepercentilesovertimeokPercentilesChart = new Highcharts.StockChart({
  393. chart: {
  394. renderTo: 'responsetimepercentilesovertimeokPercentilesContainer',
  395. zoomType: 'x',
  396. marginBottom: 60
  397. },
  398. colors: ['#c4fd90', '#7ff77f', '#6ff2ad', '#61ede6', '#58c7e0', '#4ea1d4', '#487ad9', '#3f52cc', '#7335dc', '#c73905', '#FFA900'],
  399. credits: { enabled: false },
  400. legend: {
  401. enabled: true,
  402. floating: true,
  403. y: -65,
  404. borderWidth: 0,
  405. itemStyle: { fontWeight: "normal" },
  406. symbolRadius: 0
  407. },
  408. title: { text: 'A title to let highcharts reserve the place for the title set later' },
  409. navigator: {
  410. maskInside: false,
  411. baseSeries: 9
  412. },
  413. rangeSelector: {
  414. rangeSelector: { align: "left" },
  415. buttonSpacing: 0,
  416. buttonTheme: {
  417. fill: '#CFC9C6',
  418. padding: 1,
  419. stroke: '#000000',
  420. 'stroke-width': 0.25,
  421. style: {
  422. color: '#000000',
  423. fontWeight: 'bold',
  424. },
  425. states: {
  426. stroke: '#92918C',
  427. 'stroke-width': 0.25,
  428. hover: {
  429. fill: '#92918C',
  430. style: { color: 'black' }
  431. },
  432. select: {
  433. fill: '#FFA900',
  434. style: { color: 'white' }
  435. }
  436. }
  437. },
  438. buttons : [
  439. {
  440. type : 'minute',
  441. count : 1,
  442. text : '1m'
  443. }, {
  444. type : 'minute',
  445. count : 10,
  446. text : '10m'
  447. }, {
  448. type : 'hour',
  449. count : 1,
  450. text : '1h'
  451. }, {
  452. type : 'all',
  453. count : 1,
  454. text : 'All'
  455. }
  456. ],
  457. selected : 3,
  458. inputEnabled : false
  459. },
  460. xAxis: {
  461. type: 'datetime',
  462. ordinal: false,
  463. maxZoom: 10000 // three days
  464. },
  465. yAxis:[
  466. {
  467. min: 0,
  468. title: { text: 'Response Time (ms)' },
  469. opposite: false
  470. }, {
  471. min: 0,
  472. title: {
  473. text: 'Active Users',
  474. style: { color: '#FFA900' }
  475. },
  476. opposite: true
  477. }
  478. ],
  479. plotOptions: {
  480. arearange: { lineWidth: 1 },
  481. series: {
  482. dataGrouping: { enabled: false }
  483. }
  484. },
  485. series: [
  486. {
  487. pointInterval: 1000,
  488. name: 'min',
  489. data: responsetimepercentilesovertimeokPercentiles[0],
  490. tooltip: { yDecimals: 0, ySuffix: 'ms' },
  491. type : 'area',
  492. yAxis: 0,
  493. zIndex: 10
  494. },
  495. {
  496. pointInterval: 1000,
  497. name: '25%',
  498. data: responsetimepercentilesovertimeokPercentiles[1],
  499. tooltip: { yDecimals: 0, ySuffix: 'ms' },
  500. type : 'area',
  501. yAxis: 0,
  502. zIndex: 9
  503. },
  504. {
  505. pointInterval: 1000,
  506. name: '50%',
  507. data: responsetimepercentilesovertimeokPercentiles[2],
  508. tooltip: { yDecimals: 0, ySuffix: 'ms' },
  509. type : 'area',
  510. yAxis: 0,
  511. zIndex: 8
  512. },
  513. {
  514. pointInterval: 1000,
  515. name: '75%',
  516. data: responsetimepercentilesovertimeokPercentiles[3],
  517. tooltip: { yDecimals: 0, ySuffix: 'ms' },
  518. type : 'area',
  519. yAxis: 0,
  520. zIndex: 7
  521. },
  522. {
  523. pointInterval: 1000,
  524. name: '80%',
  525. data: responsetimepercentilesovertimeokPercentiles[4],
  526. tooltip: { yDecimals: 0, ySuffix: 'ms' },
  527. type : 'area',
  528. yAxis: 0,
  529. zIndex: 6
  530. },
  531. {
  532. pointInterval: 1000,
  533. name: '85%',
  534. data: responsetimepercentilesovertimeokPercentiles[5],
  535. tooltip: { yDecimals: 0, ySuffix: 'ms' },
  536. type : 'area',
  537. yAxis: 0,
  538. zIndex: 5
  539. },
  540. {
  541. pointInterval: 1000,
  542. name: '90%',
  543. data: responsetimepercentilesovertimeokPercentiles[6],
  544. tooltip: { yDecimals: 0, ySuffix: 'ms' },
  545. type : 'area',
  546. yAxis: 0,
  547. zIndex: 4
  548. },
  549. {
  550. pointInterval: 1000,
  551. name: '95%',
  552. data: responsetimepercentilesovertimeokPercentiles[7],
  553. tooltip: { yDecimals: 0, ySuffix: 'ms' },
  554. type : 'area',
  555. yAxis: 0,
  556. zIndex: 3
  557. },
  558. {
  559. pointInterval: 1000,
  560. name: '99%',
  561. data: responsetimepercentilesovertimeokPercentiles[8],
  562. tooltip: { yDecimals: 0, ySuffix: 'ms' },
  563. type : 'area',
  564. yAxis: 0,
  565. zIndex: 2
  566. },
  567. {
  568. pointInterval: 1000,
  569. name: 'max',
  570. data: responsetimepercentilesovertimeokPercentiles[9],
  571. tooltip: { yDecimals: 0, ySuffix: 'ms' },
  572. type : 'area',
  573. yAxis: 0,
  574. zIndex: 1
  575. },
  576. allUsersData
  577. ]
  578. });
  579. responsetimepercentilesovertimeokPercentilesChart.setTitle({
  580. text: '<span class="chart_title chart_title_">Response Time Percentiles over Time (OK)</span>',
  581. useHTML: true
  582. });
  583. var requests = unpack([[1744913838,[0,0,0]],[1744913839,[0,0,0]],[1744913840,[76,76,0]],[1744913841,[176,176,0]],[1744913842,[0,0,0]],[1744913843,[83,83,0]],[1744913844,[0,0,0]],[1744913845,[38,38,0]],[1744913846,[209,209,0]],[1744913847,[145,145,0]],[1744913848,[73,73,0]],[1744913849,[781,691,90]],[1744913850,[226,198,28]],[1744913851,[321,303,18]],[1744913852,[204,179,25]],[1744913853,[919,773,146]],[1744913854,[567,501,66]],[1744913855,[32,31,1]],[1744913856,[22,22,0]],[1744913857,[64,63,1]],[1744913858,[65,64,1]],[1744913859,[59,58,1]],[1744913860,[53,52,1]],[1744913861,[56,56,0]],[1744913862,[44,44,0]],[1744913863,[49,49,0]],[1744913864,[57,57,0]],[1744913865,[51,51,0]],[1744913866,[52,51,1]],[1744913867,[33,33,0]],[1744913868,[24,24,0]],[1744913869,[17,17,0]],[1744913870,[46,46,0]],[1744913871,[25,25,0]],[1744913872,[25,25,0]],[1744913873,[40,40,0]],[1744913874,[41,41,0]],[1744913875,[33,33,0]],[1744913876,[22,22,0]],[1744913877,[65,65,0]],[1744913878,[30,30,0]],[1744913879,[26,26,0]],[1744913880,[17,17,0]],[1744913881,[20,20,0]],[1744913882,[14,14,0]],[1744913883,[10,10,0]],[1744913884,[11,11,0]],[1744913885,[3,3,0]],[1744913886,[5,5,0]],[1744913887,[2,2,0]],[1744913888,[2,2,0]],[1744913889,[1,1,0]],[1744913890,[1,1,0]],[1744913891,[1,1,0]],[1744913892,[0,0,0]],[1744913893,[0,0,0]],[1744913894,[0,0,0]],[1744913895,[0,0,0]],[1744913896,[1,1,0]],[1744913897,[1,1,0]],[1744913898,[1,1,0]],[1744913899,[0,0,0]],[1744913900,[1,1,0]],[1744913901,[0,0,0]],[1744913902,[0,0,0]],[1744913903,[0,0,0]],[1744913904,[0,0,0]],[1744913905,[0,0,0]],[1744913906,[0,0,0]],[1744913907,[0,0,0]],[1744913908,[0,0,0]],[1744913909,[0,0,0]],[1744913910,[0,0,0]],[1744913911,[0,0,0]],[1744913912,[0,0,0]],[1744913913,[0,0,0]],[1744913914,[0,0,0]],[1744913915,[0,0,0]],[1744913916,[0,0,0]],[1744913917,[0,0,0]],[1744913918,[0,0,0]],[1744913919,[0,0,0]],[1744913920,[0,0,0]],[1744913921,[0,0,0]],[1744913922,[0,0,0]],[1744913923,[0,0,0]],[1744913924,[0,0,0]],[1744913925,[0,0,0]],[1744913926,[0,0,0]],[1744913927,[0,0,0]],[1744913928,[0,0,0]],[1744913929,[0,0,0]],[1744913930,[0,0,0]],[1744913931,[0,0,0]],[1744913932,[0,0,0]],[1744913933,[0,0,0]],[1744913934,[0,0,0]],[1744913935,[0,0,0]],[1744913936,[0,0,0]],[1744913937,[0,0,0]],[1744913938,[0,0,0]],[1744913939,[0,0,0]],[1744913940,[0,0,0]],[1744913941,[0,0,0]],[1744913942,[0,0,0]],[1744913943,[0,0,0]],[1744913944,[0,0,0]]]);
  584. var requestsChart = new Highcharts.StockChart({
  585. chart: {
  586. renderTo: 'requests',
  587. zoomType: 'x',
  588. marginBottom: 60
  589. },
  590. credits: { enabled: false },
  591. legend: {
  592. enabled: true,
  593. floating: true,
  594. y: -65,
  595. borderWidth: 0,
  596. itemStyle: { fontWeight: "normal" },
  597. symbolRadius: 0
  598. },
  599. title: { text: 'A title to let highcharts reserve the place for the title set later' },
  600. navigator: {
  601. maskInside: false
  602. },
  603. rangeSelector: {
  604. buttonSpacing: 0,
  605. buttonTheme: {
  606. fill: '#CFC9C6',
  607. padding: 1,
  608. stroke: '#000000',
  609. 'stroke-width': 0.25,
  610. style: {
  611. color: '#000000',
  612. fontWeight: 'bold',
  613. },
  614. states: {
  615. stroke: '#000000',
  616. 'stroke-width': 0.25,
  617. hover: {
  618. fill: '#92918C',
  619. style: { color: 'black' }
  620. },
  621. select: {
  622. fill: '#FFA900',
  623. style: { color: 'white' }
  624. }
  625. }
  626. },
  627. buttons : [
  628. {
  629. type : 'minute',
  630. count : 1,
  631. text : '1m'
  632. }, {
  633. type : 'minute',
  634. count : 10,
  635. text : '10m'
  636. }, {
  637. type : 'hour',
  638. count : 1,
  639. text : '1h'
  640. }, {
  641. type : 'all',
  642. count : 1,
  643. text : 'All'
  644. }
  645. ],
  646. selected : 3,
  647. inputEnabled : false
  648. },
  649. plotOptions: {
  650. series: {
  651. dataGrouping: { enabled: false }
  652. },
  653. area: {
  654. stacking: 'normal'
  655. }
  656. },
  657. xAxis: {
  658. type: 'datetime',
  659. ordinal: false,
  660. maxZoom: 10000 // three days
  661. },
  662. yAxis:[
  663. {
  664. min: 0,
  665. title: { text: 'Number of requests' },
  666. opposite: false,
  667. reversedStacks: false
  668. }, {
  669. min: 0,
  670. title: {
  671. text: 'Active Users',
  672. style: { color: '#FFA900' }
  673. },
  674. opposite: true
  675. }
  676. ],
  677. series: [
  678. {
  679. color: '#5E7BE2',
  680. name: 'All',
  681. data: requests[0],
  682. tooltip: { yDecimals: 0, ySuffix: '', valueDecimals: 0 }
  683. ,type: 'area'},
  684. allUsersData
  685. ]
  686. });
  687. requestsChart.setTitle({
  688. text: '<span class="chart_title">Number of requests per second</span>',
  689. useHTML: true
  690. });
  691. var responses = unpack([[1744913838,[0,0,0]],[1744913839,[0,0,0]],[1744913840,[0,0,0]],[1744913841,[2,2,0]],[1744913842,[0,0,0]],[1744913843,[74,74,0]],[1744913844,[55,55,0]],[1744913845,[49,49,0]],[1744913846,[34,34,0]],[1744913847,[121,121,0]],[1744913848,[0,0,0]],[1744913849,[86,86,0]],[1744913850,[345,345,0]],[1744913851,[409,409,0]],[1744913852,[214,214,0]],[1744913853,[340,340,0]],[1744913854,[57,57,0]],[1744913855,[206,206,0]],[1744913856,[471,471,0]],[1744913857,[193,193,0]],[1744913858,[95,95,0]],[1744913859,[76,76,0]],[1744913860,[166,166,0]],[1744913861,[67,67,0]],[1744913862,[73,73,0]],[1744913863,[62,62,0]],[1744913864,[73,73,0]],[1744913865,[67,67,0]],[1744913866,[98,98,0]],[1744913867,[79,79,0]],[1744913868,[58,58,0]],[1744913869,[85,85,0]],[1744913870,[44,44,0]],[1744913871,[71,71,0]],[1744913872,[39,39,0]],[1744913873,[33,33,0]],[1744913874,[60,60,0]],[1744913875,[70,70,0]],[1744913876,[50,50,0]],[1744913877,[60,60,0]],[1744913878,[67,67,0]],[1744913879,[41,41,0]],[1744913880,[33,33,0]],[1744913881,[15,15,0]],[1744913882,[11,11,0]],[1744913883,[23,23,0]],[1744913884,[17,17,0]],[1744913885,[14,14,0]],[1744913886,[17,17,0]],[1744913887,[9,9,0]],[1744913888,[5,5,0]],[1744913889,[5,5,0]],[1744913890,[6,6,0]],[1744913891,[1,1,0]],[1744913892,[4,4,0]],[1744913893,[7,7,0]],[1744913894,[2,2,0]],[1744913895,[7,7,0]],[1744913896,[1,1,0]],[1744913897,[3,3,0]],[1744913898,[2,2,0]],[1744913899,[6,6,0]],[1744913900,[4,4,0]],[1744913901,[4,4,0]],[1744913902,[7,7,0]],[1744913903,[9,9,0]],[1744913904,[26,26,0]],[1744913905,[24,24,0]],[1744913906,[11,11,0]],[1744913907,[20,20,0]],[1744913908,[14,14,0]],[1744913909,[105,15,90]],[1744913910,[37,9,28]],[1744913911,[28,10,18]],[1744913912,[44,19,25]],[1744913913,[148,2,146]],[1744913914,[71,5,66]],[1744913915,[1,0,1]],[1744913916,[1,1,0]],[1744913917,[3,2,1]],[1744913918,[1,0,1]],[1744913919,[1,0,1]],[1744913920,[2,1,1]],[1744913921,[0,0,0]],[1744913922,[0,0,0]],[1744913923,[0,0,0]],[1744913924,[0,0,0]],[1744913925,[0,0,0]],[1744913926,[1,0,1]],[1744913927,[0,0,0]],[1744913928,[0,0,0]],[1744913929,[0,0,0]],[1744913930,[0,0,0]],[1744913931,[0,0,0]],[1744913932,[0,0,0]],[1744913933,[0,0,0]],[1744913934,[0,0,0]],[1744913935,[0,0,0]],[1744913936,[0,0,0]],[1744913937,[0,0,0]],[1744913938,[0,0,0]],[1744913939,[0,0,0]],[1744913940,[0,0,0]],[1744913941,[0,0,0]],[1744913942,[0,0,0]],[1744913943,[0,0,0]],[1744913944,[0,0,0]]]);
  692. var requestsChart = new Highcharts.StockChart({
  693. chart: {
  694. renderTo: 'responses',
  695. zoomType: 'x',
  696. marginBottom: 60
  697. },
  698. credits: { enabled: false },
  699. legend: {
  700. enabled: true,
  701. floating: true,
  702. y: -65,
  703. borderWidth: 0,
  704. itemStyle: { fontWeight: "normal" },
  705. symbolRadius: 0
  706. },
  707. title: { text: 'A title to let highcharts reserve the place for the title set later' },
  708. navigator: {
  709. maskInside: false
  710. },
  711. rangeSelector: {
  712. buttonSpacing: 0,
  713. buttonTheme: {
  714. fill: '#CFC9C6',
  715. padding: 1,
  716. stroke: '#000000',
  717. 'stroke-width': 0.25,
  718. style: {
  719. color: '#000000',
  720. fontWeight: 'bold',
  721. },
  722. states: {
  723. stroke: '#000000',
  724. 'stroke-width': 0.25,
  725. hover: {
  726. fill: '#92918C',
  727. style: { color: 'black' }
  728. },
  729. select: {
  730. fill: '#FFA900',
  731. style: { color: 'white' }
  732. }
  733. }
  734. },
  735. buttons : [
  736. {
  737. type : 'minute',
  738. count : 1,
  739. text : '1m'
  740. }, {
  741. type : 'minute',
  742. count : 10,
  743. text : '10m'
  744. }, {
  745. type : 'hour',
  746. count : 1,
  747. text : '1h'
  748. }, {
  749. type : 'all',
  750. count : 1,
  751. text : 'All'
  752. }
  753. ],
  754. selected : 3,
  755. inputEnabled : false
  756. },
  757. plotOptions: {
  758. series: {
  759. dataGrouping: { enabled: false }
  760. },
  761. area: {
  762. stacking: 'normal'
  763. }
  764. },
  765. xAxis: {
  766. type: 'datetime',
  767. ordinal: false,
  768. maxZoom: 10000 // three days
  769. },
  770. yAxis:[
  771. {
  772. min: 0,
  773. title: { text: 'Number of responses' },
  774. opposite: false,
  775. reversedStacks: false
  776. }, {
  777. min: 0,
  778. title: {
  779. text: 'Active Users',
  780. style: { color: '#FFA900' }
  781. },
  782. opposite: true
  783. }
  784. ],
  785. series: [
  786. {
  787. color: '#5E7BE2',
  788. name: 'All',
  789. data: responses[0],
  790. tooltip: { yDecimals: 0, ySuffix: '', valueDecimals: 0 }
  791. },
  792. {
  793. color: '#68b65c',
  794. name: 'OK',
  795. data: responses[1],
  796. tooltip: { yDecimals: 0, ySuffix: '', valueDecimals: 0 }
  797. ,type: 'area'},
  798. {
  799. color: '#f15b4f',
  800. name: 'KO',
  801. data: responses[2],
  802. tooltip: { yDecimals: 0, ySuffix: '', valueDecimals: 0 }
  803. ,type: 'area'},
  804. allUsersData,
  805. {
  806. type: 'pie',
  807. name: 'Distribution',
  808. data: [
  809. {name: 'OK', y: 4561.0, color: '#68b65c'},{name: 'KO', y: 379.0, color: '#f15b4f'}
  810. ],
  811. center: [775, -40],
  812. size: 70,
  813. showInLegend: false,
  814. dataLabels: { enabled: false },
  815. dataGrouping: { enabled: false }
  816. }
  817. ]
  818. });
  819. requestsChart.setTitle({
  820. text: '<span class="chart_title">Number of responses per second</span>',
  821. useHTML: true
  822. });
  823. var scatterChart = new Highcharts.Chart({
  824. chart: {
  825. renderTo: 'container_response_time_dispersion',
  826. defaultSeriesType: 'scatter',
  827. zoomType: 'xy',
  828. marginBottom: 90
  829. },
  830. credits: { enabled: false },
  831. xAxis: {
  832. title: {
  833. enabled: true,
  834. text: 'Global number of requests per second',
  835. style: { fontWeight: 'bold' }
  836. },
  837. startOnTick: true,
  838. endOnTick: true,
  839. showLastLabel: true,
  840. min: 0
  841. },
  842. title: { text: 'A title to let highcharts reserve the place for the title set later' },
  843. yAxis: {
  844. min: 0,
  845. title: { text: 'Response Time (ms)' }
  846. },
  847. tooltip: {
  848. formatter: function() {
  849. return ''+ this.y +' ms at ' + this.x + ' allreq/s';
  850. }
  851. },
  852. legend: {
  853. enabled: true,
  854. floating: true,
  855. y: 0,
  856. borderWidth: 0,
  857. itemStyle: { fontWeight: "normal" },
  858. },
  859. plotOptions: {
  860. scatter: {
  861. marker: {
  862. radius: 3,
  863. states: {
  864. hover: {
  865. enabled: true,
  866. lineColor: 'rgb(100,100,100)'
  867. }
  868. }
  869. },
  870. states: {
  871. hover: {
  872. marker: { enabled: false }
  873. }
  874. }
  875. }
  876. },
  877. series: [
  878. {
  879. type: 'scatter',
  880. color: '#68b65c',
  881. name: 'OK',
  882. data: [
  883. [3,15393],[3,14291],[3,1311],[3,3998],[3,7928],[3,6116],[3,2785],[6,8059],[6,29264],[9,7134],[15,9577],[30,28049],[33,27221],[42,28956],[51,28633],[55,4455],[60,29958],[66,4151],[66,2530],[68,11929],[75,3791],[75,4272],[78,29322],[90,7607],[96,6447],[99,9230],[99,4019],[120,4028],[123,2224],[132,15252],[138,6519],[147,14695],[153,4305],[156,14159],[159,14541],[168,13299],[171,8599],[177,15638],[192,29275],[195,27924],[195,7113],[219,2931],[612,52010],[667,5997],[678,25553],[963,26380],[1659,4756],[1701,48882],[2201,4647],[2343,25858],[2757,53320],[4505,5615],[4670,6222],[4797,6576]
  884. ]},
  885. {
  886. type: 'scatter',
  887. color: '#f15b4f',
  888. name: 'KO',
  889. data: [
  890. [96,60003],[156,60016],[159,60009],[177,60007],[192,60001],[195,60002],[612,60015],[678,60013],[963,60015],[1701,60015],[2343,60019],[2757,60013]
  891. ]}
  892. ]
  893. });
  894. scatterChart.setTitle({
  895. text: '<span class="chart_title">Response Time against Global Throughput</span>',
  896. useHTML: true
  897. });
  898. });
  899. </script>
  900. </div>
  901. </body>
  902. </html>