private readonly legendFormatter:()

in dashboard/new-dashboard/src/components/charts/LineChartVM.ts [159:282]
75 lines of code
4 McCabe index (conditional complexity)

    private readonly legendFormatter: (name: string) => string,
    hasDataCallback?: (hasData: boolean) => void
  ) {
    this.legendFormatter = legendFormatter
    this.accidentsConfigurator = accidentsConfigurator
    this.hasDataCallback = hasDataCallback
    const isMs = valueUnit == "ms"
    this.eChart.chart.showLoading("default", useDarkModeStore().darkMode ? { maskColor: "#121212", showSpinner: false, textColor: "#D1D5DB" } : { showSpinner: false })
    this.eChart.chart.setOption<LineChartOptions>({
      legend: {
        top: 0,
        left: 0,
        itemHeight: 3,
        itemWidth: 15,
        icon: "rect",
      },
      toolbox: {
        feature: {
          dataZoom: {
            yAxisIndex: false,
          },
          myTool: {
            show: true,
            title: "Full screen",
            icon: "path://M3.75 3.75v4.5m0-4.5h4.5m-4.5 0L9 9M3.75 20.25v-4.5m0 4.5h4.5m-4.5 0L9 15M20.25 3.75h-4.5m4.5 0v4.5m0-4.5L15 9m5.25 11.25h-4.5m4.5 0v-4.5m0 4.5L15 15",
            onclick() {
              /* eslint-disable @typescript-eslint/no-floating-promises */
              // noinspection JSIgnoredPromiseFromCall
              if (document.fullscreenElement) {
                document.exitFullscreen()
              } else {
                eChart.chartContainer.requestFullscreen()
              }
            },
          },
        },
      },
      animation: false,
      grid: {
        left: 8,
        top: 65,
        right: 20,
        bottom: 16,
        containLabel: true,
      },
      tooltip: {
        show: true,
        enterable: true,
        axisPointer: {
          type: "cross",
        },
        renderMode: "html",
        position: (pointerCoords, _, tooltipElement) => {
          const [pointerLeft, pointerTop] = pointerCoords
          const element = tooltipElement as HTMLDivElement
          const chartRect = this.eChart.chart.getDom().getBoundingClientRect()

          const tooltipWidth = element.offsetWidth
          const tooltipHeight = element.clientHeight

          // Calculate initial positions
          let left = pointerLeft + 10
          let top = pointerTop - tooltipHeight - 10

          // Handle horizontal overflow
          const isOverflowRight = chartRect.left + left + tooltipWidth > chartRect.right
          if (isOverflowRight) {
            left = pointerLeft - tooltipWidth - 10
          }

          // Handle vertical overflow
          const isOverflowTop = chartRect.top + top < chartRect.top
          const isOverflowBottom = chartRect.top + top + tooltipHeight > chartRect.bottom
          if (isOverflowTop) {
            top = pointerTop + 10 // Position below the pointer if it overflows on top
          } else if (isOverflowBottom) {
            top = chartRect.bottom - tooltipHeight - 10 // Adjust to stay within the bottom edge
          }

          return [left, top]
        },
        // Formatting
        formatter: this.getFormatter(isMs),
        valueFormatter(it) {
          return numberFormat.format(isMs ? (it as number) : nsToMs(it as number)) + " ms"
        },
        // Styling
        padding: [6, 8],
        backgroundColor: useDarkModeStore().darkMode ? "#121212" : "white",
        borderColor: useDarkModeStore().darkMode ? "#4B5563" : "#E5E7EB",
        borderWidth: 0.3,
        textStyle: {
          color: useDarkModeStore().darkMode ? "#D1D5DB" : "#6B7280",
          fontSize: 12,
        },
      },
      xAxis: {
        type: "time",
        axisPointer: {
          snap: false,
          label: {
            backgroundColor: useDarkModeStore().darkMode ? "#121212" : "#6E7079",
            formatter(data) {
              return timeFormat.format(data.value as number)
            },
          },
        },
      },
      yAxis: {
        axisPointer: {
          label: {
            backgroundColor: useDarkModeStore().darkMode ? "#121212" : "#6E7079",
          },
        },
        min(value) {
          return useSettingsStore().flexibleYZero ? value.min * 0.9 : 0
        },
        type: "value",
        splitLine: {
          show: false,
        },
      },
    })
  }