Files
vf_react/public/htmls/华为Mate80.html
2025-12-05 13:29:18 +08:00

467 lines
30 KiB
HTML
Raw 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.

<!DOCTYPE html>
<html lang="zh-CN" data-theme="night">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>华为Mate80 概念深度研究报告</title>
<link href="https://cdn.jsdelivr.net/npm/daisyui@4.10.1/dist/full.min.css" rel="stylesheet" type="text/css" />
<script src="https://cdn.tailwindcss.com"></script>
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/echarts@5.5.0/dist/echarts.min.js"></script>
<style>
body {
background-color: #0c0a15;
background-image:
radial-gradient(ellipse 80% 80% at 50% -20%, rgba(120, 119, 198, 0.3), rgba(255, 255, 255, 0)),
radial-gradient(circle at 80% 80%, rgba(100, 20, 150, 0.2), transparent),
radial-gradient(circle at 10% 20%, rgba(20, 100, 180, 0.2), transparent);
background-attachment: fixed;
color: #e0e0e0;
font-family: 'Inter', 'Helvetica Neue', 'Arial', 'sans-serif';
}
.glass-card {
background: rgba(18, 16, 33, 0.5);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
border: 1px solid rgba(120, 119, 198, 0.15);
border-radius: 1.5rem; /* 24px */
transition: all 0.3s ease;
box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.2);
}
.glass-card:hover {
border-color: rgba(120, 119, 198, 0.3);
transform: translateY(-5px);
}
.bento-grid {
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 1rem;
}
.bento-item {
grid-column: span 12;
}
@media (min-width: 1024px) {
.bento-item-1 { grid-column: span 8; grid-row: span 2; }
.bento-item-2 { grid-column: span 4; }
.bento-item-3 { grid-column: span 4; }
.bento-item-4 { grid-column: span 4; }
.bento-item-5 { grid-column: span 4; }
.bento-item-6 { grid-column: span 12;}
}
.glow-text {
text-shadow: 0 0 8px rgba(192, 182, 255, 0.6), 0 0 16px rgba(192, 182, 255, 0.4);
}
.section-title {
font-size: 2.25rem;
font-weight: 700;
letter-spacing: -0.025em;
margin-bottom: 1rem;
}
.sub-title {
font-size: 1.5rem;
font-weight: 600;
color: #c0b6f0;
border-left: 3px solid #8c52ff;
padding-left: 1rem;
margin-bottom: 1rem;
}
.styled-table {
border-collapse: separate;
border-spacing: 0;
width: 100%;
background-color: rgba(18, 16, 33, 0.5);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid rgba(120, 119, 198, 0.15);
border-radius: 1.5rem;
overflow: hidden;
}
.styled-table thead th {
background-color: rgba(45, 39, 85, 0.5);
color: #e0e0e0;
padding: 1rem 1.5rem;
text-align: left;
font-weight: 600;
}
.styled-table tbody tr {
transition: background-color 0.2s ease;
}
.styled-table tbody tr:hover {
background-color: rgba(120, 119, 198, 0.1);
}
.styled-table tbody td {
padding: 1rem 1.5rem;
border-top: 1px solid rgba(120, 119, 198, 0.1);
}
.styled-table a {
color: #a78bfa;
transition: color 0.2s;
}
.styled-table a:hover {
color: #c4b5fd;
}
.tab-lifted {
transition: all 0.3s ease;
}
.tab-lifted.tab-active {
background-color: rgba(120, 119, 198, 0.1) !important;
border-color: rgba(120, 119, 198, 0.3) !important;
color: #fff !important;
}
</style>
</head>
<body class="min-h-screen">
<div class="container mx-auto p-4 md:p-8">
<header class="text-center py-12">
<h1 class="text-5xl md:text-7xl font-bold glow-text bg-clip-text text-transparent bg-gradient-to-br from-white to-purple-300">
华为Mate80 概念深度研究
</h1>
<p class="mt-4 text-lg text-gray-400">
北京价值前沿科技有限公司 AI投研agent“价小前投研” 呈现
</p>
</header>
<main class="space-y-12">
<!-- Core Viewpoint Section -->
<section class="glass-card p-8">
<h2 class="sub-title">核心观点摘要</h2>
<p class="text-gray-300 leading-relaxed text-lg">
华为Mate80概念是 <strong class="text-purple-300">技术突破</strong><strong class="text-purple-300">国产替代</strong> 双重叙事下的标志性产物其核心驱动力源于以麒麟9030为代表的芯片自主化进展和以A2A智能体为核心的端侧AI商业化落地。当前该概念已从事件驱动的预期炒作阶段逐步进入 <strong class="text-yellow-300">技术与商业化验证的关键期</strong>。其长期价值取决于创新功能如主动散热、AI智能体的用户接受度、供应链的稳定量产能力以及最终的市场销售表现。
</p>
</section>
<!-- Event Timeline Section -->
<section class="glass-card p-8">
<h2 class="sub-title">概念事件发展脉络</h2>
<div id="timeline-chart" class="w-full h-96"></div>
</section>
<!-- Core Logic & Market Analysis (Bento Grid) -->
<section>
<h2 class="section-title text-center text-gray-200">核心逻辑与市场认知解析</h2>
<div class="bento-grid mt-8">
<div class="bento-item bento-item-1 glass-card p-6 flex flex-col">
<h3 class="font-semibold text-xl mb-3 text-purple-300">核心驱动力</h3>
<div class="space-y-4 text-gray-300 flex-grow">
<p><strong>1. 芯片技术的“破局”:</strong>麒麟9030系列通过先进封装技术如后置SRAM“弯道超车”性能追平高通旗舰被市场视为中国半导体产业链自主可控的关键一步具备极强的象征意义。</p>
<p><strong>2. 端侧AI的商业化引领</strong>首发A2AAgent to Agent智能体协作标志着AI从云端向个人终端的实质性落地为增长乏力的消费电子市场提供了全新的核心增长动力。</p>
<p><strong>3. “0到1”的工程创新</strong>在主动散热微型风扇、全金属机身信号兼容、双层OLED等技术上实现业界首创或重大突破直接创造了全新的产业链环节和价值空间。</p>
</div>
</div>
<div class="bento-item bento-item-2 glass-card p-6">
<h3 class="font-semibold text-xl mb-3 text-purple-300">市场热度与情绪</h3>
<p class="text-gray-300">市场对Mate80概念抱有极高的热情和乐观情绪。从新闻密集发布、券商积极解读到关联个股强劲表现都反映出高度关注。这种情绪混合了对华为品牌力的信任、对国产科技崛起的自豪感以及对新一轮消费电子创新周期的期待。</p>
</div>
<div class="bento-item bento-item-3 glass-card p-6">
<h3 class="font-semibold text-xl mb-3 text-red-400">【关键预期差】市场热度 vs. 备货量</h3>
<p class="text-gray-300">市场普遍预期Mate80将复刻销售奇迹但数据显示“全系列预计备货量目前不超过900万台”显著低于往年旗舰水平。这背后可能反映了麒麟9030先进封装工艺的良率挑战或关键零部件的供应瓶颈构成最大的预期差。市场的乐观情绪可能尚未充分消化这一潜在供应风险。</p>
</div>
<div class="bento-item bento-item-4 glass-card p-6">
<h3 class="font-semibold text-xl mb-3 text-yellow-300">定价策略预期差</h3>
<p class="text-gray-300">市场普遍预测起售价在5499元而实际为4699元。超预期的定价策略意在迅速抢占市场份额但也可能对华为自身及产业链的利润率构成压力。渠道人士表示“很有压力”和“定价很有魄力”侧面印证了这一点。</p>
</div>
<div class="bento-item bento-item-5 glass-card p-6">
<h3 class="font-semibold text-xl mb-3 text-blue-300">技术细节认知差</h3>
<p class="text-gray-300">早期信息混乱最终发布会澄清了麒麟芯片分层配置的方案9020/9030/9030 Pro意味着不同版本间的性能体验将有显著差异而非市场初期笼统认知的“全系麒麟9030”。</p>
</div>
<div class="bento-item bento-item-6 glass-card p-6">
<h3 class="font-semibold text-xl mb-3 text-green-300">未来催化剂与发展路径</h3>
<ul class="list-disc list-inside text-gray-300 space-y-2">
<li><strong>近期催化剂 (3-6个月):</strong> 首季度销售数据、麒麟9030 Pro性能评测、鸿蒙OS 6.0开发者大会、供应链核心公司业绩兑现。</li>
<li><strong>长期发展路径:</strong> 硬件定义的AI入口、生态驱动的软件服务、引领全场景终端创新、带动国产供应链升级。</li>
</ul>
</div>
</div>
</section>
<!-- Key Innovations Deep Dive -->
<section x-data="{ tab: 'chip' }">
<h2 class="section-title text-center text-gray-200">关键创新技术深度解析</h2>
<div role="tablist" class="tabs tabs-lifted justify-center">
<a role="tab" class="tab" :class="{'tab-active': tab === 'chip'}" @click="tab = 'chip'">麒麟芯片 & 先进封装</a>
<a role="tab" class="tab" :class="{'tab-active': tab === 'ai'}" @click="tab = 'ai'">鸿蒙OS 6.0 & A2A智能体</a>
<a role="tab" class="tab" :class="{'tab-active': tab === 'cooling'}" @click="tab = 'cooling'">主动散热系统</a>
<a role="tab" class="tab" :class="{'tab-active': tab === 'design'}" @click="tab = 'design'">材质、设计与通信</a>
</div>
<div class="glass-card p-8 mt-[-1px] rounded-t-none">
<div x-show="tab === 'chip'" x-transition>
<h3 class="sub-title">麒麟9030系列破局之芯</h3>
<p class="mb-4 text-gray-300">Mate80系列并未全系搭载统一芯片而是采用了精细化的分层策略Mate 80搭载麒麟9020Pro版搭载麒麟9030而更高配的Pro版16GB和Pro Max则搭载性能更强的麒麟9030 Pro。这一策略平衡了成本、产能与性能实现了精准市场卡位。</p>
<blockquote class="border-l-4 border-purple-400 pl-4 py-2 my-4 bg-purple-900/20 rounded-r-lg">
<p class="italic text-gray-200">“9030开创性地使用先进封装将sram后置极大地释放了soc性能,后续有望弯道超车,反超高通。” <span class="text-sm text-gray-400">- 新闻 (2025-10-24)</span></p>
</blockquote>
<p class="text-gray-300">核心亮点在于麒麟9030系列采用的先进封装技术特别是后置SRAM的设计被认为是性能大幅提升的关键。这不仅解决了传统SoC设计的瓶颈更带动了国内先进封装产业链的崛起如SRAM供应商 <strong class="text-yellow-300">北京君正</strong> 和封装材料商 <strong class="text-yellow-300">强力新材</strong></p>
</div>
<div x-show="tab === 'ai'" x-transition>
<h3 class="sub-title">鸿蒙OS 6.0 & A2A端侧AI的商业化序章</h3>
<p class="mb-4 text-gray-300">Mate80系列首发搭载HarmonyOS 6.0其最大亮点是首次商用了A2AAgent to Agent智能体协作技术。这使得手机内置的AI助手“小艺”不再是简单的语音指令执行者而是能够理解复杂意图、主动决策、协同多个应用完成复杂任务的“智能体”。</p>
<blockquote class="border-l-4 border-purple-400 pl-4 py-2 my-4 bg-purple-900/20 rounded-r-lg">
<p class="italic text-gray-200">“从‘值机’到‘买菜’甚至‘理财’,只需一句指令,它就能搞定。” <span class="text-sm text-gray-400">- 新闻 (2025-11-25)</span></p>
</blockquote>
<p class="text-gray-300">研报指出AI Agent的颠覆式体验有望驱动消费电子新一轮需求释放成为消费电子增长的核心动力。这一功能的实现也对手机的算力和散热提出了更高要求。</p>
</div>
<div x-show="tab === 'cooling'" x-transition>
<h3 class="sub-title">主动散热为完全体AI保驾护航</h3>
<p class="mb-4 text-gray-300">为应对麒麟9030 Pro芯片和A2A智能体带来的高算力负载Mate80系列高配版首次引入了主动散热系统。这被认为是本次发布会最大的亮点之一。</p>
<blockquote class="border-l-4 border-purple-400 pl-4 py-2 my-4 bg-purple-900/20 rounded-r-lg">
<p class="italic text-gray-200">“在镜头模组区域集成扁平化离心风扇(直径&lt;1cm、厚度&lt;0.2cm),转速接近万转/分...直接对主板及SoC热区送风降温。” <span class="text-sm text-gray-400">- 研报 (2025-09-08)</span></p>
</blockquote>
<p class="text-gray-300">这一“0到1”的创新催生了全新的供应链环节包括微型风扇、压电微泵液冷驱动芯片等。相关供应商如 <strong class="text-yellow-300">峰岹科技、艾为电子、飞荣达</strong> 受到市场高度关注,分析师预计华为有望推动主动散热的渗透率迅速上升。</p>
</div>
<div x-show="tab === 'design'" x-transition>
<h3 class="sub-title">材质、设计与通信:全方位创新</h3>
<ul class="list-disc list-inside space-y-3 text-gray-300">
<li><strong>全金属机身:</strong>Mate 80 Pro Max首次攻克全金属与信号共存难题通过行业首发的全金属架构增强天线实现了技术突破提升了机身质感和耐用性。</li>
<li><strong>“灵珑屏”双层OLED</strong>Mate80 Pro Max首发采用双层OLED架构峰值亮度达到业界最高的8000nits显著提升了显示效果。</li>
<li><strong>卫星通信:</strong>首次支持直联低轨卫星,实现了卫星语音/上网功能,是通信技术的核心增量。</li>
<li><strong>eSIM全面引入</strong>与苹果iPhone 17同步全面引入eSIM技术推动手机无卡化时代的到来。</li>
<li><strong>其他创新:</strong>全系标配超硬AR镀膜RS版传闻测试钛合金中框全系采用3D人脸直屏。</li>
</ul>
</div>
</div>
</section>
<!-- Risks Section -->
<section class="glass-card p-8">
<h2 class="sub-title">潜在风险与挑战</h2>
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
<div class="border-l-4 border-red-500 pl-4">
<h4 class="font-semibold text-lg text-red-400">技术风险</h4>
<ul class="list-disc list-inside text-sm text-gray-400 mt-2">
<li>麒麟9030先进封装的良率与成本控制。</li>
<li>主动散热系统的长期可靠性(噪音、功耗、积灰)。</li>
</ul>
</div>
<div class="border-l-4 border-yellow-500 pl-4">
<h4 class="font-semibold text-lg text-yellow-400">商业化风险</h4>
<ul class="list-disc list-inside text-sm text-gray-400 mt-2">
<li>供应链瓶颈导致销量不及预期(备货量低)。</li>
<li>创新功能市场接受度待检验。</li>
</ul>
</div>
<div class="border-l-4 border-orange-500 pl-4">
<h4 class="font-semibold text-lg text-orange-400">政策与竞争风险</h4>
<ul class="list-disc list-inside text-sm text-gray-400 mt-2">
<li>外部技术管制收紧风险。</li>
<li>友商快速跟进,可能引发价格战。</li>
</ul>
</div>
</div>
</section>
<!-- Stock Data Section -->
<section>
<h2 class="section-title text-center text-gray-200">产业链图谱与核心标的</h2>
<div class="overflow-x-auto mt-8">
<h3 class="sub-title">核心受益标的</h3>
<table class="styled-table">
<thead>
<tr>
<th>股票名称</th>
<th>股票代码</th>
<th>核心逻辑</th>
<th>关联技术</th>
</tr>
</thead>
<tbody>
<tr>
<td>沃特股份</td>
<td><a href="https://valuefrontier.cn/company?scode=002886" target="_blank">002886</a></td>
<td>公司LCP散热风扇材料方案率先得到高算力芯片和服务器客户应用。</td>
<td class="text-purple-300">微型散热风扇</td>
</tr>
<tr>
<td>飞荣达</td>
<td><a href="https://valuefrontier.cn/company?scode=300602" target="_blank">300602</a></td>
<td>公司热管理产品包括微泵液冷、微型风扇等,应用于消费电子。</td>
<td class="text-purple-300">微型散热风扇</td>
</tr>
<tr>
<td>艾为电子</td>
<td><a href="https://valuefrontier.cn/company?scode=688798" target="_blank">688798</a></td>
<td>公司的压电微泵液冷驱动芯片可应用于智能手机等终端产品。</td>
<td class="text-purple-300">微泵液冷</td>
</tr>
<tr>
<td>南芯科技</td>
<td><a href="https://valuefrontier.cn/company?scode=688484" target="_blank">688484</a></td>
<td>公司推出的压电微泵液冷驱动芯片已在多家客户导入验证并即将量产。</td>
<td class="text-purple-300">微泵液冷</td>
</tr>
<tr>
<td>蜂助手</td>
<td><a href="https://valuefrontier.cn/company?scode=301382" target="_blank">301382</a></td>
<td>C端合作模式与HUAWEI云深度协同共同打造运营商云手机产品。</td>
<td class="text-purple-300">智能体</td>
</tr>
<tr>
<td>彩讯股份</td>
<td><a href="https://valuefrontier.cn/company?scode=300634" target="_blank">300634</a></td>
<td>参与鸿蒙原生应用开发并接入华为“小艺”智能体。</td>
<td class="text-purple-300">智能体</td>
</tr>
<tr>
<td>欧菲光</td>
<td><a href="https://valuefrontier.cn/company?scode=002456" target="_blank">002456</a></td>
<td>此前已为华为Mate系列供应摄像头相关模组3D结构光国产化潜在受益。</td>
<td class="text-purple-300">国产3D结构光</td>
</tr>
<tr>
<td>思特威</td>
<td><a href="https://valuefrontier.cn/company?scode=688213" target="_blank">688213</a></td>
<td>华为Pura80 Pro主摄搭载思特威传感器为国产定制化一英寸大底CMOS。</td>
<td class="text-purple-300">1英寸超大底主摄</td>
</tr>
</tbody>
</table>
</div>
<div class="overflow-x-auto mt-12">
<h3 class="sub-title">相关个股涨幅异动分析</h3>
<table class="styled-table">
<thead>
<tr>
<th>股票名称</th>
<th>股票代码</th>
<th>异动日期</th>
<th>涨幅</th>
<th>核心原因与逻辑解析</th>
</tr>
</thead>
<tbody>
<tr>
<td>捷荣技术</td>
<td><a href="https://valuefrontier.cn/company?scode=002855" target="_blank">002855</a></td>
<td>2025-11-14</td>
<td class="text-green-400">10.0%</td>
<td><b>核心结论:</b><br>华为 Mate80 系列官方预热时点落地,公司作为中框+散热结构件核心供应商、单机价值量提升 22%,机构资金抢筹导致涨停。<br><b>驱动概念:</b><br>华为 Mate80 结构件增量订单+风电+储能<br><b>异动解析:</b><br>Mate80 预热引爆华为链情绪→公司中框散热订单量价齐升+风电储能结构件产能释放→机构 1.17 亿元抢筹→涨停。</td>
</tr>
<tr>
<td>北京君正</td>
<td><a href="https://valuefrontier.cn/company?scode=300223" target="_blank">300223</a></td>
<td>2025-10-24</td>
<td class="text-green-400">7.94%</td>
<td><b>核心结论:</b><br>公司被报道为华为新一代旗舰芯片Mate80搭载的9030芯片的关键SRAM供应商精准触及“国产替代”与“科技创新”两大主题引爆市场情绪。<br><b>驱动概念:</b><br>华为芯片链+先进封装<br><b>异动解析:</b><br>华为技术突破 (后置SRAM) + 北京君正核心供货的强逻辑,导致买盘在短时间内急剧涌入。</td>
</tr>
<tr>
<td>电科芯片</td>
<td><a href="https://valuefrontier.cn/company?scode=600877" target="_blank">600877</a></td>
<td>2025-08-11</td>
<td class="text-green-400">10.01%</td>
<td><b>核心结论:</b><br>华为Mate80卫星直连手机发布在即公司作为唯一量产宇航级射频+星载电源管理芯片的核心供应商,订单预期爆发。<br><b>驱动概念:</b><br>商业航天+卫星互联网+华为链<br><b>异动解析:</b><br>Mate80卫星通信基带芯片核心供应商已获华为订单前置锁定。</td>
</tr>
<tr>
<td>华瓷股份</td>
<td><a href="https://valuefrontier.cn/company?scode=001216" target="_blank">001216</a></td>
<td>2025-11-18</td>
<td class="text-green-400">9.98%</td>
<td><b>核心结论:</b><br>华为Mate80氧化锆陶瓷后盖“0→1”订单预期与集成电路陶瓷基板政策双重催化叠加公司具备量产能力小市值弹性释放。<br><b>驱动概念:</b><br>华为Mate80陶瓷后盖+集成电路陶瓷基板<br><b>异动解析:</b><br>Mate80陶瓷后盖订单预期带来0→1增量空间十五五补贴抬升估值。</td>
</tr>
<tr>
<td>和胜股份</td>
<td><a href="https://valuefrontier.cn/company?scode=002824" target="_blank">002824</a></td>
<td>2025-08-08</td>
<td class="text-green-400">6.80%</td>
<td><b>核心结论:</b><br>公司产品从碳纤维背盖转向铝背盖,单台手机价值量提升约三倍,被描述为"MATE80唯一确定纯增量",业绩预期大幅提升。<br><b>驱动概念:</b><br>华为Mate80供应链突破<br><b>异动解析:</b><br>MATE系列2000万台测算和胜占据60%-70%份额预计营收增厚约4亿。</td>
</tr>
</tbody>
</table>
</div>
</section>
</main>
<footer class="text-center py-8 mt-12 border-t border-gray-800">
<p class="text-sm text-gray-500">
声明:本报告由北京价值前沿科技有限公司 AI投研agent“价小前投研” 合成数据生成。
</p>
<p class="text-sm text-gray-500 mt-1">
内容仅供研究参考,不构成任何投资建议。股市有风险,投资需谨慎。
</p>
</footer>
</div>
<script>
document.addEventListener('DOMContentLoaded', function () {
var chartDom = document.getElementById('timeline-chart');
var myChart = echarts.init(chartDom, 'dark'); // Use dark theme
var option;
const data = [
{ name: '早期酝酿期 (8-10月)', value: [1, new Date('2025-08-01'), new Date('2025-10-31')], itemStyle: { color: '#5a67d8' }, detail: 'eSIM、低轨卫星、麒麟9030、主动散热、先进封装等传闻密集出现产业链开始挖掘。' },
{ name: '预期发酵期 (11月上中旬)', value: [2, new Date('2025-11-01'), new Date('2025-11-24')], itemStyle: { color: '#805ad5' }, detail: '官方启动预订,主动散热、全金属机身等技术细节进一步曝光,市场热情高涨。' },
{ name: '事件兑现与落地期 (11月下旬至今)', value: [3, new Date('2025-11-25'), new Date('2025-12-31')], itemStyle: { color: '#d53f8c' }, detail: '正式发布核心配置、A2A智能体、低于预期的售价公布市场焦点转向销量和业绩兑现。' }
];
function renderItem(params, api) {
var categoryIndex = api.value(0);
var start = api.coord([api.value(1), categoryIndex]);
var end = api.coord([api.value(2), categoryIndex]);
var height = api.size([0, 1])[1] * 0.6;
var rectShape = echarts.graphic.clipRectByRect(
{ x: start[0], y: start[1] - height / 2, width: end[0] - start[0], height: height },
{ x: params.coordSys.x, y: params.coordSys.y, width: params.coordSys.width, height: params.coordSys.height }
);
return (
rectShape && {
type: 'rect',
transition: ['shape'],
shape: rectShape,
style: api.style()
}
);
}
option = {
backgroundColor: 'transparent',
tooltip: {
formatter: function (params) {
return params.marker + params.name + ': ' + params.data.detail;
}
},
title: { show: false },
dataZoom: [
{ type: 'slider', filterMode: 'weakFilter', showDataShadow: false, top: '85%', labelFormatter: '' },
{ type: 'inside', filterMode: 'weakFilter' }
],
grid: { height: '60%', top: '10%' },
xAxis: {
type: 'time',
axisLine: { lineStyle: { color: 'rgba(255,255,255,0.3)' } },
axisLabel: { color: '#ccc' }
},
yAxis: {
data: ['早期酝酿期', '预期发酵期', '事件兑现期'],
axisLine: { show: false },
axisTick: { show: false },
axisLabel: { color: '#ccc', fontSize: 14 }
},
series: [
{
type: 'custom',
renderItem: renderItem,
itemStyle: { opacity: 0.8 },
encode: { x: [1, 2], y: 0 },
data: data
}
]
};
myChart.setOption(option);
window.addEventListener('resize', myChart.resize);
});
</script>
</body>
</html>