周辺を探すの寄せ先を easeTo に変え、視差効果を減らす端末でも効かせる

パネルの行を押したときの寄せ先は offset でパネルに隠れていない側の中心へ
置いていたが、端末が「視差効果を減らす」設定のときだけ効いていなかった。

MapLibre の flyTo はこの設定で jumpTo へ落ち、そのとき引き継ぐのは
center・zoom・bearing・pitch・roll・elevation・padding だけで、offset は
黙って捨てられる。落ちた先の寄せ先は地図のど真ん中で、下から敷く帯のときは
そこがちょうどパネルの上端になるため、押した候補は上半分だけ見えて下半分が
パネルに隠れる。easeTo は同じ設定で duration を 0 にするだけなので offset は効く。

手元のブラウザはこの設定を既定で持たないので、画面幅・縮尺・レイアウトを
変えて計測しても再現しなかった。確かめるには明示的に有効にすること
(CDP の Emulation.setEmulatedMedia、DevTools の Rendering)。実測では、
同じ幅・同じ操作でも有効のときだけ候補がパネルの上端(y=416 / パネル境界=416)に
立ち、無効なら見えている側の中心(y=208)に来る。

位置を直したあとの移動も同じ扱いにする。こちらは offset を渡しておらず、
直した先が必ず地図の真ん中=パネルの上端に来ていた。

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

Author: claude

CLAUDE.md

@@ -832,12 +832,26 @@ CLI(codex / antigravity)の起動を直列にするので、2人が同時に探
 - **パネルの行を押したとき**、その候補をそこへ寄せる(`focusDiscoveryRow`)。
   地図の中心へ運ぶと、**押した候補がパネルの下に入って見えない**
 
-ずらし方は`flyTo`/`easeTo`の`offset`(最終的な中心を container の中心からずらす
-ピクセル数)。**`padding`は使わない** —— あちらは地図の transform に残り続け、
-以後の`fitBounds`・`flyTo`(訪問順の経路・現在地への移動)まで巻き込んでずれる。
+ずらし方は`offset`(最終的な中心を container の中心からずらすピクセル数)。
 下の帯か右の帯かは**パネルの実寸から判定する**(画面幅で決め打ちすると、
 パネル側の折り返しを変えたときにここが取り残される)。
 
+**`offset`を渡す先は`easeTo`にすること。`flyTo`では効かないことがある。**
+MapLibreの`flyTo`は端末が「視差効果を減らす」設定のとき`jumpTo`へ落ち、
+そのとき引き継ぐのは`center`・`zoom`・`bearing`・`pitch`・`roll`・`elevation`・
+`padding`だけで、**`offset`は黙って捨てられる**。落ちた先の寄せ先は地図のど真ん中で、
+下から敷く帯のときはそこがちょうどパネルの上端なので、**押した候補が上半分だけ見えて
+下半分が隠れる**。`easeTo`は同じ設定で`duration`を0にするだけなので`offset`は効く。
+
+**この設定は実機でしか踏まない。** 手元のブラウザは既定で持たないので、確かめるには
+明示的に有効にすること(Chromeなら DevTools の Rendering →
+`Emulate CSS prefers-reduced-motion`、CDPなら`Emulation.setEmulatedMedia`)。
+実測で、同じ画面幅・同じ操作でも 視差効果を減らす=有効のときだけ候補が
+パネルの上端(y=416 / パネル境界=416)に立ち、無効なら見えている側の中心(y=208)に来た。
+
+**`padding`は使わない** —— あちらは地図の transform に残り続け、
+以後の`fitBounds`(訪問順の経路・現在地への移動)まで巻き込んでずれる。
+
 **行は2段に分ける。** 1段目は「選ぶ(チェック)・読む(名前と印)・外す(×)」だけの横並び、
 2段目に行ごとの操作(ランク・位置を直す・参照・座標と店名を見比べる)を**幅いっぱいで
 折り返して**置く。操作まで同じ横並びに入れると1列が数十pxまで潰れ、そこでも縦書きになる

components/MapView.tsx

