Stock Industry Chain

---
name: stock-industry-chain
description: 输入一只 A 股或美股公司（名称或代码），研究其产业链上下游，生成一个复刻"产业链概念图谱"样式的交互式 HTML 页面 —— 按分类（材料供应/设备/封测/参股等）网格排列相关公司，每个公司可点击弹出资料卡。适用于用户说"分析某公司的产业链""画出某股票的上下游""产业链图谱""上下游公司"等场景。生成的 HTML 可一键导出 PNG。
---

# 股票产业链图谱 (Stock Industry Chain)

给定一只股票，产出一张复刻券商/股吧"产业链概念图谱"样式的**交互式 HTML**：左侧是分类标签（如 材料供应 / 设备 / 封测 / 参股 / 同业），右侧是该分类下的相关公司网格，**每个公司可点击**弹出资料卡（主营、产业链位置、产品、客户、关键数据）。

## 工作流程

### 1. 确认目标公司
- 解析用户输入（中文名 / 英文名 / 股票代码 / 概念名）。先确定：是 A 股还是美股？是具体上市公司，还是一个产业链概念（如"长江存储概念""CPO 概念"）？
- 如果输入有歧义（多个同名公司、不确定市场），简短追问一句再继续。

### 2. 研究产业链（数据来源：Claude 知识 + 联网）
用你的知识打底，并用 **WebSearch / WebFetch 核实和补充**，尤其是：
- 上市公司具体代码、最新归属（防止记错代码 / 已退市 / 已改名）。
- 较冷门或较新的概念，知识可能不全或过时——必须联网。
- A 股建议搜索关键词：`<公司/概念> 产业链 上游 下游 供应商 客户`、`<概念> 概念股 龙头`；可参考 同花顺/东方财富/股吧 的产业链梳理。
- 美股建议搜索：`<company> supply chain suppliers customers`、`<company> upstream downstream` 以及 10-K 里的 suppliers/customers 段落。

按产业链角色把公司分组。**分类要贴合该行业**，不要硬套固定模板。常见分类示例：
- 半导体：`材料供应`、`设备`、`封测`、`设计/IP`、`晶圆制造`、`下游应用`
- 通用：`上游原料`、`中游制造`、`下游应用/客户`、`同业/竞争`、`参股`、`股东相关`
- 一个大分类可再切**子分组**（如截图里"关键供应"下分 模组 / 洁净室 / 其他）。

每家公司尽量给出：代码、所属市场、一句话角色。对**核心标的（5~10 家）**补全资料卡字段。其余可只给 name + ticker + role，保持页面信息密度。

> 诚实标注：这是基于公开信息的整理，不构成投资建议。代码 / 归属拿不准时联网核实，宁可少列也不要编造代码。

### 3. 生成数据 JSON
按下面 schema 写一个 JSON 文件（建议放 `outputs/<slug>.json`）。

### 4. 构建页面
```bash
python3 scripts/build.py <data.json> [output.html] [--png] [--open]
```
- 默认输出与数据同名的 `.html`（数据内联，单文件可分享）。
- `--png` 用无头 Chrome 导出贴合内容高度的长图（手机宽度）。
- `--open` 在浏览器打开。
- 典型：`python3 scripts/build.py outputs/foo.json outputs/foo.html --png --open`

构建后，向用户报告生成的 HTML / PNG 路径，并简述产业链结构（覆盖了哪些环节、核心标的是谁）。

## 数据 Schema

