add toggle between linear and log

Author: s7tya

site/frontend/src/pages/dashboard.ts

@@ -1,7 +1,27 @@
 import Highcharts from "highcharts";
-import {DASHBOARD_DATA_URL} from "../urls";
+import { DASHBOARD_DATA_URL } from "../urls";
 
-import {getJson} from "../utils/requests";
+import { getJson } from "../utils/requests";
+
+type ScaleKind = "linear" | "log";
+let scale: ScaleKind = "linear";
+
+const buttons = Array.from(document.querySelectorAll<HTMLInputElement>(
+  "#scale-select-form input",
+));
+
+console.log(buttons);
+
+Array.from(buttons).map((button) => {
+  console.log("a");
+  button.addEventListener("change", () => {
+    console.log(button, "click");
+    if (button.checked) {
+      scale = button.value as ScaleKind;
+      make_data();
+    }
+  });
+});
 
 interface DashboardCompileBenchmarkCases {
   clean_averages: [number];
@@ -27,9 +47,9 @@ function render(
   element: string,
   name: Profile,
   data: DashboardCompileBenchmarkCases,
-  versions: [string]
+  versions: [string],
 ) {
-  let articles = {check: "a", debug: "a", opt: "an", doc: "a"};
+  let articles = { check: "a", debug: "a", opt: "an", doc: "a" };
 
   Highcharts.chart({
     chart: {
@@ -43,13 +63,13 @@ function render(
       text: `Average time for ${articles[name]} ${name} build`,
     },
     yAxis: {
-      title: {text: "Seconds"},
-      min: Math.min(...Object.keys(data).flatMap((key) => data[key])),
-      type: "logarithmic",
+      title: { text: "Seconds" },
+      min: scale === "linear" ? 0 : undefined,
+      type: scale === "log" ? "logarithmic" : undefined,
     },
     xAxis: {
       categories: versions,
-      title: {text: "Version"},
+      title: { text: "Version" },
     },
     series: [
       {
@@ -100,13 +120,13 @@ function renderRuntime(element: string, data: [number], versions: [string]) {
       text: `Average time for a runtime benchmark`,
     },
     yAxis: {
-      title: {text: "Miliseconds"},
-      min: Math.min(...formattedData),
-      type: "logarithmic",
+      title: { text: "Miliseconds" },
+      min: scale === "linear" ? 0 : undefined,
+      type: scale === "log" ? "logarithmic" : undefined,
     },
     xAxis: {
       categories: versions.slice(nullCount),
-      title: {text: "Version"},
+      title: { text: "Version" },
     },
     series: [
       {

site/frontend/src/urls.ts

@@ -1,4 +1,5 @@
-const BASE_URL = window.location.origin + "/perf";
+// const BASE_URL = window.location.origin + "/perf";
+const BASE_URL = "https://perf.rust-lang.org/perf";
 
 export const INFO_URL = `${BASE_URL}/info`;
 
@@ -7,7 +8,10 @@ export const STATUS_DATA_URL = `${BASE_URL}/status_page`;
 export const BOOTSTRAP_DATA_URL = `${BASE_URL}/bootstrap`;
 export const GRAPH_DATA_URL = `${BASE_URL}/graphs`;
 export const COMPARE_DATA_URL = `${BASE_URL}/get`;
-export const COMPARE_COMPILE_DETAIL_GRAPHS_DATA_URL = `${BASE_URL}/compare-compile-detail-graphs`;
-export const COMPARE_RUNTIME_DETAIL_GRAPHS_DATA_URL = `${BASE_URL}/compare-runtime-detail-graphs`;
-export const COMPARE_COMPILE_DETAIL_SECTIONS_DATA_URL = `${BASE_URL}/compare-compile-detail-sections`;
+export const COMPARE_COMPILE_DETAIL_GRAPHS_DATA_URL =
+    `${BASE_URL}/compare-compile-detail-graphs`;
+export const COMPARE_RUNTIME_DETAIL_GRAPHS_DATA_URL =
+    `${BASE_URL}/compare-runtime-detail-graphs`;
+export const COMPARE_COMPILE_DETAIL_SECTIONS_DATA_URL =
+    `${BASE_URL}/compare-compile-detail-sections`;
 export const SELF_PROFILE_DATA_URL = `${BASE_URL}/self-profile`;

site/frontend/templates/pages/dashboard.html

@@ -24,6 +24,17 @@
     compiled by a given version of the Rust compiler.
 </details>
 
+<form id="scale-select-form">
+    <label>
+        <input type="radio" name="scale-select" value="linear" checked />
+        Linear-scale
+    </label>
+    <label>
+        <input type="radio" name="scale-select" value="log" />
+        Log-scale
+    </label>
+</form>
+
 <div class="graphs">
     <div id="check-average-times"></div>
     <div id="debug-average-times"></div>