···

       
676
       
 
       
          }

     

       
677
       
 
       
        });

     

       
678
       
 
       


     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
679
       
 
       
        charts.latency = new Chart(ctx, {

     

       
680
       
 
       
          type: "line",

     

       
681
       
 
       
          data: {

     

       
682
       
 
       
            labels: labels,

     

       
683
       
 
       
            datasets: [{

     

       
684
       
 
       
              label: "Average Response Time",

     

       
685
       
-
       
              data: data.map((d) => d.averageResponseTime),

     

       
686
       
 
       
              borderColor: "#10b981",

     

       
687
       
 
       
              backgroundColor: "rgba(16, 185, 129, 0.1)",

     

       
688
       
 
       
              tension: 0.4,

     
···

       
732
       
 
       
                type: 'logarithmic',

     

       
733
       
 
       
                title: { display: true, text: 'Response Time (ms, log scale)' },

     

       
734
       
 
       
                min: 1,

     

       
0
       
 
       

     

       
735
       
 
       
                grid: { color: 'rgba(0, 0, 0, 0.05)' },

     

       
736
       
 
       
                ticks: {

     

       
737
       
 
       
                  callback: function(value) {

     

       
738
       
-
       
                    // Show clean numbers: 1, 10, 100, 1000, etc.

     

       
739
       
-
       
                    if (value === 1 || value === 10 || value === 100 || value === 1000 || value === 10000) {

     

       
740
       
 
       
                      return value + 'ms';

     

       
741
       
 
       
                    }

     

       
742
       
 
       
                    return '';

     

···

       
676
       
 
       
          }

     

       
677
       
 
       
        });

     

       
678
       
 
       


     

       
679
       
+
       
        // Calculate dynamic max for logarithmic scale

     

       
680
       
+
       
        const responseTimes = data.map((d) => d.averageResponseTime);

     

       
681
       
+
       
        const maxResponseTime = Math.max(...responseTimes);

     

       
682
       
+
       


     

       
683
       
+
       
        // Calculate appropriate max for log scale (next power of 10)

     

       
684
       
+
       
        const logMax = Math.pow(10, Math.ceil(Math.log10(maxResponseTime)));

     

       
685
       
+
       


     

       
686
       
+
       
        // Generate dynamic tick values based on the data range

     

       
687
       
+
       
        const generateLogTicks = (min, max) => {

     

       
688
       
+
       
          const ticks = [];

     

       
689
       
+
       
          let current = 1;

     

       
690
       
+
       
          while (current <= max) {

     

       
691
       
+
       
            ticks.push(current);

     

       
692
       
+
       
            current *= 10;

     

       
693
       
+
       
          }

     

       
694
       
+
       
          return ticks;

     

       
695
       
+
       
        };

     

       
696
       
+
       


     

       
697
       
+
       
        const dynamicTicks = generateLogTicks(1, logMax);

     

       
698
       
+
       


     

       
699
       
 
       
        charts.latency = new Chart(ctx, {

     

       
700
       
 
       
          type: "line",

     

       
701
       
 
       
          data: {

     

       
702
       
 
       
            labels: labels,

     

       
703
       
 
       
            datasets: [{

     

       
704
       
 
       
              label: "Average Response Time",

     

       
705
       
+
       
              data: responseTimes,

     

       
706
       
 
       
              borderColor: "#10b981",

     

       
707
       
 
       
              backgroundColor: "rgba(16, 185, 129, 0.1)",

     

       
708
       
 
       
              tension: 0.4,

     
···

       
752
       
 
       
                type: 'logarithmic',

     

       
753
       
 
       
                title: { display: true, text: 'Response Time (ms, log scale)' },

     

       
754
       
 
       
                min: 1,

     

       
755
       
+
       
                max: logMax,

     

       
756
       
 
       
                grid: { color: 'rgba(0, 0, 0, 0.05)' },

     

       
757
       
 
       
                ticks: {

     

       
758
       
 
       
                  callback: function(value) {

     

       
759
       
+
       
                    // Show clean numbers based on dynamic range

     

       
760
       
+
       
                    if (dynamicTicks.includes(value)) {

     

       
761
       
 
       
                      return value + 'ms';

     

       
762
       
 
       
                    }

     

       
763
       
 
       
                    return '';