Add Font Awesome v4 compatibility WOFF2 file

research/ai_companys/outline.md

@@ -0,0 +1,71 @@
+# AI产业链上市公司护城河深度分析 - 项目大纲
+
+## 项目概述
+创建一个专业的AI产业链分析网站，展示中国AI上市公司的护城河深度分析，包含丰富的数据可视化和交互元素。
+
+## 网站结构
+
+### 1. 主页面 (index.html)
+- **Hero区域**: 动态背景效果 + 主标题
+- **产业链概览**: 上游、中游、下游的可视化展示
+- **公司矩阵**: 交互式公司卡片网格
+- **关键数据**: 市场数据可视化图表
+- **分析洞察**: 护城河深度分析摘要
+
+### 2. 公司详情页 (company.html)
+- **公司概览**: 基本信息和核心业务
+- **护城河分析**: 深度技术分析
+- **市场表现**: 财务数据和市场份额
+- **竞争优势**: SWOT分析可视化
+- **未来发展**: 战略展望
+
+### 3. 产业链分析页 (analysis.html)
+- **产业链全景**: 三层结构详细分析
+- **技术壁垒**: 核心技术对比
+- **市场格局**: 竞争态势分析
+- **发展趋势**: 未来预测
+
+### 4. 数据看板页 (dashboard.html)
+- **实时数据**: 市场表现监控
+- **对比分析**: 多公司数据对比
+- **趋势预测**: 数据驱动的洞察
+- **交互图表**: 可筛选的数据可视化
+
+## 核心功能
+
+### 交互元素
+1. **公司筛选器**: 按产业链位置、市值、技术领域筛选
+2. **数据对比工具**: 多公司数据对比功能
+3. **交互式图表**: 可点击、悬停的数据可视化
+4. **搜索功能**: 公司和技术的快速搜索
+
+### 视觉效果
+1. **动态背景**: 使用shader-park创建科技感的背景
+2. **数据动画**: 使用ECharts实现数据动画效果
+3. **滚动动画**: 使用Anime.js创建滚动触发动画
+4. **悬停效果**: 卡片和按钮的3D悬停效果
+
+### 内容结构
+1. **上游**: AI芯片、算力、数据、算法
+2. **中游**: AI开发框架、模型、平台
+3. **下游**: 行业解决方案、产品服务
+
+## 技术栈
+- **前端框架**: 纯HTML/CSS/JavaScript
+- **样式**: Tailwind CSS
+- **动画**: Anime.js
+- **图表**: ECharts.js
+- **特效**: shader-park, p5.js
+- **字体**: Noto Sans SC (标题), Noto Serif SC (正文)
+
+## 设计原则
+- **专业权威**: 体现深度分析的专业性
+- **现代科技**: 展现AI产业的科技属性
+- **数据驱动**: 突出数据可视化的重要性
+- **交互友好**: 提供良好的用户体验
+
+## 内容重点
+- 深度分析各公司的技术护城河
+- 展示市场数据和竞争格局
+- 提供交互式的数据探索体验
+- 突出中国AI产业的发展特色