source: trip-planner-front/node_modules/hdr-histogram-js/benchmark/results/data-access.chart.html@ 6a3a178

Last change on this file since 6a3a178 was 6a3a178, checked in by Ema <ema_spirova@…>, 3 years ago

initial commit
  • Property mode set to 100644
File size: 3.5 KB
Line 
1<!DOCTYPE html>
2<html lang="en">
3 <head>
4 <meta charset="UTF-8" />
5 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6 <meta http-equiv="X-UA-Compatible" />
7 <script src="https://cdn.jsdelivr.net/npm/chart.js@2.8.0/dist/Chart.min.js"></script>
8 <style>
9 .wrapper {
10 display: flex;
11 flex: wrap;
12 order: row;
13 }
14 </style>
15 <title>Histogram data access</title>
16 </head>
17 <body>
18 <div style="max-width: 800px;">
19 <canvas id="chart1591912418741" width="16" height="9"></canvas>
20 </div>
21 <script>
22 const format = num => {
23 const chunked = [];
24 String(num)
25 .split("")
26 .reverse()
27 .forEach((char, index) => {
28 if (index % 3 === 0) {
29 chunked.unshift([char]);
30 } else {
31 chunked[0].unshift(char);
32 }
33 });
34
35 return chunked.map(chunk => chunk.join("")).join(" ");
36 };
37 const ctx1591912418741 = document
38 .getElementById("chart1591912418741")
39 .getContext("2d");
40 const chart1591912418741 = new Chart(ctx1591912418741, {
41 type: "bar",
42 data: {
43 labels: [
44 "Int32Histogram",
45 "PackedHistogram",
46 "Float64Histogram",
47 "Int32Histogram eager allocation",
48 "WASM Int32Histogram",
49 "WASM PackedHistogram",
50 "Float64Histogram eager allocation"
51 ],
52 datasets: [
53 {
54 data: [
55 8837945,
56 722255,
57 8686614,
58 8439126,
59 24384646,
60 24239733,
61 8555309
62 ],
63 backgroundColor: [
64 "rgba(63, 142, 252, 0.8)",
65 "rgba(116, 165, 127, 0.8)",
66 "rgba(158, 206, 154, 0.8)",
67 "rgba(58, 175, 185, 0.8)",
68 "rgba(79, 124, 172, 0.8)",
69 "rgba(113, 128, 172, 0.8)",
70 "rgba(182, 140, 184, 0.8)"
71 ],
72 borderColor: [
73 "rgba(63, 142, 252, 1)",
74 "rgba(116, 165, 127, 1)",
75 "rgba(158, 206, 154, 1)",
76 "rgba(58, 175, 185, 1)",
77 "rgba(79, 124, 172, 1)",
78 "rgba(113, 128, 172, 1)",
79 "rgba(182, 140, 184, 1)"
80 ],
81 borderWidth: 1
82 }
83 ]
84 },
85 options: {
86 legend: {
87 display: false
88 },
89 title: {
90 display: true,
91 text: "Histogram data access",
92 fontSize: 16,
93 padding: 20
94 },
95 tooltips: {
96 callbacks: {
97 label: tooltipItem => {
98 return format(tooltipItem.yLabel) + " ops/s";
99 }
100 }
101 },
102 scales: {
103 yAxes: [
104 {
105 gridLines: {
106 color: "rgba(127, 127, 127, 0.2)"
107 },
108 scaleLabel: {
109 display: true,
110 labelString: "Operations per second"
111 },
112 ticks: {
113 beginAtZero: true,
114 callback: format
115 }
116 }
117 ],
118 xAxes: [
119 {
120 gridLines: {
121 color: "rgba(127, 127, 127, 0.2)"
122 },
123 maxBarThickness: 150
124 }
125 ]
126 }
127 }
128 });
129 </script>
130 </body>
131</html>
Note: See TracBrowser for help on using the repository browser.