Files
vf_react/public/htmls/美的库卡机器人.html
2025-12-05 13:29:18 +08:00

379 lines
29 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>美的库卡机器人 - 概念深度解析</title>
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://cdn.jsdelivr.net/npm/daisyui@4.10.1/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>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Space+Grotesk:wght@400;500;700&display=swap" rel="stylesheet">
<style>
body {
font-family: 'Inter', sans-serif;
background-color: #020617; /* slate-950 */
color: #d1d5db; /* gray-300 */
background-image:
radial-gradient(circle at 10% 15%, rgba(59, 130, 246, 0.12) 0%, transparent 40%),
radial-gradient(circle at 85% 80%, rgba(139, 92, 246, 0.1) 0%, transparent 40%),
radial-gradient(circle at 50% 50%, rgba(34, 197, 94, 0.05) 0%, transparent 30%);
background-attachment: fixed;
}
.font-display {
font-family: 'Space Grotesk', sans-serif;
}
.glass-card {
background-color: rgba(15, 23, 42, 0.5); /* slate-900 with alpha */
backdrop-filter: blur(16px) saturate(150%);
-webkit-backdrop-filter: blur(16px) saturate(150%);
border: 1px solid rgba(255, 255, 255, 0.1);
transition: all 0.2s ease-in-out;
}
.glass-card:hover {
transform: translateY(-4px) scale(1.01);
box-shadow: 0 0 25px rgba(59, 130, 246, 0.1);
border-color: rgba(255, 255, 255, 0.2);
}
.bento-grid {
display: grid;
gap: 1.5rem;
grid-template-columns: repeat(6, 1fr);
grid-auto-rows: minmax(100px, auto);
}
.bento-item {
border-radius: 2rem;
padding: 1.5rem 2rem;
box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
}
.bento-main { grid-column: span 6; md:grid-column: span 4; grid-row: span 2; }
.bento-side-1 { grid-column: span 6; md:grid-column: span 2; }
.bento-side-2 { grid-column: span 6; md:grid-column: span 2; }
.bento-bottom-1 { grid-column: span 6; md:grid-column: span 3; }
.bento-bottom-2 { grid-column: span 6; md:grid-column: span 3; }
@media (min-width: 768px) {
.bento-main { grid-column: span 4; grid-row: span 2; }
.bento-side-1 { grid-column: span 2; }
.bento-side-2 { grid-column: span 2; }
.bento-bottom-1 { grid-column: span 3; }
.bento-bottom-2 { grid-column: span 3; }
}
.section-title {
position: relative;
padding-bottom: 0.5rem;
margin-bottom: 1.5rem;
}
.section-title::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 50px;
height: 3px;
background: linear-gradient(90deg, #3B82F6, #8B5CF6);
border-radius: 2px;
}
::-webkit-scrollbar {
width: 8px;
}
::-webkit-scrollbar-track {
background: rgba(15, 23, 42, 0.5);
}
::-webkit-scrollbar-thumb {
background-color: #3B82F6;
border-radius: 10px;
border: 2px solid rgba(15, 23, 42, 0.5);
}
.table th, .table td {
border-color: rgba(255, 255, 255, 0.1);
}
.table tbody tr:hover {
background-color: rgba(30, 41, 59, 0.8) !important;
}
</style>
</head>
<body class="min-h-screen p-4 sm:p-6 lg:p-8">
<div class="max-w-7xl mx-auto">
<!-- Header -->
<header class="text-center mb-12">
<h1 class="font-display text-4xl sm:text-5xl lg:text-6xl font-bold text-white tracking-tighter">
美的库卡机器人
</h1>
<p class="mt-4 text-lg text-slate-400">概念深度解析</p>
<div class="mt-2 text-xs text-slate-500 font-mono">
北京价值前沿科技有限公司 AI投研agent“价小前投研” 进行投研呈现 | 本报告为AI合成数据投资需谨慎。
</div>
</header>
<!-- Main Content: Bento Grid for Insight -->
<main>
<section id="insight-analysis" class="mb-16">
<h2 class="font-display text-3xl font-bold text-white mb-8 section-title">概念洞察 (Insight Analysis)</h2>
<div class="bento-grid">
<!-- Core Logic -->
<div class="bento-item glass-card bento-main">
<h3 class="font-display text-2xl font-bold text-white mb-4">核心逻辑与市场认知</h3>
<p class="text-slate-300 mb-4">“美的库卡机器人”概念正处于从<strong class="text-blue-400">主题叙事向基本面驱动过渡</strong>的关键阶段。其核心驱动力源于美的集团强大的制造基因与管理能力对库卡进行的<strong class="text-green-400">成本优化和效率重塑</strong>,已带来明确的盈利拐点。未来潜力则在于其应用场景的多元化拓展以及作为美的进军<strong class="text-purple-400">人形机器人</strong>这一高潜力赛道的技术基石所带来的巨大想象空间。</p>
<div class="divider before:bg-slate-700 after:bg-slate-700">驱动力分析</div>
<ul class="space-y-3 text-sm text-slate-300">
<li><span class="font-bold text-white bg-blue-500/20 px-2 py-1 rounded-md mr-2">管理与供应链赋能:</span> 支撑概念最坚实的底层逻辑。美的成功将其在家电领域的极致成本控制和高效供应链管理能力复制到库卡,带来盈利改善。</li>
<li><span class="font-bold text-white bg-green-500/20 px-2 py-1 rounded-md mr-2">战略协同与市场拓展:</span> 美的不仅为库卡带来管理效率,更带来了巨大的应用场景和市场入口,加速“拓展非汽车客户”战略。</li>
<li><span class="font-bold text-white bg-purple-500/20 px-2 py-1 rounded-md mr-2">技术外溢与未来叙事:</span> 库卡成熟的运动控制系统是美的快速切入人形机器人赛道的“技术跳板”,提供了第二增长曲线和高估值潜力。</li>
</ul>
</div>
<!-- Concept Events -->
<div class="bento-item glass-card bento-side-1">
<h3 class="font-display text-xl font-bold text-white mb-4">概念发展时间轴</h3>
<ul class="timeline timeline-compact timeline-vertical">
<li>
<div class="timeline-start timeline-box bg-slate-800 border-slate-700"><strong>战略布局期 (2015-2017)</strong><br>斥资260亿收购库卡奠定转型基础。</div>
<hr class="bg-blue-500"/>
</li>
<li>
<hr class="bg-blue-500"/>
<div class="timeline-end timeline-box bg-slate-800 border-slate-700"><strong>整合消化期 (2018-2022)</strong><br>管理协同,供应链优化,开拓中国市场。</div>
<hr class="bg-green-500"/>
</li>
<li>
<hr class="bg-green-500"/>
<div class="timeline-start timeline-box bg-slate-800 border-slate-700"><strong>业绩拐点与深化期 (2023-至今)</strong><br>迎来盈利拐点 (利润率>3.5%),赋能人形机器人研发。</div>
<div class="timeline-middle"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="w-5 h-5 text-purple-400"><path fill-rule="evenodd" d="M9.653 16.915l-6.364-6.364a.75.75 0 011.06-1.06l5.834 5.834 5.834-5.834a.75.75 0 011.06 1.06l-6.364 6.364a.75.75 0 01-1.06 0z" clip-rule="evenodd" /><path fill-rule="evenodd" d="M9.653 10.915l-6.364-6.364a.75.75 0 011.06-1.06l5.834 5.834 5.834-5.834a.75.75 0 011.06 1.06l-6.364 6.364a.75.75 0 01-1.06 0z" clip-rule="evenodd" /></svg></div>
</li>
</ul>
</div>
<!-- Catalysts -->
<div class="bento-item glass-card bento-side-2">
<h3 class="font-display text-xl font-bold text-white mb-4">关键催化剂</h3>
<div class="space-y-4">
<div>
<h4 class="font-semibold text-slate-100 mb-1">近期 (3-6个月)</h4>
<ul class="list-disc list-inside text-sm text-slate-300 space-y-1">
<li>财务数据验证利润率是否持续向3-5%目标迈进。</li>
<li>非汽车订单突破:医疗、物流等新领域重大订单公布。</li>
<li>人形机器人原型发布:突破性样机或核心零部件参数公布。</li>
</ul>
</div>
<div>
<h4 class="font-semibold text-slate-100 mb-1">长期发展路径</h4>
<ul class="list-disc list-inside text-sm text-slate-300 space-y-1">
<li><strong>阶段一 (当前-2026):</strong> 盈利修复与市场扩张。</li>
<li><strong>阶段二 (2026-2028):</strong> 核心技术内化与生态构建。</li>
<li><strong>阶段三 (2028+):</strong> 平台化与智能化 ("家电机器人化")。</li>
</ul>
</div>
</div>
</div>
<!-- Risks -->
<div class="bento-item glass-card bento-bottom-1">
<h3 class="font-display text-xl font-bold text-white mb-4">潜在风险与挑战</h3>
<ul class="space-y-3 text-sm">
<li class="flex items-start">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-red-400 mr-2 flex-shrink-0 mt-0.5" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.21 3.03-1.742 3.03H4.42c-1.532 0-2.492-1.696-1.742-3.03l5.58-9.92zM10 13a1 1 0 110-2 1 1 0 010 2zm-1.75-5.25a.75.75 0 00-1.5 0v3.5a.75.75 0 001.5 0v-3.5z" clip-rule="evenodd" /></svg>
<div><strong class="text-slate-100">技术风险:</strong> 人形机器人距商业化仍有距离,核心零部件是瓶颈。新闻提及“目前不如库卡机器人”。</div>
</li>
<li class="flex items-start">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-yellow-400 mr-2 flex-shrink-0 mt-0.5" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm.75-13a.75.75 0 00-1.5 0v5c0 .414.336.75.75.75h4a.75.75 0 000-1.5h-3.25V5z" clip-rule="evenodd" /></svg>
<div><strong class="text-slate-100">商业化风险:</strong> 盈利能力仍处较低水平,且海外业务(占80%)受全球宏观经济周期性波动影响大。</div>
</li>
<li class="flex items-start">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-orange-400 mr-2 flex-shrink-0 mt-0.5" viewBox="0 0 20 20" fill="currentColor"><path d="M10 2a.75.75 0 01.75.75v1.5a.75.75 0 01-1.5 0v-1.5A.75.75 0 0110 2zM10 15a.75.75 0 01.75.75v1.5a.75.75 0 01-1.5 0v-1.5A.75.75 0 0110 15zM10 7a3 3 0 100 6 3 3 0 000-6zM15.25 10a.75.75 0 01-.75.75h-1.5a.75.75 0 010-1.5h1.5a.75.75 0 01.75.75zM7 10a.75.75 0 01-.75.75h-1.5a.75.75 0 010-1.5h1.5A.75.75 0 017 10z" /></svg>
<div><strong class="text-slate-100">信息交叉验证风险:</strong> 市场乐观情绪与路演揭示的“外销受加息抑制”现实存在矛盾。部分供应商地位尚待验证。</div>
</li>
</ul>
</div>
<!-- Conclusion -->
<div class="bento-item glass-card bento-bottom-2">
<h3 class="font-display text-xl font-bold text-white mb-4">综合结论与投资启示</h3>
<p class="text-slate-300 mb-4">该概念已成功渡过纯粹的主题炒作,进入由<strong class="text-green-400">“盈利修复”驱动的基本面改善阶段</strong>。同时,人形机器人布局为其保留了极高的长期想象空间。这是一个典型的“<strong class="text-blue-400">价值+成长</strong>”复合型投资标的,即“戴维斯双击”的潜在候选者。</p>
<h4 class="font-semibold text-slate-100 mb-2">最具投资价值的细分环节:</h4>
<ol class="list-decimal list-inside text-sm text-slate-300 space-y-1">
<li><strong>核心本体 (美的集团):</strong> 逻辑最顺畅,确定性最高。</li>
<li><strong>产业链内化核心环节 (美的系供应商):</strong> 受益国产替代,成长弹性可能更大。</li>
<li><strong>已验证的“卖铲人” (核心零部件商):</strong> 风险相对较低,稳定分享行业增长。</li>
</ol>
</div>
</div>
</section>
<!-- Supporting Data Tabs -->
<section id="supporting-data" class="mb-16" x-data="{ tab: 'news' }">
<h2 class="font-display text-3xl font-bold text-white mb-8 section-title">多维数据支撑</h2>
<div class="tabs tabs-boxed bg-slate-800/50 mb-6">
<a class="tab tab-lg" :class="{ 'tab-active': tab === 'news' }" @click.prevent="tab = 'news'">新闻数据</a>
<a class="tab tab-lg" :class="{ 'tab-active': tab === 'roadshow' }" @click.prevent="tab = 'roadshow'">路演情报</a>
<a class="tab tab-lg" :class="{ 'tab-active': tab === 'research' }" @click.prevent="tab = 'research'">研报分析</a>
</div>
<div class="glass-card rounded-2xl p-6 min-h-[300px]">
<!-- News Data -->
<div x-show="tab === 'news'" x-transition>
<h3 class="font-display text-xl font-bold text-white mb-4">新闻数据摘要</h3>
<ul class="space-y-3 text-slate-300 list-disc list-inside">
<li><strong>收购与战略:</strong> 2022年美的斥资260亿收购库卡跻身全球工业机器人前四为向高科技转型提供基础。机器人与自动化板块拥有库卡、瑞仕格、高创等品牌。</li>
<li><strong>人形机器人赋能:</strong> 核心关系为“库卡赋能人形机器人制造,美的给予应用场景”。研发重点是基于库卡成熟的运动控制系统进行迭代。</li>
<li><strong>库卡业务表现:</strong> 工业机器人产量突破8万套业务零售营收突破300亿元。2024年发布中负载机器人等多款新品应用于光伏、电子、汽车等行业。</li>
<li><strong>供应链合作:</strong> 与亚威股份(合资)、珠城科技(小批量供货)、祥鑫科技(供应金属结构件)、合康新能(深度合作)等公司建立合作关系。</li>
</ul>
</div>
<!-- Roadshow Data -->
<div x-show="tab === 'roadshow'" x-transition>
<h3 class="font-display text-xl font-bold text-white mb-4">路演情报摘要</h3>
<ul class="space-y-3 text-slate-300 list-disc list-inside">
<li><strong>盈利改善:</strong> 2023年库卡盈利改善利润率提升至3.5%以上。盈利拐点已现,净利率由负转正 >1%。后续目标修复至3-5%。</li>
<li><strong>战略调整:</strong> 中国区重点拓展非汽车客户(医疗、物流等)。通过产能转移至中国和核心零部件自制来降本增效。</li>
<li><strong>市场表现:</strong> 2023年上半年出货量逆势增长9%受益于美的集团资源。但外销占80%)受欧美加息抑制固定资产投资影响,全年预计持平。</li>
<li><strong>未来展望:</strong> 订单有望在2024下半年回暖2025年有望受益于行业周期回暖及自身运营调整而改善。</li>
</ul>
</div>
<!-- Research Data -->
<div x-show="tab === 'research'" x-transition>
<h3 class="font-display text-xl font-bold text-white mb-4">研报分析摘要</h3>
<ul class="space-y-3 text-slate-300 list-disc list-inside">
<li><strong>战略地位:</strong> 美的库卡智能制造科技园已成全国最大工业机器人生产基地。公司在机器人领域拥有视觉识别、机械臂控制、人机交互等关键技术。</li>
<li><strong>技术方向:</strong> 积极探索人形机器人在B端商业场景落地并计划将人形机器人技术融入家电产品实现"家电机器人化"。</li>
<li><strong>产业链协同:</strong> 美的集团作为地平线股东,存在更紧密合作基础,地平线的旭日芯片已在美的消费级机器人产品中量产应用。</li>
<li><strong>潜在关联:</strong> 宁波韵升等稀土永磁材料供应商为机器人核心部件供应商,虽未直接点名,但存在潜在客户关系。</li>
</ul>
</div>
</div>
</section>
<!-- Ecosystem & Stock List -->
<section id="ecosystem" class="mb-16">
<h2 class="font-display text-3xl font-bold text-white mb-8 section-title">产业链生态与核心标的</h2>
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
<div class="lg:col-span-1 glass-card rounded-2xl p-6">
<h3 class="font-display text-xl font-bold text-white mb-4">产业链图谱</h3>
<ul class="space-y-4">
<li>
<div class="font-semibold text-blue-300">上游-核心零部件</div>
<p class="text-sm text-slate-400">减速器、伺服/控制系统、电机、线缆/连接器、结构件/PCB</p>
</li>
<li>
<div class="font-semibold text-green-300">中游-本体制造与集成</div>
<p class="text-sm text-slate-400">库卡机器人本体、亚威徕斯等系统集成/合资公司</p>
</li>
<li>
<div class="font-semibold text-purple-300">下游-应用场景</div>
<p class="text-sm text-slate-400">汽车、电子、光伏、物流、医疗、美的自身智能工厂</p>
</li>
</ul>
</div>
<div class="lg:col-span-2 glass-card rounded-2xl p-6">
<h3 class="font-display text-xl font-bold text-white mb-4">供应商分类概览</h3>
<div id="supplier-chart" class="w-full h-64"></div>
</div>
</div>
<div class="mt-8 overflow-x-auto glass-card rounded-2xl p-2">
<table class="table table-sm sm:table-md">
<thead class="text-white">
<tr>
<th class="bg-transparent">股票名称</th>
<th class="bg-transparent">股票代码</th>
<th class="bg-transparent">核心关联逻辑</th>
<th class="bg-transparent hidden md:table-cell">分类</th>
<th class="bg-transparent hidden lg:table-cell">供应部件/关系</th>
</tr>
</thead>
<tbody>
<!-- Data will be populated by JS or directly here -->
<tr><td>万马股份</td><td><a href="https://valuefrontier.cn/company?scode=002276" target="_blank" class="link link-hover text-blue-400">002276</a></td><td>美的KUKA线缆供应商,并且占比较高</td><td class="hidden md:table-cell"><span class="badge badge-info badge-outline">合作类</span></td><td class="hidden lg:table-cell">线缆</td></tr>
<tr><td>新亚电子</td><td><a href="https://valuefrontier.cn/company?scode=605277" target="_blank" class="link link-hover text-blue-400">605277</a></td><td>参股公司科宝光电产品工控自动化电缆直接供应给KUKA</td><td class="hidden md:table-cell"><span class="badge badge-info badge-outline">合作类</span></td><td class="hidden lg:table-cell">电缆</td></tr>
<tr><td>夏厦精密</td><td><a href="https://valuefrontier.cn/company?scode=001306" target="_blank" class="link link-hover text-blue-400">001306</a></td><td>减速机整机产品已成功进入库卡供应商体系</td><td class="hidden md:table-cell"><span class="badge badge-info badge-outline">合作类</span></td><td class="hidden lg:table-cell">减速机</td></tr>
<tr><td>华阳智能</td><td><a href="https://valuefrontier.cn/company?scode=301502" target="_blank" class="link link-hover text-blue-400">301502</a></td><td>美的电机供应商,传闻推进空心杯电机合作</td><td class="hidden md:table-cell"><span class="badge badge-info badge-outline">合作类</span></td><td class="hidden lg:table-cell">空心杯电机</td></tr>
<tr><td>珠城科技</td><td><a href="https://valuefrontier.cn/company?scode=301280" target="_blank" class="link link-hover text-blue-400">301280</a></td><td>已取得库卡供应商代码,并有小批量供货</td><td class="hidden md:table-cell"><span class="badge badge-info badge-outline">合作类</span></td><td class="hidden lg:table-cell">连接器</td></tr>
<tr><td>舜宇精工</td><td><a href="https://valuefrontier.cn/company?scode=920906" target="_blank" class="link link-hover text-blue-400">920906</a></td><td>公司AGV机器人集成解决方案逐步应用于库卡机器人</td><td class="hidden md:table-cell"><span class="badge badge-info badge-outline">合作类</span></td><td class="hidden lg:table-cell">AGV集成</td></tr>
<tr><td>祥鑫科技</td><td><a href="https://valuefrontier.cn/company?scode=002965" target="_blank" class="link link-hover text-blue-400">002965</a></td><td>已为优必选和库卡供应金属结构件相关产品</td><td class="hidden md:table-cell"><span class="badge badge-info badge-outline">合作类</span></td><td class="hidden lg:table-cell">金属结构件</td></tr>
<tr><td>崇达技术</td><td><a href="https://valuefrontier.cn/company?scode=002815" target="_blank" class="link link-hover text-blue-400">002815</a></td><td>部分工控PCB产品有应用在美的库卡机器人上</td><td class="hidden md:table-cell"><span class="badge badge-info badge-outline">合作类</span></td><td class="hidden lg:table-cell">工控PCB</td></tr>
<tr><td>亚威股份</td><td><a href="https://valuefrontier.cn/company?scode=002559" target="_blank" class="link link-hover text-blue-400">002559</a></td><td>与德国库卡集团合资成立亚威徕斯机器人</td><td class="hidden md:table-cell"><span class="badge badge-info badge-outline">合作类</span></td><td class="hidden lg:table-cell">冲压机床与激光设备</td></tr>
<tr><td>合康新能</td><td><a href="https://valuefrontier.cn/company?scode=300048" target="_blank" class="link link-hover text-blue-400">300048</a></td><td>美的控股企业(18.7%),变频器与伺服系统用于人形机器人</td><td class="hidden md:table-cell"><span class="badge badge-success badge-outline">股权类</span></td><td class="hidden lg:table-cell">变频器与伺服系统</td></tr>
<tr><td>巨一科技</td><td><a href="https://valuefrontier.cn/company?scode=688162" target="_blank" class="link link-hover text-blue-400">688162</a></td><td>美的持股2.58%,可提供电机、控制器、减速器</td><td class="hidden md:table-cell"><span class="badge badge-success badge-outline">股权类</span></td><td class="hidden lg:table-cell">电机、控制器、减速器</td></tr>
<tr><td>科陆电子</td><td><a href="https://valuefrontier.cn/company?scode=002121" target="_blank" class="link link-hover text-blue-400">002121</a></td><td>美的控股企业(22.79%),与库卡有业务往来</td><td class="hidden md:table-cell"><span class="badge badge-success badge-outline">股权类</span></td><td class="hidden lg:table-cell">-</td></tr>
<tr><td>瑞德智能</td><td><a href="https://valuefrontier.cn/company?scode=301135" target="_blank" class="link link-hover text-blue-400">301135</a></td><td>美的持股2.67%,供货智能控制器等产品</td><td class="hidden md:table-cell"><span class="badge badge-success badge-outline">股权类</span></td><td class="hidden lg:table-cell">智能控制器</td></tr>
</tbody>
</table>
</div>
</section>
</main>
</div>
<script>
document.addEventListener('DOMContentLoaded', function () {
var chartDom = document.getElementById('supplier-chart');
var myChart = echarts.init(chartDom);
var option;
option = {
tooltip: {
trigger: 'item',
backgroundColor: 'rgba(15, 23, 42, 0.8)',
borderColor: 'rgba(255, 255, 255, 0.2)',
textStyle: { color: '#e5e7eb' }
},
legend: {
top: '5%',
left: 'center',
textStyle: { color: '#d1d5db' }
},
series: [
{
name: '供应商分类',
type: 'pie',
radius: ['40%', '70%'],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 10,
borderColor: '#0f172a',
borderWidth: 2
},
label: {
show: false,
position: 'center'
},
emphasis: {
label: {
show: true,
fontSize: 24,
fontWeight: 'bold',
color: '#ffffff'
}
},
labelLine: {
show: false
},
data: [
{ value: 9, name: '合作类' },
{ value: 4, name: '股权类' },
],
color: ['#3b82f6', '#10b981']
}
]
};
option && myChart.setOption(option);
window.addEventListener('resize', myChart.resize);
});
</script>
</body>
</html>