From 571bce66ebb37d5e8a7f0f3e34b4662347b4366e Mon Sep 17 00:00:00 2001
From: keisuke-umezawa <keisuke.umezawa@gmail.com>
Date: Sun, 5 Nov 2023 17:46:45 +0900
Subject: [PATCH] Change the definition of RankPlotInfo

---
 optuna_dashboard/ts/components/GraphRank.tsx | 17 +++--------------
 1 file changed, 3 insertions(+), 14 deletions(-)

diff --git a/optuna_dashboard/ts/components/GraphRank.tsx b/optuna_dashboard/ts/components/GraphRank.tsx
index dc0a3842..63d2dec5 100644
--- a/optuna_dashboard/ts/components/GraphRank.tsx
+++ b/optuna_dashboard/ts/components/GraphRank.tsx
@@ -24,7 +24,6 @@ interface RankPlotInfo {
   ytype: plotly.AxisType
   xvalues: (string | number)[]
   yvalues: (string | number)[]
-  zvalues: number[]
   colors: number[]
   is_feasible: boolean[]
   hovertext: string[]
@@ -170,15 +169,9 @@ const getRankPlotInfo = (
   const colors = getColors(zValues)
 
   if (xAxis.isCat && !yAxis.isCat) {
-    const xIndices: number[] = Array.from(Array(xValues.length).keys()).sort(
-      (a, b) =>
-        xValues[a]
-          .toString()
-          .toLowerCase()
-          .localeCompare(xValues[b].toString().toLowerCase())
-    )
-    xValues = xIndices.map((i) => xValues[i])
-    yValues = xIndices.map((i) => yValues[i])
+    const indices = xAxis.indices
+    xValues = indices.map((i: number) => xValues[i])
+    yValues = indices.map((i) => yValues[i])
   }
   if (!xAxis.isCat && yAxis.isCat) {
     const yIndices: number[] = Array.from(Array(yValues.length).keys()).sort(
@@ -218,7 +211,6 @@ const getRankPlotInfo = (
     ytype: yAxis.isCat ? "category" : yAxis.isLog ? "log" : "linear",
     xvalues: xValues,
     yvalues: yValues,
-    zvalues: zValues,
     colors,
     is_feasible: isFeasible,
     hovertext,
@@ -285,9 +277,6 @@ const plotRank = (rankPlotInfo: RankPlotInfo | null, mode: string) => {
     template: mode === "dark" ? plotlyDarkTemplate : {},
   }
 
-  const xValues = rankPlotInfo.xvalues
-  const yValues = rankPlotInfo.yvalues
-
   const plotData: Partial<plotly.PlotData>[] = [
     {
       type: "scatter",