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

This commit is contained in:
douboer@gmail.com
2026-01-28 16:48:40 +08:00
parent e14ed0f9fc
commit 6a7120f685

View File

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