fix: 优化边的显示效果

- 同层边使用向下弯曲的曲线连接，避免水平直线
- 相关图（GraphView）添加边的分数标签显示
- 分数标签跟随力导向布局实时更新位置

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

script/visualization/src/components/GraphView.vue

@@ -235,6 +235,30 @@ function renderGraph() {
     .attr('stroke', d => getEdgeStyle(d).color)
     .attr('stroke-width', 1.5)
 
+  // 边的分数标签
+  const linkLabelData = links.filter(d => getEdgeStyle(d).scoreText)
+  const linkLabel = g.append('g')
+    .selectAll('g')
+    .data(linkLabelData)
+    .join('g')
+    .attr('class', 'graph-link-label')
+
+  linkLabel.append('rect')
+    .attr('x', -14)
+    .attr('y', -6)
+    .attr('width', 28)
+    .attr('height', 12)
+    .attr('rx', 2)
+    .attr('fill', '#1d232a')
+    .attr('opacity', 0.9)
+
+  linkLabel.append('text')
+    .attr('text-anchor', 'middle')
+    .attr('dy', '0.35em')
+    .attr('fill', d => getEdgeStyle(d).color)
+    .attr('font-size', '8px')
+    .text(d => getEdgeStyle(d).scoreText)
+
   // 节点组
   const node = g.append('g')
     .selectAll('g')
@@ -299,6 +323,13 @@ function renderGraph() {
       .attr('x2', d => d.target.x)
       .attr('y2', d => d.target.y)
 
+    // 分数标签位置（边的中点）
+    linkLabel.attr('transform', d => {
+      const midX = (d.source.x + d.target.x) / 2
+      const midY = (d.source.y + d.target.y) / 2
+      return `translate(${midX},${midY})`
+    })
+
     node.attr('transform', d => `translate(${d.x},${d.y})`)
   })
 }

script/visualization/src/components/PostTreeView.vue

@@ -607,6 +607,13 @@ function renderWalkedLayer() {
     .attr('stroke-width', d => getEdgeStyle({ type: d.type, score: d.score }).strokeWidth)
     .attr('stroke-dasharray', d => getEdgeStyle({ type: d.type, score: d.score }).strokeDasharray)
     .attr('d', d => {
+      // 同一层的边（Y坐标相近）用向下弯曲的曲线
+      if (Math.abs(d.srcY - d.tgtY) < 10) {
+        const controlY = d.srcY + 50  // 向下弯曲
+        const midX = (d.srcX + d.tgtX) / 2
+        return `M${d.srcX},${d.srcY} Q${midX},${controlY} ${d.tgtX},${d.tgtY}`
+      }
+      // 不同层的边用 S 形曲线
       const midY = (d.srcY + d.tgtY) / 2
       return `M${d.srcX},${d.srcY} C${d.srcX},${midY} ${d.tgtX},${midY} ${d.tgtX},${d.tgtY}`
     })
@@ -619,7 +626,8 @@ function renderWalkedLayer() {
     .attr('class', 'walked-score')
     .attr('transform', d => {
       const midX = (d.srcX + d.tgtX) / 2
-      const midY = (d.srcY + d.tgtY) / 2
+      // 同一层的边，分数标签放在曲线最低点
+      const midY = Math.abs(d.srcY - d.tgtY) < 10 ? d.srcY + 50 : (d.srcY + d.tgtY) / 2
       return `translate(${midX}, ${midY})`
     })