Files
vf_react/public/htmls/鸿蒙PC.html
2025-12-05 13:29:18 +08:00

412 lines
28 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>鸿蒙PC · 深度投研报告</title>
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://cdn.jsdelivr.net/npm/daisyui@4.10.2/dist/full.min.css" rel="stylesheet" type="text/css" />
<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>
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700&display=swap');
body {
font-family: 'Noto Sans SC', sans-serif;
background-color: #02040a;
color: #e0e0e0;
overflow-x: hidden;
}
.space-bg {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
background-image:
radial-gradient(circle at 15% 25%, rgba(0, 150, 255, 0.15) 0%, transparent 40%),
radial-gradient(circle at 85% 75%, rgba(199, 21, 133, 0.15) 0%, transparent 40%),
radial-gradient(circle at 50% 50%, rgba(75, 0, 130, 0.1) 0%, transparent 30%);
background-color: #02040a;
animation: pulse-glow 20s infinite alternate;
}
@keyframes pulse-glow {
0% { opacity: 0.8; transform: scale(1); }
100% { opacity: 1; transform: scale(1.05); }
}
.glass-card {
background: rgba(10, 10, 20, 0.5);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.1);
transition: background 0.3s ease, border 0.3s ease, box-shadow 0.3s ease;
}
.glass-card:hover {
background: rgba(10, 10, 20, 0.7);
border: 1px solid rgba(255, 255, 255, 0.2);
}
.glow-border {
position: relative;
}
.glow-border::before {
content: '';
position: absolute;
inset: 0;
border-radius: 26px; /* one more than the card's rounded-3xl */
padding: 1px;
background: linear-gradient(135deg, rgba(0, 191, 255, 0.5), rgba(199, 21, 133, 0.5));
-webkit-mask:
linear-gradient(#fff 0 0) content-box,
linear-gradient(#fff 0 0);
-webkit-mask-composite: xor;
mask-composite: exclude;
pointer-events: none;
}
.fui-header {
font-size: 1.5rem;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #67e8f9; /* cyan-300 */
text-shadow: 0 0 8px rgba(103, 232, 249, 0.7);
}
h2, h3 {
color: #c7d2fe; /* indigo-200 */
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
padding-bottom: 0.5rem;
}
.bento-grid {
display: grid;
gap: 1.5rem;
grid-template-columns: repeat(12, 1fr);
}
.bento-item {
grid-column: span 12;
}
@media (min-width: 768px) {
.md\:col-span-4 { grid-column: span 4; }
.md\:col-span-6 { grid-column: span 6; }
.md\:col-span-8 { grid-column: span 8; }
.md\:col-span-12 { grid-column: span 12; }
}
@media (min-width: 1024px) {
.lg\:col-span-3 { grid-column: span 3; }
.lg\:col-span-4 { grid-column: span 4; }
.lg\:col-span-5 { grid-column: span 5; }
.lg\:col-span-6 { grid-column: span 6; }
.lg\:col-span-7 { grid-column: span 7; }
.lg\:col-span-8 { grid-column: span 8; }
.lg\:col-span-12 { grid-column: span 12; }
}
</style>
</head>
<body class="min-h-screen">
<div class="space-bg"></div>
<div class="container mx-auto p-4 md:p-8">
<!-- Header -->
<header class="text-center mb-12">
<h1 class="fui-header text-3xl md:text-5xl font-bold mb-2">鸿蒙PC · 深度投研报告</h1>
<p class="text-slate-400">北京价值前沿科技有限公司 AI投研agent“价小前投研” 进行投研呈现</p>
<p class="text-xs text-slate-500 mt-1">本报告为AI合成数据投资需谨慎。</p>
</header>
<!-- Main Content Grid -->
<main class="space-y-8">
<!-- Executive Summary and Core Logic -->
<section class="bento-grid">
<div class="bento-item lg:col-span-7 glass-card rounded-3xl p-6 glow-border">
<h2 class="text-2xl font-bold mb-4">核心观点摘要</h2>
<p class="text-slate-300 leading-relaxed">
鸿蒙PC是华为在外部地缘政治压力下深化“自主可控”与“全场景生态”战略的里程碑式产物。当前其正处于 **0到1的导入期**,核心驱动力源于 **信创市场的确定性需求** 与 **消费市场生态闭环的长期愿景**。短期内其商业成功高度依赖政企B/G端市场的突破长期潜力则取决于其能否解决 **应用生态** 这一核心短板并通过“AI原生”与“跨端协同”的差异化体验在消费者C端市场重塑用户习惯挑战Windows和macOS的双寡头垄断格局。
</p>
</div>
<div class="bento-item lg:col-span-5 glass-card rounded-3xl p-6">
<h2 class="text-2xl font-bold mb-4">核心驱动力</h2>
<ul class="space-y-3 text-slate-300">
<li><strong class="text-cyan-400">生存驱动下的自主可控:</strong> 彻底摆脱对美国技术体系的依赖,保障业务连续性与安全性。</li>
<li><strong class="text-cyan-400">战略驱动下的生态闭环:</strong> 补完“1+8+N”战略最后一块拼图实现跨设备无缝协同。</li>
<li><strong class="text-cyan-400">政策驱动下的信创机遇:</strong> 国内庞大的政企PC替换市场提供坚实的商业化“冷启动”土壤。</li>
</ul>
</div>
</section>
<!-- Timeline and Market Perception -->
<section class="bento-grid">
<div class="bento-item md:col-span-8 glass-card rounded-3xl p-6">
<h2 class="text-2xl font-bold mb-4">关键事件与时间轴</h2>
<ul class="timeline timeline-snap-icon max-md:timeline-compact timeline-vertical">
<li>
<div class="timeline-middle"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="h-5 w-5"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z" clip-rule="evenodd" /></svg></div>
<div class="timeline-end md:timeline-start mb-10">
<time class="font-mono italic">2024 Q4</time>
<div class="text-lg font-black">预期酝酿期</div>
华为高管余承东多次公开表示“目前的华为PC或将是最后一批搭载Windows系统的笔记本电脑”市场形成强烈预期。
</div>
<hr/>
</li>
<li>
<hr/>
<div class="timeline-middle"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="h-5 w-5"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z" clip-rule="evenodd" /></svg></div>
<div class="timeline-end mb-10">
<time class="font-mono italic">2025年5月8日</time>
<div class="text-lg font-black">技术亮相</div>
华为召开鸿蒙电脑技术与生态沟通会鸿蒙PC正式亮相展示其技术架构与生态愿景。
</div>
<hr/>
</li>
<li>
<hr/>
<div class="timeline-middle"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="h-5 w-5"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z" clip-rule="evenodd" /></svg></div>
<div class="timeline-end md:timeline-start mb-10">
<time class="font-mono italic">2025年5月19日</time>
<div class="text-lg font-black">正式发布</div>
华为在成都发布搭载HarmonyOS 5的鸿蒙PC新产品包括MateBook Pro和全球首款商用折叠PC MateBook Fold。
</div>
<hr/>
</li>
<li>
<hr/>
<div class="timeline-middle"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="h-5 w-5"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z" clip-rule="evenodd" /></svg></div>
<div class="timeline-end">
<time class="font-mono italic">2025年底目标</time>
<div class="text-lg font-black">生态里程碑</div>
计划支持超过2000个融合生态应用C端市场开始发力初步构建原生应用生态。
</div>
</li>
</ul>
</div>
<div class="bento-item md:col-span-4 glass-card rounded-3xl p-6 flex flex-col">
<h2 class="text-2xl font-bold mb-4">市场预期差分析</h2>
<div class="flex-grow space-y-4 text-slate-300">
<div>
<h3 class="font-semibold text-indigo-300">市场定位</h3>
<p class="text-sm">普遍预期对标Mac但初期主战场是 **to B/to G**C端发力需待生态成熟。</p>
</div>
<div>
<h3 class="font-semibold text-indigo-300">Windows兼容性</h3>
<p class="text-sm">市场期待“完美兼容”,实为 **虚拟机过渡方案**,长期目标是构建原生生态,将逐步关闭兼容窗口。</p>
</div>
<div>
<h3 class="font-semibold text-indigo-300">AI能力</h3>
<p class="text-sm">不止于集成第三方大模型,而是 **系统级融合的原生AI**(小艺智能体),体验更流畅、自然,这是市场尚未充分认知的差异化优势。</p>
</div>
</div>
</div>
</section>
<!-- Development Path & Chart -->
<section class="bento-grid">
<div class="bento-item lg:col-span-4 glass-card rounded-3xl p-6">
<h2 class="text-2xl font-bold mb-4">应用生态成长路径</h2>
<div id="app-ecosystem-chart" class="w-full h-64 md:h-80"></div>
</div>
<div class="bento-item lg:col-span-8 glass-card rounded-3xl p-6">
<h2 class="text-2xl font-bold mb-4">长期发展三阶段路径</h2>
<div class="grid grid-cols-1 md:grid-cols-3 gap-6 text-sm">
<div class="bg-slate-800/50 p-4 rounded-xl">
<h3 class="font-bold text-lg text-fuchsia-400">阶段一 (2025-26)</h3>
<p class="mt-1 font-semibold">市场导入与生态构建期</p>
<p class="mt-2 text-slate-400">以B/G端为基石完成信创市场初步渗透。C端以高端产品树立品牌形象核心任务是快速扩充原生应用数量通过虚拟机保障基本可用性。</p>
</div>
<div class="bg-slate-800/50 p-4 rounded-xl">
<h3 class="font-bold text-lg text-fuchsia-400">阶段二 (2026-27)</h3>
<p class="mt-1 font-semibold">生态完善与市场扩张期</p>
<p class="mt-2 text-slate-400">原生应用生态基本成熟满足主流需求。逐步降低对虚拟机依赖。产品线下沉C端开始正面竞争目标市占率 **10%-20%**。</p>
</div>
<div class="bg-slate-800/50 p-4 rounded-xl">
<h3 class="font-bold text-lg text-fuchsia-400">阶段三 (2028+)</h3>
<p class="mt-1 font-semibold">生态成熟与格局重塑期</p>
<p class="mt-2 text-slate-400">形成“鸿蒙原生应用”飞轮效应。凭借 **“AI原生”** 和 **“万物互联”** 独特优势在PC市场形成与Windows、macOS三足鼎立的格局。</p>
</div>
</div>
</div>
</section>
<!-- Data Sources -->
<section x-data="{ tab: 'news' }" class="glass-card rounded-3xl p-6 glow-border">
<h2 class="text-2xl font-bold mb-4">多源数据情报聚合</h2>
<div class="tabs tabs-boxed bg-black/30 mb-4">
<a class="tab" :class="{ 'tab-active': tab === 'news' }" @click.prevent="tab = 'news'">新闻精粹</a>
<a class="tab" :class="{ 'tab-active': tab === 'roadshow' }" @click.prevent="tab = 'roadshow'">路演纪要</a>
<a class="tab" :class="{ 'tab-active': tab === 'research' }" @click.prevent="tab = 'research'">研报洞察</a>
</div>
<div class="text-slate-300 leading-relaxed text-sm space-y-4">
<div x-show="tab === 'news'">
<h3 class="text-lg font-bold text-indigo-300 mb-2">产品与技术核心</h3>
<ul class="list-disc list-inside space-y-2">
<li><strong>产品型号与定价:</strong>MateBook Pro (¥7999-10999) 和 MateBook Fold (¥23999-26999)。</li>
<li><strong>核心硬件:</strong>搭载自研麒麟X90/鲲鹏处理器与纯血鸿蒙OS 5.0实现从内核到芯片100%自主可控。</li>
<li><strong>核心功能:</strong>AI原生驱动集成盘古大模型、小艺智能体、跨端融合手眼同行、键鼠共享</li>
<li><strong>销量预期:</strong>两款产品生命周期规划量近100万台其中折叠款约30万台。</li>
</ul>
<h3 class="text-lg font-bold text-indigo-300 mt-4 mb-2">生态与挑战</h3>
<ul class="list-disc list-inside space-y-2">
<li><strong>应用生态:</strong>启动时专属电脑应用150+融合生态应用300+计划2025年底支持超2000个应用。</li>
<li><strong>Windows兼容</strong>过渡阶段通过轻量级Windows虚拟机兼容Office等软件但应用只能从官方应用市场安装不支持侧载。</li>
<li><strong>客观评价:</strong>目前处于生态早期尚不具备深度办公能力类似鸿蒙NEXT手机系统初版。</li>
</ul>
</div>
<div x-show="tab === 'roadshow'" x-cloak>
<h3 class="text-lg font-bold text-indigo-300 mb-2">战略与市场定位</h3>
<ul class="list-disc list-inside space-y-2">
<li><strong>市场策略:</strong>初期以 to B/to G (信创政企) 为主预计2025年底或2026年逐步发力C端。</li>
<li><strong>定价策略:</strong>对标MacBook侧重高端市场但不过度溢价通过高端产品Fold向中端Pro下沉。</li>
<li><strong>市占率目标:</strong>当前华为PC市占率约10%目标提升至10%-20%。</li>
</ul>
<h3 class="text-lg font-bold text-indigo-300 mt-4 mb-2">技术与挑战</h3>
<ul class="list-disc list-inside space-y-2">
<li><strong>性能对标:</strong>麒麟X90处理器多核性能超苹果M2单核接近M1整体对标Intel i7-13系列。</li>
<li><strong>核心优势:</strong>分布式软总线技术带来的跨设备无缝流转体验优于现有Windows和iOS方案。</li>
<li><strong>主要短板:</strong>续航受ARM封装技术限制及专业软件生态不足预计需要2-3年追赶Windows。</li>
</ul>
</div>
<div x-show="tab === 'research'" x-cloak>
<h3 class="text-lg font-bold text-indigo-300 mb-2">战略意义与技术基础</h3>
<ul class="list-disc list-inside space-y-2">
<li><strong>战略意义:</strong>补齐"1+8+N"全场景战略最后一块拼图,是国产操作系统发展的重要里程碑。</li>
<li><strong>驱动因素:</strong>微软Windows授权到期传闻2025年3月和中美科技博弈背景下的自主可控需求。</li>
<li><strong>技术架构:</strong>基于OpenHarmony深度定制采用微内核从内核、编译器到AI大模型实现全栈自研。</li>
</ul>
<h3 class="text-lg font-bold text-indigo-300 mt-4 mb-2">生态与风险</h3>
<ul class="list-disc list-inside space-y-2">
<li><strong>兼容方案:</strong>采用“鸿蒙+模拟器”双轨并行策略初期兼容Windows应用以降低用户迁移成本。</li>
<li><strong>AI能力</strong>集成盘古大模型和DeepSeek大模型小艺成为系统级智能体实现全新交互。</li>
<li><strong>核心风险:</strong>生态构建不及预期“鸡与蛋”困境、用户习惯迁移成本高、ARM架构转译x86软件的性能损耗。</li>
</ul>
</div>
</div>
</section>
<!-- Industry Chain Table -->
<section class="glass-card rounded-3xl p-6 overflow-x-auto">
<h2 class="text-2xl font-bold mb-6">产业链核心标的</h2>
<div class="overflow-x-auto">
<table class="table table-zebra-zebra bg-transparent w-full">
<thead class="text-base text-slate-300">
<tr>
<th class="bg-transparent">环节</th>
<th class="bg-transparent">公司名称</th>
<th class="bg-transparent">核心逻辑</th>
</tr>
</thead>
<tbody>
<!-- Hardware -->
<tr class="bg-transparent/20"><td colspan="3" class="font-bold text-cyan-300 text-lg py-3">硬件制造与核心零部件</td></tr>
<tr><td class="align-top">ODM</td><td><a href="https://valuefrontier.cn/company?scode=603296" target="_blank" class="link link-hover">华勤技术 (603296)</a></td><td>华为PC第一大ODM厂商承担MateBook系列超80%代工份额。</td></tr>
<tr><td class="align-top">EMS</td><td><a href="https://valuefrontier.cn/company?scode=300735" target="_blank" class="link link-hover">光弘科技 (300735)</a></td><td>华为EMS主力供应商PC主板占鸿蒙机型70%SiP封装技术领先。</td></tr>
<tr><td class="align-top">整机方案</td><td><a href="https://valuefrontier.cn/company?scode=001339" target="_blank" class="link link-hover">智微智能 (001339)</a></td><td>提供主板设计至整机组装全方案支持x86/ARM双架构华为“金牌供应商”。</td></tr>
<tr><td class="align-top">结构件</td><td><a href="https://valuefrontier.cn/company?scode=603890" target="_blank" class="link link-hover">春秋电子 (603890)</a></td><td>笔记本金属结构件龙头纳米压铸工艺良品率高华为订单占比超40%。</td></tr>
<tr><td class="align-top">显示模组</td><td><a href="https://valuefrontier.cn/company?scode=301321" target="_blank" class="link link-hover">翰博高新 (301321)</a></td><td>MiniLED背光模组供应商提供高对比度显示方案。</td></tr>
<tr><td class="align-top">触控屏</td><td><a href="https://valuefrontier.cn/company?scode=002106" target="_blank" class="link link-hover">莱宝高科 (002106)</a></td><td>华为高端笔记本触控屏供应商独家供应高端触控模组4096级压感</td></tr>
<!-- Software -->
<tr class="bg-transparent/20"><td colspan="3" class="font-bold text-cyan-300 text-lg py-3">软件系统开发</td></tr>
<tr><td class="align-top">核心ISV</td><td><a href="https://valuefrontier.cn/company?scode=301236" target="_blank" class="link link-hover">软通动力 (301236)</a></td><td>华为鸿蒙核心ISV主导头部应用的鸿蒙化改造代码适配市场份额超50%,确定性最高的“卖水”环节。</td></tr>
<tr><td class="align-top">安全模块</td><td><a href="https://valuefrontier.cn/company?scode=000158" target="_blank" class="link link-hover">常山北明 (000158)</a></td><td>子公司北明软件为鸿蒙安全模块核心开发商,华为多产品钻石级经销商。</td></tr>
<tr><td class="align-top">行业OS</td><td><a href="https://valuefrontier.cn/company?scode=002261" target="_blank" class="link link-hover">拓维信息 (002261)</a></td><td>华为“昇腾+鸿蒙”战略伙伴,深度参与教育、政务等领域鸿蒙行业专属操作系统开发。</td></tr>
<!-- Chips -->
<tr class="bg-transparent/20"><td colspan="3" class="font-bold text-cyan-300 text-lg py-3">系统/芯片国产化</td></tr>
<tr><td class="align-top">ADC芯片</td><td><a href="https://valuefrontier.cn/company?scode=688595" target="_blank" class="link link-hover">芯海科技 (688595)</a></td><td>鸿蒙PC专用ADC芯片供应商替代TI方案具备“鸿蒙国产化”和“芯片国产化”双重逻辑。</td></tr>
<tr><td class="align-top">OS核心组件</td><td><a href="https://valuefrontier.cn/company?scode=300496" target="_blank" class="link link-hover">中科创达 (300496)</a></td><td>鸿蒙OS核心组件开发商魔方Rubik大模型应用于PC端多模态交互护城河深。</td></tr>
<tr><td class="align-top">DRAM封测</td><td><a href="https://valuefrontier.cn/company?scode=000021" target="_blank" class="link link-hover">深科技 (000021)</a></td><td>国内最大的独立DRAM内存芯片封装测试企业技术领先。</td></tr>
<!-- Ecosystem -->
<tr class="bg-transparent/20"><td colspan="3" class="font-bold text-cyan-300 text-lg py-3">生态服务与场景延伸</td></tr>
<tr><td class="align-top">生态应用</td><td><a href="https://valuefrontier.cn/company?scode=300624" target="_blank" class="link link-hover">万兴科技 (300624)</a></td><td>鸿蒙PC版视频剪辑工具支持多端协同用户转化率提升显著是生态商业化前景的“试金石”。</td></tr>
<tr><td class="align-top">开源鸿蒙</td><td><a href="https://valuefrontier.cn/company?scode=300339" target="_blank" class="link link-hover">润和软件 (300339)</a></td><td>开源鸿蒙代码贡献度排名前三,提供分布式开发套件,在金融、工业领域有成熟解决方案。</td></tr>
<tr><td class="align-top">政教平板</td><td><a href="https://valuefrontier.cn/company?scode=002819" target="_blank" class="link link-hover">东方中科 (002819)</a></td><td>子公司万里红为鸿蒙PC生态首批开发者政务/教育平板已量产,订单弹性大。</td></tr>
<tr><td class="align-top">渠道分销</td><td><a href="https://valuefrontier.cn/company?scode=000034" target="_blank" class="link link-hover">神州数码 (000034)</a></td><td>华为鲲鹏服务器核心分销商,联合发布“鲲鹏+”算力底座,政企客户覆盖率高。</td></tr>
</tbody>
</table>
</div>
</section>
</main>
</div>
<script type="text/javascript">
var chartDom = document.getElementById('app-ecosystem-chart');
var myChart = echarts.init(chartDom, 'dark');
var option;
option = {
backgroundColor: 'transparent',
title: {
text: '应用数量增长目标',
left: 'center',
textStyle: {
color: '#c7d2fe'
}
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'category',
data: ['专属PC应用', '已适配融合应用', '年底目标'],
axisLine: {
lineStyle: {
color: 'rgba(255, 255, 255, 0.3)'
}
},
axisLabel: {
color: '#e0e0e0'
}
},
yAxis: {
type: 'value',
name: '数量 (个)',
axisLine: {
show: true,
lineStyle: {
color: 'rgba(255, 255, 255, 0.3)'
}
},
splitLine: {
lineStyle: {
color: 'rgba(255, 255, 255, 0.1)'
}
},
axisLabel: {
color: '#e0e0e0'
}
},
series: [
{
name: '应用数量',
type: 'bar',
barWidth: '60%',
data: [150, 300, 2000],
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#0ea5e9' }, // sky-500
{ offset: 1, color: '#6366f1' } // indigo-500
])
},
emphasis: {
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#38bdf8' }, // sky-400
{ offset: 1, color: '#818cf8' } // indigo-400
])
}
}
}
]
};
option && myChart.setOption(option);
window.addEventListener('resize', myChart.resize);
</script>
</body>
</html>