| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253 |
- // 票 15 取证（三）：填充类型分布、Panel 节点全量样式（底色/边框/圆角/阴影）、渐变停靠点
- import { readFileSync } from 'node:fs'
- const dir = '.scratch/lanhu-cockpit-asset-replacement/research/raw-v2'
- const boards = [2, 3, 4, 5, 6, 7, 8, 9, 10]
- const hex = (c) => `#${[c.r, c.g, c.b].map((v) => Math.round(v * 255).toString(16).padStart(2, '0')).join('')}`
- const alpha = (c) => (c.a === undefined || c.a > 0.999 ? '' : `@${c.a.toFixed(2)}`)
- const load = (n) => JSON.parse(readFileSync(`${dir}/desktop-${String(n).padStart(2, '0')}.json`, 'utf8')).artboard
- const fillTypes = new Map()
- const gradients = new Map()
- const effects = new Map()
- const panelNodes = []
- for (const n of boards) {
- const ab = load(n)
- ;(function walk(node, path = '') {
- const p = path ? `${path}/${node.name}` : node.name
- for (const f of node.style?.fills || []) {
- fillTypes.set(f.type, (fillTypes.get(f.type) || 0) + 1)
- if (f.type === 'gradient') {
- const stops = (f.stops || f.gradientStops || []).map((s) => `${hex(s.color)}${alpha(s.color)}@${Math.round((s.position ?? 0) * 100)}%`).join(' → ')
- const key = `${f.gradientType || f.type}: ${stops}`
- gradients.set(key, (gradients.get(key) || 0) + 1)
- }
- }
- for (const s of node.style?.shadows || []) {
- const k = `${s.type || 'shadow'} ${s.color ? hex(s.color) + alpha(s.color) : '-'} blur${s.blur ?? s.radius ?? ''} x${s.offsetX ?? s.x ?? ''} y${s.offsetY ?? s.y ?? ''}`
- effects.set(k, (effects.get(k) || 0) + 1)
- }
- for (const b of node.style?.blurs || []) {
- const k = `blur ${b.type || ''} r${b.radius ?? ''}`
- effects.set(k, (effects.get(k) || 0) + 1)
- }
- if (/^Panel/.test(node.name) && node.frame?.width >= 300) {
- panelNodes.push({ board: ab.name, path: p, w: Math.round(node.frame.width), h: Math.round(node.frame.height), fills: (node.style?.fills || []).map((f) => `${f.type}:${f.type === 'color' ? hex(f.color) + alpha(f.color) : JSON.stringify(f).slice(0, 80)}`), borders: (node.style?.borders || []).map((b) => `${b.color ? hex(b.color) + alpha(b.color) : '-'} w${b.width ?? ''} ${b.position ?? ''}`), radius: node.radius, opacity: node.style?.opacity })
- }
- for (const c of node.layers || []) walk(c, p)
- })(ab, '')
- }
- console.log('=== 填充类型:', [...fillTypes.entries()].map(([k, v]) => `${k}×${v}`).join(' | '))
- console.log('\n=== 渐变 Top 20')
- console.log([...gradients.entries()].sort((a, b) => b[1] - a[1]).slice(0, 20).map(([k, v]) => `${k} ×${v}`).join('\n') || '(无)')
- console.log('\n=== 阴影/模糊 Top 15')
- console.log([...effects.entries()].sort((a, b) => b[1] - a[1]).slice(0, 15).map(([k, v]) => `${k} ×${v}`).join('\n') || '(无)')
- console.log('\n=== Panel 节点（≥300 宽）前 12')
- for (const p of panelNodes.slice(0, 12)) {
- console.log(`[${p.board}] ${p.path} ${p.w}x${p.h} opacity=${p.opacity}`)
- console.log(` fills: ${p.fills.join(' ; ')}`)
- console.log(` borders: ${p.borders.join(' ; ') || '(无)'} radius=${JSON.stringify(p.radius)}`)
- }
- console.log(`\n共 ${panelNodes.length} 个 Panel 节点`)
|
