Distance Xaxis.

src/plotly/DataArrayFrom.scala

@@ -20,13 +20,18 @@ trait DataArrayFrom[A] extends (A => js.Array[Data]):
 object DataArrayFrom:
 
   given intervals(using Performance[Interval]): DataArrayFrom[Intervals] = v =>
+    val distances = 
+      val (_, r) = v.foldLeft(0.0 -> List.empty[Meter]):
+        case ((a, t), i) => (i.distance + a) -> (i.distance + a :: t)
+      r.map(_.round).reverse
+
     def scatterLine[A <: Double](name: String, fy: Interval => A) =
       Data
         .PartialPlotDataAutobinx()
         .setName(name)
         .setLine(PartialScatterLine().setWidth(1))
         .setY(v.map(fy).toJSArray)
-        .setX(v.indices.map(_ + 1.0).toJSArray)
+        .setX(distances.toJSArray)
         .setHoverinfo(yPlussignname)
 
     js.Array(
@@ -50,4 +55,9 @@ object DataArrayFrom:
     m.filter(_.nonEmpty).map(box).toJSArray
 
   extension (d: Double) inline def round = scala.scalajs.js.Math.round(d)
+  extension (i: Intervals)
+    inline def distances =
+      val (_, r) = i.foldLeft(0.0 -> List.empty[Meter]):
+        case ((a, t), d) => (d.distance + a) -> (d.distance + a :: t)
+      r.map(_.round).reverse
 end DataArrayFrom

src/plotly/Layout.scala

@@ -12,6 +12,7 @@ import typings.plotlyJs.plotlyJsStrings.right
 import typings.plotlyJs.plotlyJsStrings.y2
 
 import core.metrics.*
+import typings.plotlyJs.plotlyJsStrings.array
 
 trait Layout[A] extends (A => PartialLayout):
   extension (a: A) inline def layout = this(a)
@@ -44,7 +45,7 @@ object Layout:
       .setShowlegend(true)
       .setColorPalette
       .setLegend(inside)
-      .setXaxis(PartialLayoutAxis().setDtick(1.0).setTitle("圈数"))
+      .setXaxis(PartialLayoutAxis().setTicksuffix("m").setTickmode(array))
       .setYaxis(yAxis)
       .setYaxis2(yAxis2)
   end intervals