update at 2026-01-28 16:48:40

detail-design.md

@@ -272,23 +272,17 @@ const label = '测'.repeat(textLength);
 
 ## 6. 颜色生成策略
 
-使用 HSL 颜色空间实现层次分明的配色：
+当前实现以主题色板为核心：`colorRef` 优先解析为主题色名，未命中时退回原值。
 
-```typescript
+**扇区填色优先级**：
-function generateSectorColor(
+1. 扇区级 `colorRef`
-  layerIndex: number, 
+2. 层级规律填色（`layer.colorRef` + `num/interval/patternOffset`）
-  pieIndex: number,
+3. 全局 `background`
-  totalPies: number = 24
-): string {
-  const hue = (pieIndex * 360) / totalPies;  // 色相均匀分布
-  const light = 78 - layerIndex * 10;         // 亮度由内向外递减
-  return `hsl(${hue} 70% ${light}%)`;
-}
-```
 
-**效果**：
+**刻度环颜色**：
-- 相邻扇区色相不同，易于区分
+- `degreeRing.colorRef` 存在时，渲染环形背景填充（作为刻度环背景）。
-- 内层较亮，外层较暗，突出层次
+- `tickColor` / `ringColor` 显式提供则优先使用；未提供时根据背景计算对比色。
+- `opacity` 同时作用于环形背景和内外圆环描边。
 
 ## 7. 组件架构