fix(web): 修复断点站点的X轴坐标偏移问题，并优化换乘站的视觉连接

web/ticket-order.js

@@ -186,6 +186,7 @@
           for (const li of lineStops) {
               for (let i = 0; i < li.stops.length; i++) {
                   const code = li.stops[i];
+                  if (code === '-') continue;
                   const canonical = stationCanonicalByCode[code] || code;
                   if (!occurrences[canonical]) occurrences[canonical] = [];
                   occurrences[canonical].push(i * minGapX);
@@ -202,6 +203,7 @@
               for (const li of lineStops) {
                   let prevX = startX - minGapX;
                   for (const code of li.stops) {
+                      if (code === '-') continue;
                       const canonical = stationCanonicalByCode[code] || code;
                       const x = stationXByCanonical[canonical] ?? (prevX + minGapX);
                       const nx = Math.max(x, prevX + minGapX);
@@ -287,9 +289,20 @@
               const codes = (stationCodesByCanonical[canonical] || []).filter(code => Number.isFinite(stationYByCanonical[code]));
               if (codes.length < 2) continue;
               const x = stationXByCanonical[canonical];
-              const y = stationYByCanonical[codes[0]];
-              const labelY = y + 34;
-              svgContent += `<circle cx="${x}" cy="${y}" r="7" fill="#ffffff" stroke="#111827" stroke-width="3" />`;
+              
+              const ys = codes.map(c => stationYByCanonical[c]);
+              const minY = Math.min(...ys);
+              const maxY = Math.max(...ys);
+
+              // Draw vertical pill connecting the transfer stations
+              if (maxY > minY) {
+                  svgContent += `<rect x="${x - 8}" y="${minY}" width="16" height="${maxY - minY}" rx="8" fill="#ffffff" stroke="#111827" stroke-width="3" />`;
+              }
+
+              const y = minY;
+              const labelY = y - 34;
+              // Remove the standalone circle for the transfer hub, just rely on the nodes themselves and the vertical pill
+              // svgContent += `<circle cx="${x}" cy="${y}" r="7" fill="#ffffff" stroke="#111827" stroke-width="3" />`;
               svgContent += `<rect x="${x - 42}" y="${labelY - 16}" width="84" height="24" rx="12" fill="rgba(241,245,249,0.92)" stroke="#cbd5e1" stroke-width="1.5" />`;
               svgContent += `<text x="${x}" y="${labelY}" text-anchor="middle" fill="#334155" font-size="13" font-weight="800">${getStationDisplayName(canonical)}</text>`;
               labelShownForCanonical.add(canonical);