@@ -165,8 +165,16 @@ function circlePolygon(
 
 /**
  * 地図の上に敷いたパネルを避けて、**見えている側の中心**へ寄せるための`offset`
- * ([x, y]のピクセル。`flyTo`/`easeTo`の`offset`は「最終的な中心を container の
- * 中心からどれだけずらすか」を指す)。
+ * ([x, y]のピクセル。`offset`は「最終的な中心を container の中心からどれだけ
+ * ずらすか」を指す)。
+ *
+ * **渡す先は`easeTo`にすること。`flyTo`では効かないことがある** ——
+ * MapLibreの`flyTo`は端末が「視差効果を減らす」設定のときに`jumpTo`へ落ち、
+ * そのとき引き継ぐのは`center`・`zoom`・`bearing`・`pitch`・`roll`・`elevation`・
+ * `padding`だけで、**`offset`は黙って捨てられる**。落ちた先では寄せ先が地図の
+ * ど真ん中になり、下から敷く帯のときはそこがちょうどパネルの上端なので、
+ * **押した候補が半分隠れる**(実機で再現。手元のブラウザはこの設定を持たないので出ない)。
+ * `easeTo`は同じ設定で`duration`を0にするだけなので、`offset`はそのまま効く。
  *
  * パネルは狭い画面では下から敷く帯、広い画面では右の帯になる。**どちらかは
  * 画面幅で決め打ちせず実寸から判定する** —— 決め打ちすると、パネル側の
@@ -2807,25 +2815,28 @@ export default function MapView({
    *
    * **寄せ先は地図の中心ではなく、パネルに隠れていない側の中心**。パネルは画面の下半分
    * (狭い画面)か右側を覆っているので、素直に中心へ運ぶと**押した候補がパネルの下に入って
-   * 見えない**。`flyTo`の`offset`(最終的な中心を container の中心からずらすピクセル数)で
-   * 見えている矩形の中心へ置く。
+   * 見えない**。`offset`(`visibleCenterOffset`)で見えている矩形の中心へ置く。
+   *
+   * **`flyTo`ではなく`easeTo`を使う** —— `flyTo`は「視差効果を減らす」設定の端末で
+   * `offset`を捨てる(`visibleCenterOffset`の注記)。
    *
    * **`padding`は使わない** —— あちらは地図の transform に残り続けるので、以後の
-   * `fitBounds`・`flyTo`(訪問順の経路や現在地への移動)まで巻き込んでずれる。
+   * `fitBounds`(訪問順の経路や現在地への移動)まで巻き込んでずれる。
    */
   const focusDiscoveryRow = useCallback(
     (no: number) => {
       setDiscoveryFocusedNo(no);
       const map = mapRef.current;
       const row = discoveryRows.find((r) => r.no === no);
       if (!map || !row) return;
-      map.flyTo({
+      map.easeTo({
         center: [row.candidate.lng, row.candidate.lat],
         zoom: Math.max(map.getZoom(), 15),
         offset: visibleCenterOffset(
           containerRef.current?.getBoundingClientRect(),
           discoveryPanelRef.current?.getBoundingClientRect()
         ),
+        duration: 600,
       });
     },
     [discoveryRows]
@@ -2901,7 +2912,16 @@ export default function MapView({
       );
       // 直した位置がすぐ見えるように、その行へ寄せる
       setDiscoveryFocusedNo(no);
-      mapRef.current?.flyTo({ center: [hit.lng, hit.lat], zoom: Math.max(mapRef.current.getZoom(), 16) });
+      // 直した先もパネルに隠れていない側へ寄せる(行を押したときと同じ扱い)
+      mapRef.current?.easeTo({
+        center: [hit.lng, hit.lat],
+        zoom: Math.max(mapRef.current.getZoom(), 16),
+        offset: visibleCenterOffset(
+          containerRef.current?.getBoundingClientRect(),
+          discoveryPanelRef.current?.getBoundingClientRect()
+        ),
+        duration: 600,
+      });
     },
     [discoveryRows, regionScope]
   );