```jsonc
{
  "meta": {
    "title": "长江存储概念",          // 顶部红条标题
    "subtitle": "存储芯片 · 国产替代产业链", // 副标题（也可放涨跌幅如 "+3.42%"）
    "note": "数据由 Claude 整理，仅供参考，不构成投资建议。" // 底部小字
  },
  "target": "长江存储",  // 目标公司/概念名；页面里同名公司会自动加粗高亮（可选）
  "sections": [
    {
      "title": "材料供应",            // 左侧分类标签
      "companies": [                  // 该分类下公司（与 subgroups 二选一）
        {
          "name": "雅克科技",
          "ticker": "002409",
          "market": "深A",            // 沪A/深A/科创板/创业板/北交所/港股/NASDAQ/NYSE...
          "tag": "red",               // 可选: red|orange|core —— 高亮颜色/加粗
          "isNew": true,              // 可选: 名字右上角红"新"角标

          // —— 角色 & 基本面 ——
          "role": "前驱体/电子材料龙头", // 一句话角色（资料卡副标题）
          "reason": "前驱体直接用于…",  // 入选理由：为什么在这条产业链（开盘啦风格，建议核心标的都填）
          "business": "……",           // 主营业务
          "chainPosition": "……",      // 在产业链中的位置
          "products": ["前驱体","电子特气"], // 核心产品，渲染为 chips
          "customers": ["长江存储","三星"],  // 主要客户，渲染为 chips
          "concepts": ["半导体材料","国产替代"], // 所属概念：渲染为【可点击】蓝标签，点击高亮全表同概念个股
          "financials": "国内前驱体龙头",     // 关键数据/地位

          // —— 行情/资金（实时类，需接行情源；没有就留空，个股行情视图显示 — ）——
          "price": "45.20",           // 最新价（可选）
          "change": 3.42,             // 涨跌幅 %（数字，正=红涨 负=绿跌；可选）
          "netInflow": "+2.3亿",      // 主力净流入（可选）
          "marketCap": "约500亿",     // 流通市值（约数即可；用于个股行情视图按市值排序）

          // —— 异动/榜单（可选）——
          "moveReason": "存储涨价催化", // 涨停/异动原因
          "lhb": "多次登龙虎榜，游资关注", // 龙虎榜
          "holders": "约8.5万户",      // 股东人数
          "note": "……"                // 备注
        }
      ]
    },
    {
      "title": "关键供应",
      "subgroups": [                   // 带子分组的分类（与 companies 二选一）
        { "label": "模组",  "companies": [ /* 同上 */ ] },
        { "label": "洁净室","companies": [ /* … */ ] }
      ]
    }
  ]
}
```

字段说明：
- 一个 section 用 `companies`（扁平网格）**或** `subgroups`（先分子类再网格），不要同时用。
- 只有 `name` 是必填；其余都可选。点开公司时，资料卡只渲染填了的字段。
- `tag`：`red` 红字（强势/龙头），`orange` 橙字（活跃），`core` 加粗（核心标的）。不填即普通蓝字。
- 对齐「开盘啦」个股信息：尽量给核心标的填 `reason`(入选理由)、`concepts`(所属概念)、`marketCap`(流通市值)、`business`/`chainPosition`。`price`/`change`/`netInflow` 是实时数据——没有行情源就留空，别编造。

## 页面交互（已对齐开盘啦"题材库/小表格"）
生成的 HTML 含两个视图，顶部 `小表格 / 个股行情` 可切换：
- **小表格**：产业链分支网格（截图样式）。点公司 → 底部滑出**资料卡**。
- **资料卡**：顶部行情条 + **实时 K 线图**（见下）+ 入选理由/主营/产业链位置/产品/客户/所属概念/龙虎榜/股东人数…，只显示填了的字段。
- **实时 K 线**：资料卡里嵌入真实 TradingView K 线图（点公司即看股价走势），并配 `东方财富 / 雪球 / Yahoo / TradingView` 跳转完整行情页。**符号自动推导**：从 `ticker`+`market` 推出交易所代码（沪→SSE、深/创业板→SZSE、北交所→BSE、港股→HKEX、美股→NYSE/NASDAQ），无需手填。只有带可识别股票代码的公司才显示 K 线；公链/产品/未上市节点不显示。
- **个股行情**：把所有公司拉成一张行情列表，可按 `涨跌幅`/`流通市值` 排序；点行同样弹资料卡。无 `change` 数据时自动按市值排序。
- **所属概念**标签可点击 → 回到小表格并**高亮全表同概念个股**、其余变灰（顶部出现高亮提示条，✕ 清除）。
- A 股配色：红涨绿跌（`change` 正数红、负数绿）。
- K 线需联网（TradingView）；离线时显示提示 + 跳转链接兜底。`ticker` 务必准确（K 线/链接全靠它），拿不准要联网核实。

完整范例见 `examples/changjiang-cunchu.json`（截图里那张长江存储产业链的还原）。

## 文件结构
- `assets/template.html` —— 复刻截图样式的页面模板，含点击弹出资料卡的逻辑（`/*__DATA__*/` 是数据注入点）。
- `scripts/build.py` —— 注入数据、生成 HTML、可选导出 PNG。
- `examples/changjiang-cunchu.json` —— 数据范例 / schema 参考。
- `outputs/` —— 生成的 JSON / HTML / PNG。