mirror of
https://github.com/LifeArchiveProject/WeChatDataAnalysis.git
synced 2026-02-19 22:30:49 +08:00
improvement(wrapped-ui): 优化年度总结可视化表现并适配主题
- 热力图支持按主题着色(Game Boy/DOS/VHS),并补充对应主题样式 - 字数键盘引入 10 级磨损系统:磨损/标注按等级平滑变化,并中文化提示 - 作息卡补充基于热力图的个性化叙事文案
This commit is contained in:
@@ -38,6 +38,41 @@ export const heatColor = (value, max) => {
|
||||
return `hsl(${hue.toFixed(1)} ${sat}% ${light.toFixed(1)}%)`
|
||||
}
|
||||
|
||||
// Theme-aware heat color function
|
||||
export const themedHeatColor = (value, max, theme) => {
|
||||
const v = Number(value) || 0
|
||||
const m = Number(max) || 0
|
||||
const t = (v > 0 && m > 0) ? clamp01(Math.sqrt(v / m)) : 0
|
||||
|
||||
switch (theme) {
|
||||
case 'gameboy': {
|
||||
// Game Boy 4-color palette: #0f380f, #306230, #8bac0f, #9bbc0f
|
||||
if (t === 0) return '#9bbc0f'
|
||||
if (t < 0.33) return '#8bac0f'
|
||||
if (t < 0.66) return '#306230'
|
||||
return '#0f380f'
|
||||
}
|
||||
case 'dos': {
|
||||
// DOS green phosphor: from dark to bright green
|
||||
if (t === 0) return 'rgba(51, 255, 51, 0.1)'
|
||||
const light = 20 + 60 * t
|
||||
return `hsl(120 100% ${light.toFixed(1)}%)`
|
||||
}
|
||||
case 'vhs': {
|
||||
// VHS: from dark blue to pink/magenta
|
||||
if (t === 0) return 'rgba(15, 52, 96, 0.3)'
|
||||
// Interpolate from #0f3460 (dark blue) to #e94560 (pink)
|
||||
const r = Math.round(15 + (233 - 15) * t)
|
||||
const g = Math.round(52 + (69 - 52) * t)
|
||||
const b = Math.round(96 + (96 - 96) * t)
|
||||
return `rgb(${r}, ${g}, ${b})`
|
||||
}
|
||||
default:
|
||||
// Modern (off) - use original heatColor
|
||||
return heatColor(value, max)
|
||||
}
|
||||
}
|
||||
|
||||
export const formatHourRange = (hour) => {
|
||||
const h = Number(hour)
|
||||
if (!Number.isFinite(h)) return ''
|
||||
|
||||
Reference in New Issue
Block a user