Files
get-colors-from-beans/COLORMAP_README.md
2026-01-06 04:16:17 +08:00

318 lines
6.5 KiB
Markdown
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# ColorMap 生成工具说明
## 简介
`parse-db.ts` 是一个用于将品牌颜色数据转换为颜色映射表的工具。它读取 `get-colors.json`,生成一个以颜色值为键的映射表。
## 功能
- 读取 `get-colors.json`(品牌颜色数据)
- 按颜色值Hex重新组织数据
- 生成 `colorMap.json`,格式为 `Color -> [品牌信息数组]`
- 提供详细统计信息
## 使用方法
### 运行解析脚本
```bash
bun run parse-db.ts
```
或使用 npm script:
```bash
bun run parse
```
### 运行使用示例
```bash
bun run example-colormap.ts
```
## 数据格式
### 输入格式get-colors.json
```json
{
"COCO-291": [
{
"color-name": "A01",
"color": "#FFFFFF"
}
],
"DMC-508": [...]
}
```
### 输出格式colorMap.json
```json
{
"#FFFFFF": [
{
"color-name": "A01",
"color-title": "COCO-291",
"color": "#FFFFFF"
},
{
"color-name": "L14",
"color-title": "COCO-291",
"color": "#FFFFFF"
},
{
"color-name": "B5200",
"color-title": "DMC-508",
"color": "#FFFFFF"
}
],
"#000000": [...]
}
```
## 数据结构
### 输入数据结构
```typescript
interface ColorItem {
"color-name": string;
color: string;
}
interface BrandData {
[brandName: string]: ColorItem[];
}
```
### 输出数据结构
```typescript
interface ColorGroupItem {
"color-name": string;
"color-title": string;
color: string;
}
interface ColorMap {
[color: string]: ColorGroupItem[];
}
```
## 统计信息
运行后显示以下统计信息:
- **处理的品牌数**: 31个
- **总颜色条目数**: 5888个
- **重复颜色数**: 3851个
- **唯一颜色数**: 2037个
## 使用示例
### 示例1查找特定颜色
```typescript
import colorMap from './colorMap.json';
function findColorByHex(hexColor: string) {
return colorMap[hexColor] || null;
}
const whiteColor = findColorByHex('#FFFFFF');
console.log(whiteColor);
// 输出包含32个元素的数组每个元素代表一个品牌对该颜色的使用
```
### 示例2统计颜色引用次数
```typescript
import colorMap from './colorMap.json';
const colorStats = Object.entries(colorMap)
.map(([color, items]) => ({ color, count: items.length }))
.sort((a, b) => b.count - a.count);
console.log('引用最多的颜色:', colorStats[0]);
// 输出: { color: '#FFFFFF', count: 32 }
```
### 示例3查找特定品牌的所有颜色
```typescript
import colorMap from './colorMap.json';
function findColorsByBrand(brandName: string) {
const results = [];
Object.entries(colorMap).forEach(([hexColor, items]) => {
items.forEach(item => {
if (item['color-title'] === brandName) {
results.push({
color: hexColor,
colorName: item['color-name']
});
}
});
});
return results;
}
const cocoColors = findColorsByBrand('COCO-291');
console.log(`COCO-291 有 ${cocoColors.length} 个颜色`);
```
### 示例4查找跨品牌共享的颜色
```typescript
import colorMap from './colorMap.json';
function findSharedColors(minBrandCount: number = 2) {
const sharedColors = [];
Object.entries(colorMap).forEach(([hexColor, items]) => {
const uniqueBrands = [...new Set(items.map(item => item['color-title']))];
if (uniqueBrands.length >= minBrandCount) {
sharedColors.push({
color: hexColor,
brands: uniqueBrands
});
}
});
return sharedColors.sort((a, b) => b.brands.length - a.brands.length);
}
const sharedColors = findSharedColors(5);
console.log(`被5个以上品牌共享的颜色: ${sharedColors.length}`);
```
### 示例5按色号查找颜色
```typescript
import colorMap from './colorMap.json';
function findColorByName(colorName: string) {
const results = [];
Object.entries(colorMap).forEach(([hexColor, items]) => {
items.forEach(item => {
if (item['color-name'] === colorName) {
results.push({
brand: item['color-title'],
color: hexColor
});
}
});
});
return results;
}
const a01Colors = findColorByName('A01');
console.log(`色号 A01 在 ${a01Colors.length} 个品牌中使用:`);
a01Colors.forEach(item => {
console.log(` - ${item.brand}: ${item.color}`);
});
```
## 常见颜色引用统计
### 引用最多的颜色前10名
| 排名 | 颜色 | 引用次数 | 主要品牌 |
|------|------|----------|----------|
| 1 | #FFFFFF | 32 | 所有品牌 |
| 2 | #000000 | 16 | 大部分品牌 |
| 3 | #F7EC5C | 15 | Mard, DODO等 |
| 4 | #FDA951 | 15 | Mard, DODO等 |
| 5 | #FA8C4F | 15 | Mard, DODO等 |
### 品牌颜色统计
| 品牌 | 颜色数量 |
|------|----------|
| DMC-508 | 508 |
| COCO-291 | 291 |
| DODO-291 | 291 |
| Mard-291 | 291 |
| 小舞-291 | 291 |
| 黄豆豆-291 | 291 |
| 咪小窝-290 | 290 |
## 性能优化建议
1. **颜色查找**: 使用 Map 或对象的直接访问,时间复杂度 O(1)
2. **批量处理**: 对于大量查找操作,可以预先建立索引
3. **内存优化**: 考虑使用更紧凑的数据格式,如压缩的 JSON
## 文件说明
| 文件 | 大小 | 说明 |
|------|------|------|
| parse-db.ts | ~3KB | 解析脚本 |
| get-colors.json | 374KB | 输入数据 |
| colorMap.json | 607KB | 输出数据 |
| example-colormap.ts | ~4KB | 使用示例 |
## 注意事项
1. **颜色重复**: 相同的 Hex 值会在不同品牌中被使用
2. **色号重复**: 相同的色号(如 A01可能对应不同的颜色值
3. **大小写敏感**: 颜色值的查找是大小写敏感的(建议统一转换)
## 故障排除
### 问题:找不到颜色
**解决方案**: 确保颜色值的格式正确,使用完整的 Hex 格式(如 #FFFFFF
```typescript
// ✅ 正确
findColorByHex('#FFFFFF');
// ✗ 错误
findColorByHex('FFFFFF');
findColorByHex('#ffffff'); // 大小写不匹配
```
### 问题:数据为空
**解决方案**: 检查 `get-colors.json` 是否存在且格式正确
```bash
# 检查文件
ls -lh get-colors.json
# 验证 JSON
node -e "const data = require('./get-colors.json'); console.log(Object.keys(data).length);"
```
### 问题:内存不足
**解决方案**: 对于大数据集,可以考虑分批处理或使用流式解析
## 相关文档
- [README.md](./README.md) - 颜色数据提取工具文档
- [QUICK_START.md](./QUICK_START.md) - 快速开始指南
## 更新日志
### v1.0.0 (2024-01-06)
- ✅ 初始版本发布
- ✅ 支持从 get-colors.json 生成 colorMap.json
- ✅ 提供完整的使用示例
- ✅ 详细的统计信息输出
## 贡献
如需提交问题或建议,请查看项目主文档。
## 许可证
MIT