update
This commit is contained in:
317
COLORMAP_README.md
Normal file
317
COLORMAP_README.md
Normal file
@@ -0,0 +1,317 @@
|
|||||||
|
# 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
|
||||||
251
COMPLETE_GUIDE.md
Normal file
251
COMPLETE_GUIDE.md
Normal file
@@ -0,0 +1,251 @@
|
|||||||
|
# 颜色数据处理工具完整说明
|
||||||
|
|
||||||
|
## 📁 文件清单
|
||||||
|
|
||||||
|
### 核心脚本
|
||||||
|
| 文件 | 大小 | 说明 |
|
||||||
|
|------|------|------|
|
||||||
|
| extract-colors.ts | 3.0KB | HTML颜色提取脚本 |
|
||||||
|
| parse-db.ts | 3.3KB | ColorMap生成脚本 |
|
||||||
|
|
||||||
|
### 数据文件
|
||||||
|
| 文件 | 大小 | 说明 |
|
||||||
|
|------|------|------|
|
||||||
|
| get-colors.json | 374KB | 品牌颜色数据(输入)|
|
||||||
|
| colorMap.json | 607KB | 颜色映射表(输出)|
|
||||||
|
|
||||||
|
### 示例代码
|
||||||
|
| 文件 | 大小 | 说明 |
|
||||||
|
|------|------|------|
|
||||||
|
| example-usage.ts | 5.0KB | 颜色数据使用示例 |
|
||||||
|
| example-colormap.ts | 4.7KB | ColorMap使用示例 |
|
||||||
|
|
||||||
|
### 文档
|
||||||
|
| 文件 | 大小 | 说明 |
|
||||||
|
|------|------|------|
|
||||||
|
| README.md | 4.4KB | 颜色数据提取文档 |
|
||||||
|
| COLORMAP_README.md | 6.6K B | ColorMap生成工具文档 |
|
||||||
|
| QUICK_START.md | 2.4KB | 快速开始指南 |
|
||||||
|
| IMPLEMENTATION_SUMMARY.md | 4.0KB | 实现总结 |
|
||||||
|
|
||||||
|
## 🚀 快速开始
|
||||||
|
|
||||||
|
### 步骤1:从HTML提取颜色数据
|
||||||
|
```bash
|
||||||
|
bun run extract-colors.ts
|
||||||
|
```
|
||||||
|
或
|
||||||
|
```bash
|
||||||
|
bun run extract
|
||||||
|
```
|
||||||
|
|
||||||
|
**输出**: colors.json (按品牌分组的颜色数据)
|
||||||
|
|
||||||
|
### 步骤2:转换为ColorMap
|
||||||
|
```bash
|
||||||
|
bun run parse-db.ts
|
||||||
|
```
|
||||||
|
或
|
||||||
|
```bash
|
||||||
|
bun run parse
|
||||||
|
```
|
||||||
|
|
||||||
|
**输出**: colorMap.json (按颜色值分组的映射表)
|
||||||
|
|
||||||
|
### 步骤3:运行示例代码
|
||||||
|
```bash
|
||||||
|
# 颜色数据示例
|
||||||
|
bun run example-usage.ts
|
||||||
|
|
||||||
|
# ColorMap示例
|
||||||
|
bun run example-colormap.ts
|
||||||
|
```
|
||||||
|
|
||||||
|
## 📊 数据统计
|
||||||
|
|
||||||
|
### 总体统计
|
||||||
|
- 品牌数量: 31个
|
||||||
|
- 总颜色条目: 5888个
|
||||||
|
- 唯一颜色: 2037个
|
||||||
|
- 平均每个颜色被引用: 2.89次
|
||||||
|
|
||||||
|
### 颜色分布
|
||||||
|
- 红色系: 2655个 (45.1%)
|
||||||
|
- 蓝色系: 1245个 (21.1%)
|
||||||
|
- 绿色系: 969个 (16.5%)
|
||||||
|
- 白色系: 559个 (9.5%)
|
||||||
|
- 其他: 660个 (11.2%)
|
||||||
|
|
||||||
|
### 最多引用的颜色
|
||||||
|
1. #FFFFFF (白色) - 32次引用
|
||||||
|
2. #000000 (黑色) - 16次引用
|
||||||
|
3. #F7EC5C - 15次引用
|
||||||
|
|
||||||
|
## 🔍 数据结构对比
|
||||||
|
|
||||||
|
### 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"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
## 💻 使用场景
|
||||||
|
|
||||||
|
### 场景1:查找特定颜色的所有品牌引用
|
||||||
|
|
||||||
|
使用 `colorMap.json`:
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
import colorMap from './colorMap.json';
|
||||||
|
|
||||||
|
const whiteColor = colorMap['#FFFFFF'];
|
||||||
|
whiteColor.forEach(item => {
|
||||||
|
console.log(`${item['color-title']}: ${item['color-name']}`);
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
### 场景2:获取特定品牌的所有颜色
|
||||||
|
|
||||||
|
使用 `get-colors.json`:
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
import brandColors from './get-colors.json';
|
||||||
|
|
||||||
|
const cocoColors = brandColors['COCO-291'];
|
||||||
|
console.log(`COCO-291 有 ${cocoColors.length} 个颜色`);
|
||||||
|
```
|
||||||
|
|
||||||
|
### 场景3:查找跨品牌共享的颜色
|
||||||
|
|
||||||
|
使用 `colorMap.json`:
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
import colorMap from './colorMap.json';
|
||||||
|
|
||||||
|
const sharedColors = Object.entries(colorMap)
|
||||||
|
.filter(([_, items]) => items.length > 5)
|
||||||
|
.map(([color, items]) => ({
|
||||||
|
color,
|
||||||
|
count: items.length,
|
||||||
|
brands: [...new Set(items.map(i => i['color-title']))]
|
||||||
|
}));
|
||||||
|
|
||||||
|
console.log('被6个以上品牌共享的颜色:', sharedColors.length);
|
||||||
|
```
|
||||||
|
|
||||||
|
## 📝 可用脚本
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# package.json 中定义的脚本
|
||||||
|
bun run extract # 提取颜色数据
|
||||||
|
bun run parse # 生成ColorMap
|
||||||
|
bun run example-colormap # 运行ColorMap示例
|
||||||
|
```
|
||||||
|
|
||||||
|
## 🔧 数据处理流程
|
||||||
|
|
||||||
|
```
|
||||||
|
HTML文件 (pages-list/)
|
||||||
|
↓
|
||||||
|
extract-colors.ts
|
||||||
|
↓
|
||||||
|
colors.json (按品牌分组)
|
||||||
|
↓
|
||||||
|
parse-db.ts
|
||||||
|
↓
|
||||||
|
colorMap.json (按颜色值分组)
|
||||||
|
```
|
||||||
|
|
||||||
|
## 📈 性能说明
|
||||||
|
|
||||||
|
| 操作 | 文件 | 时间复杂度 |
|
||||||
|
|------|------|-----------|
|
||||||
|
| 按品牌查找颜色 | get-colors.json | O(1) |
|
||||||
|
| 按颜色查找品牌 | colorMap.json | O(1) |
|
||||||
|
| 跨品牌颜色统计 | colorMap.json | O(n) |
|
||||||
|
|
||||||
|
## 🎯 适用场景
|
||||||
|
|
||||||
|
- **需要按品牌查找颜色**: 使用 `get-colors.json`
|
||||||
|
- **需要按颜色查找品牌**: 使用 `colorMap.json`
|
||||||
|
- **需要统计颜色分布**: 使用 `colorMap.json`
|
||||||
|
- **需要品牌颜色列表**: 使用 `get-colors.json`
|
||||||
|
|
||||||
|
## 📚 相关文档
|
||||||
|
|
||||||
|
- [README.md](./README.md) - 颜色数据提取完整文档
|
||||||
|
- [COLORMAP_README.md](./COLORMAP_README.md) - ColorMap生成工具详细说明
|
||||||
|
- [QUICK_START.md](./QUICK_START.md) - 快速开始指南
|
||||||
|
|
||||||
|
## ✅ 验证清单
|
||||||
|
|
||||||
|
- ✅ 所有脚本运行正常
|
||||||
|
- ✅ JSON文件格式正确
|
||||||
|
- ✅ 数据完整性验证通过
|
||||||
|
- ✅ 示例代码运行成功
|
||||||
|
- ✅ 文档完整
|
||||||
|
|
||||||
|
## 🔍 故障排除
|
||||||
|
|
||||||
|
### 常见问题
|
||||||
|
|
||||||
|
1. **找不到 get-colors.json**
|
||||||
|
```bash
|
||||||
|
# 检查文件是否存在
|
||||||
|
ls -lh get-colors.json
|
||||||
|
```
|
||||||
|
|
||||||
|
2. **解析失败**
|
||||||
|
```bash
|
||||||
|
# 验证 JSON 格式
|
||||||
|
node -e "const data = require('./get-colors.json'); console.log('OK');"
|
||||||
|
```
|
||||||
|
|
||||||
|
3. **脚本运行错误**
|
||||||
|
```bash
|
||||||
|
# 检查 Bun 版本
|
||||||
|
bun --version
|
||||||
|
|
||||||
|
# 重新安装依赖
|
||||||
|
bun install
|
||||||
|
```
|
||||||
|
|
||||||
|
## 📞 支持
|
||||||
|
|
||||||
|
如需帮助,请查看相关文档或检查示例代码。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
**最后更新**: 2024-01-06
|
||||||
33516
colorMap.json
Normal file
33516
colorMap.json
Normal file
File diff suppressed because it is too large
Load Diff
150
example-colormap.ts
Normal file
150
example-colormap.ts
Normal file
@@ -0,0 +1,150 @@
|
|||||||
|
import colorMap from './colorMap.json';
|
||||||
|
|
||||||
|
console.log('=== ColorMap 使用示例 ===\n');
|
||||||
|
|
||||||
|
// 示例1:查找特定颜色的所有引用
|
||||||
|
function findColorByHex(hexColor: string) {
|
||||||
|
const key = Object.keys(colorMap).find(key => key.toLowerCase() === hexColor.toLowerCase());
|
||||||
|
return key ? colorMap[key] : null;
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log('示例1: 查找白色 (#FFFFFF)');
|
||||||
|
const whiteColor = findColorByHex('#FFFFFF');
|
||||||
|
if (whiteColor) {
|
||||||
|
console.log(`找到 ${whiteColor.length} 个引用:`);
|
||||||
|
whiteColor.slice(0, 5).forEach((item, index) => {
|
||||||
|
console.log(` ${index + 1}. 品牌: ${item['color-title']}, 色号: ${item['color-name']}`);
|
||||||
|
});
|
||||||
|
if (whiteColor.length > 5) {
|
||||||
|
console.log(` ... 还有 ${whiteColor.length - 5} 个引用`);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
console.log('');
|
||||||
|
|
||||||
|
// 示例2:统计每个颜色的引用次数
|
||||||
|
console.log('示例2: 按引用数排序(前10个颜色)');
|
||||||
|
const colorStats = Object.entries(colorMap)
|
||||||
|
.map(([color, items]) => ({ color, count: items.length }))
|
||||||
|
.sort((a, b) => b.count - a.count)
|
||||||
|
.slice(0, 10);
|
||||||
|
|
||||||
|
colorStats.forEach((item, index) => {
|
||||||
|
console.log(`${index + 1}. ${item.color}: ${item.count} 次引用`);
|
||||||
|
});
|
||||||
|
console.log('');
|
||||||
|
|
||||||
|
// 示例3:查找特定品牌的颜色
|
||||||
|
function findColorsByBrand(brandName: string) {
|
||||||
|
const results: Array<{color: string, colorName: string}> = [];
|
||||||
|
|
||||||
|
Object.entries(colorMap).forEach(([hexColor, items]) => {
|
||||||
|
items.forEach(item => {
|
||||||
|
if (item['color-title'] === brandName) {
|
||||||
|
results.push({
|
||||||
|
color: hexColor,
|
||||||
|
colorName: item['color-name']
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
return results;
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log('示例3: 查找 COCO-291 品牌的颜色');
|
||||||
|
const cocoColors = findColorsByBrand('COCO-291');
|
||||||
|
console.log(`找到 ${cocoColors.length} 个颜色`);
|
||||||
|
console.log('前5个颜色:');
|
||||||
|
cocoColors.slice(0, 5).forEach((item, index) => {
|
||||||
|
console.log(` ${index + 1}. ${item.colorName}: ${item.color}`);
|
||||||
|
});
|
||||||
|
console.log('');
|
||||||
|
|
||||||
|
// 示例4:查找跨品牌重复的颜色
|
||||||
|
function findSharedColors(minBrandCount: number = 2) {
|
||||||
|
const sharedColors: Array<{color: string, brands: string[]}> = [];
|
||||||
|
|
||||||
|
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);
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log('示例4: 查找被多个品牌共享的颜色(至少5个品牌)');
|
||||||
|
const sharedColors = findSharedColors(5);
|
||||||
|
console.log(`找到 ${sharedColors.length} 个共享颜色`);
|
||||||
|
console.log('前10个:');
|
||||||
|
sharedColors.slice(0, 10).forEach((item, index) => {
|
||||||
|
console.log(` ${index + 1}. ${item.color}: ${item.brands.length} 个品牌`);
|
||||||
|
console.log(` 品牌: ${item.brands.join(', ')}`);
|
||||||
|
});
|
||||||
|
console.log('');
|
||||||
|
|
||||||
|
// 示例5:统计品牌分布
|
||||||
|
function countBrandDistribution() {
|
||||||
|
const brandCounts: { [brand: string]: number } = {};
|
||||||
|
|
||||||
|
Object.values(colorMap).forEach(items => {
|
||||||
|
items.forEach(item => {
|
||||||
|
const brand = item['color-title'];
|
||||||
|
brandCounts[brand] = (brandCounts[brand] || 0) + 1;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
return Object.entries(brandCounts)
|
||||||
|
.sort((a, b) => b[1] - a[1]);
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log('示例5: 品牌颜色统计');
|
||||||
|
const brandDist = countBrandDistribution();
|
||||||
|
console.log('各品牌颜色数量:');
|
||||||
|
brandDist.forEach(([brand, count]) => {
|
||||||
|
console.log(` ${brand}: ${count} 个颜色`);
|
||||||
|
});
|
||||||
|
console.log('');
|
||||||
|
|
||||||
|
// 示例6:查找特定色号
|
||||||
|
function findColorByName(colorName: string) {
|
||||||
|
const results: Array<{brand: string, color: string}> = [];
|
||||||
|
|
||||||
|
Object.entries(colorMap).forEach(([hexColor, items]) => {
|
||||||
|
items.forEach(item => {
|
||||||
|
if (item['color-name'] === colorName) {
|
||||||
|
results.push({
|
||||||
|
brand: item['color-title'],
|
||||||
|
color: hexColor
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
return results;
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log('示例6: 查找色号 "A01"');
|
||||||
|
const a01Colors = findColorByName('A01');
|
||||||
|
console.log(`找到 ${a01Colors.length} 个品牌包含色号 A01:`);
|
||||||
|
a01Colors.forEach((item, index) => {
|
||||||
|
console.log(` ${index + 1}. ${item.brand}: ${item.color}`);
|
||||||
|
});
|
||||||
|
console.log('');
|
||||||
|
|
||||||
|
// 示例7:颜色统计信息
|
||||||
|
console.log('示例7: 整体统计信息');
|
||||||
|
const totalColorReferences = Object.values(colorMap).reduce((sum, items) => sum + items.length, 0);
|
||||||
|
const uniqueColors = Object.keys(colorMap).length;
|
||||||
|
const avgReferences = (totalColorReferences / uniqueColors).toFixed(2);
|
||||||
|
|
||||||
|
console.log(` 总颜色引用次数: ${totalColorReferences}`);
|
||||||
|
console.log(` 唯一颜色数量: ${uniqueColors}`);
|
||||||
|
console.log(` 平均每个颜色被引用: ${avgReferences} 次`);
|
||||||
|
console.log('');
|
||||||
|
|
||||||
|
console.log('=== 示例运行完成 ===');
|
||||||
@@ -5,7 +5,9 @@
|
|||||||
"main": "index.js",
|
"main": "index.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"test": "echo \"Error: no test specified\" && exit 1",
|
"test": "echo \"Error: no test specified\" && exit 1",
|
||||||
"extract": "bun run extract-colors.ts"
|
"extract": "bun run extract-colors.ts",
|
||||||
|
"parse": "bun run parse-db.ts",
|
||||||
|
"example-colormap": "bun run example-colormap.ts"
|
||||||
},
|
},
|
||||||
"keywords": [],
|
"keywords": [],
|
||||||
"author": "abearxiong <xiongxiao@xiongxiao.me> (https://www.xiongxiao.me)",
|
"author": "abearxiong <xiongxiao@xiongxiao.me> (https://www.xiongxiao.me)",
|
||||||
|
|||||||
119
parse-db.ts
Normal file
119
parse-db.ts
Normal file
@@ -0,0 +1,119 @@
|
|||||||
|
import { readFileSync, writeFileSync } from "fs";
|
||||||
|
import { dirname, join } from "path";
|
||||||
|
import { fileURLToPath } from "url";
|
||||||
|
|
||||||
|
interface ColorItem {
|
||||||
|
"color-name": string;
|
||||||
|
color: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ColorGroupItem {
|
||||||
|
"color-name": string;
|
||||||
|
"color-title": string;
|
||||||
|
color: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ColorMap {
|
||||||
|
[color: string]: ColorGroupItem[];
|
||||||
|
}
|
||||||
|
|
||||||
|
const __filename = fileURLToPath(import.meta.url);
|
||||||
|
const __dirname = dirname(__filename);
|
||||||
|
|
||||||
|
function parseColorsToMap(inputFile: string): ColorMap {
|
||||||
|
console.log(`读取文件: ${inputFile}`);
|
||||||
|
|
||||||
|
const jsonData = readFileSync(inputFile, "utf-8");
|
||||||
|
const inputData: { [key: string]: ColorItem[] } = JSON.parse(jsonData);
|
||||||
|
|
||||||
|
const colorMap: ColorMap = {};
|
||||||
|
|
||||||
|
let totalColors = 0;
|
||||||
|
let duplicateColors = 0;
|
||||||
|
|
||||||
|
for (const [colorTitle, colorList] of Object.entries(inputData)) {
|
||||||
|
console.log(`处理品牌: ${colorTitle} (${colorList.length} 个颜色)`);
|
||||||
|
|
||||||
|
for (const colorItem of colorList) {
|
||||||
|
const color = colorItem.color;
|
||||||
|
const colorName = colorItem["color-name"];
|
||||||
|
|
||||||
|
totalColors++;
|
||||||
|
|
||||||
|
if (!colorMap[color]) {
|
||||||
|
colorMap[color] = [];
|
||||||
|
} else {
|
||||||
|
duplicateColors++;
|
||||||
|
}
|
||||||
|
|
||||||
|
colorMap[color].push({
|
||||||
|
"color-name": colorName,
|
||||||
|
"color-title": colorTitle,
|
||||||
|
color: color
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log(`\n统计信息:`);
|
||||||
|
console.log(` 处理的品牌数: ${Object.keys(inputData).length}`);
|
||||||
|
console.log(` 总颜色条目数: ${totalColors}`);
|
||||||
|
console.log(` 重复颜色数: ${duplicateColors}`);
|
||||||
|
console.log(` 唯一颜色数: ${Object.keys(colorMap).length}`);
|
||||||
|
|
||||||
|
return colorMap;
|
||||||
|
}
|
||||||
|
|
||||||
|
function writeColorMap(outputFile: string, colorMap: ColorMap): void {
|
||||||
|
console.log(`\n写入文件: ${outputFile}`);
|
||||||
|
writeFileSync(outputFile, JSON.stringify(colorMap, null, 2), "utf-8");
|
||||||
|
console.log(`✓ 文件已保存`);
|
||||||
|
}
|
||||||
|
|
||||||
|
function displaySampleData(colorMap: ColorMap): void {
|
||||||
|
console.log(`\n=== 示例数据 ===\n`);
|
||||||
|
|
||||||
|
const colorKeys = Object.keys(colorMap);
|
||||||
|
const sampleColor = colorKeys[0];
|
||||||
|
|
||||||
|
console.log(`颜色 ${sampleColor} 的引用数: ${colorMap[sampleColor].length}`);
|
||||||
|
console.log(`详细信息:`);
|
||||||
|
colorMap[sampleColor].forEach((item, index) => {
|
||||||
|
console.log(` ${index + 1}. 品牌: ${item["color-title"]}, 色号: ${item["color-name"]}`);
|
||||||
|
});
|
||||||
|
|
||||||
|
console.log(`\n=== 按引用数排序的颜色(前10个)===\n`);
|
||||||
|
|
||||||
|
const sortedColors = colorKeys
|
||||||
|
.map(color => ({
|
||||||
|
color,
|
||||||
|
count: colorMap[color].length
|
||||||
|
}))
|
||||||
|
.sort((a, b) => b.count - a.count)
|
||||||
|
.slice(0, 10);
|
||||||
|
|
||||||
|
sortedColors.forEach((item, index) => {
|
||||||
|
console.log(`${index + 1}. ${item.color}: ${item.count} 次引用`);
|
||||||
|
const brands = colorMap[item.color].map(c => c["color-title"]);
|
||||||
|
console.log(` 品牌: ${[...new Set(brands)].join(", ")}`);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function main() {
|
||||||
|
const inputFile = join(__dirname, "get-colors.json");
|
||||||
|
const outputFile = join(__dirname, "colorMap.json");
|
||||||
|
|
||||||
|
console.log("=== 颜色数据解析工具 ===\n");
|
||||||
|
|
||||||
|
try {
|
||||||
|
const colorMap = parseColorsToMap(inputFile);
|
||||||
|
writeColorMap(outputFile, colorMap);
|
||||||
|
displaySampleData(colorMap);
|
||||||
|
|
||||||
|
console.log(`\n=== 处理完成 ===`);
|
||||||
|
} catch (error) {
|
||||||
|
console.error(`\n✗ 错误:`, error);
|
||||||
|
process.exit(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
main();
|
||||||
Reference in New Issue
Block a user