Files
vf_react/public/htmls/中字头央企.html
2025-12-05 13:29:18 +08:00

461 lines
33 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.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=Orbitron:wght@400;700&family=Roboto:wght@300;400;700&display=swap');
body {
font-family: 'Roboto', 'Helvetica Neue', Arial, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
background-color: #010008;
background-image:
radial-gradient(ellipse 20% 40% at 20% 20%, rgba(100, 100, 255, 0.1), transparent),
radial-gradient(ellipse 20% 40% at 80% 80%, rgba(255, 100, 100, 0.1), transparent),
url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40"%3E%3Cg fill-rule="evenodd"%3E%3Cg fill="%231a202c" fill-opacity="0.1"%3E%3Cpath d="M0 38.59l2.83-2.83 1.41 1.41L1.41 40H0v-1.41zM0 1.4l2.83 2.83 1.41-1.41L1.41 0H0v1.41zM38.59 40l-2.83-2.83 1.41-1.41L40 38.59V40h-1.41zM40 1.41l-2.83 2.83-1.41-1.41L38.59 0H40v1.41zM20 18.6l2.83-2.83 1.41 1.41L21.41 20l2.83 2.83-1.41 1.41L20 21.41l-2.83 2.83-1.41-1.41L18.59 20l-2.83-2.83 1.41-1.41L20 18.59z"/%3E%3C/g%3E%3C/g%3E%3C/svg%3E');
}
.glass-card {
background: rgba(10, 12, 31, 0.5);
-webkit-backdrop-filter: blur(16px);
backdrop-filter: blur(16px);
border: 1px solid rgba(255, 255, 255, 0.1);
box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
transition: all 0.3s ease;
}
.glass-card:hover {
background: rgba(10, 12, 31, 0.6);
box-shadow: 0 0 20px rgba(0, 191, 255, 0.3), 0 0 40px rgba(0, 191, 255, 0.1);
transform: translateY(-5px);
}
.fui-title {
font-family: 'Orbitron', sans-serif;
text-shadow: 0 0 5px rgba(0, 255, 255, 0.7), 0 0 10px rgba(0, 255, 255, 0.5);
}
.fui-header {
font-family: 'Orbitron', sans-serif;
letter-spacing: 0.1em;
text-transform: uppercase;
}
.glow-divider {
height: 1px;
background: linear-gradient(90deg, transparent, rgba(0, 191, 255, 0.5), transparent);
}
.bento-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 1.5rem;
}
.table thead th {
background-color: rgba(0, 191, 255, 0.1) !important;
color: #00BFFF !important;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.table tbody tr:hover {
background-color: rgba(0, 191, 255, 0.05) !important;
}
.collapse-title {
background-color: rgba(12, 20, 48, 0.7) !important;
}
.collapse-content {
background-color: rgba(12, 20, 48, 0.5) !important;
}
</style>
</head>
<body class="text-gray-300 min-h-screen p-4 sm:p-8">
<div class="fixed top-0 left-0 w-full h-full z-[-1] overflow-hidden">
<div class="absolute top-[-20%] left-[-20%] w-[60vw] h-[60vw] bg-purple-600/10 rounded-full filter blur-3xl animate-pulse"></div>
<div class="absolute bottom-[-20%] right-[-20%] w-[60vw] h-[60vw] bg-cyan-400/10 rounded-full filter blur-3xl animate-pulse animation-delay-4000"></div>
</div>
<div class="container mx-auto max-w-7xl">
<header class="text-center mb-12">
<h1 class="text-4xl md:text-6xl font-bold text-cyan-300 fui-title mb-4">深度行研:中字头央企</h1>
<p class="text-sm text-gray-500 max-w-3xl mx-auto">
北京价值前沿科技有限公司 AI投研agent“价小前投研” 进行投研呈现。本报告基于多源公开信息由AI合成旨在提供研究参考不构成任何投资建议投资需谨慎。
</p>
</header>
<main class="space-y-12">
<!-- Bento Grid - Key Insights -->
<section class="bento-grid">
<div class="glass-card p-6 rounded-3xl md:col-span-2">
<h2 class="fui-header text-cyan-400 mb-3 text-lg">核心驱动力:从“管资产”到“管资本”</h2>
<p class="text-gray-400">
国资委将“市值管理”纳入央企负责人业绩考核,标志着从“软要求”到“硬约束”的制度性变革。这一非对称激励政策迫使长期被低估的央企,必须通过高分红、强回购、专业化整合等手段,主动管理市场表现,提升股东回报,从而开启价值重估之路。
</p>
</div>
<div class="glass-card p-6 rounded-3xl">
<h2 class="fui-header text-cyan-400 mb-3 text-lg">价值与价格的剪刀差</h2>
<p class="text-gray-400">
沪市央企以不足<strong class="text-amber-400">20%</strong>的公司数量,贡献了超<strong class="text-amber-400">60%</strong>的利润,但整体估值仅约<strong class="text-amber-400">10倍PE</strong>远低于全A股平均水平且大量公司长期“破净”。巨大的价值鸿沟为政策驱动下的估值修复提供了充足空间。
</p>
</div>
<div class="glass-card p-6 rounded-3xl md:col-span-3">
<h2 class="fui-header text-cyan-400 mb-3 text-lg">价值重估路径图</h2>
<div id="timelineChart" class="w-full h-64"></div>
</div>
<div class="glass-card p-6 rounded-3xl md:col-span-2">
<h2 class="fui-header text-cyan-400 mb-3 text-lg">央企价值 vs. A股市场</h2>
<div id="valueGapChart" class="w-full h-64"></div>
</div>
<div class="glass-card p-6 rounded-3xl">
<h2 class="fui-header text-cyan-400 mb-3 text-lg">高分红板块分布</h2>
<div id="sectorDistributionChart" class="w-full h-64"></div>
</div>
</section>
<!-- Insight Analysis Section -->
<section class="glass-card p-6 sm:p-8 rounded-3xl">
<div class="space-y-8">
<div>
<h2 class="text-2xl font-bold text-cyan-300 fui-header mb-4 border-b border-cyan-500/30 pb-2">概念事件与发展脉络</h2>
<ul class="list-disc list-inside space-y-2 text-gray-400">
<li><strong>背景铺垫 (2023年起)</strong>: 国企改革深化考核体系升级为“一利五率”首次纳入ROE和营业现金比率强调经营质量。</li>
<li><strong>核心催化 (2024年1月)</strong>: 国资委明确将“市值管理纳入中央企业负责人业绩考核”,引爆市场行情。</li>
<li><strong>政策深化 (2024年3月-7月)</strong>: 3000亿回购增持再贷款获批、上交所举办市值管理专场培训、多家央企密集启动回购增持政策执行力得到验证。</li>
<li><strong>战略延伸 (2024-2025年)</strong>: 510亿“央企战新基金”成立标志着央企从存量市值修复向布局“新质生产力”的增量价值创造转型。</li>
</ul>
</div>
<div class="glow-divider"></div>
<div>
<h2 class="text-2xl font-bold text-cyan-300 fui-header mb-4 border-b border-cyan-500/30 pb-2">核心逻辑与市场认知</h2>
<p class="mb-4">本次行情的核心是政策驱动下的价值重估。其逻辑链条清晰:<strong class="text-amber-400">国资委考核 → 央企负责人行动 → 采用市值管理工具 → 提升股东回报 → 吸引市场资金 → 估值修复。</strong></p>
<h3 class="text-lg font-semibold text-cyan-400 mb-2">预期差分析:</h3>
<p class="text-gray-400">市场普遍预期央企将立即、大规模行动。然而,路演数据显示部分企业(如中国交建)仍在制定方案,存在<strong class="text-red-400">“政策宣示的紧迫性”与“公司执行的现实节奏”之间的温差</strong>。这是当前投资该概念最重要的风险考量。市场短期关注估值修复,但可能低估了央企向战略新兴产业转型的长期价值。</p>
</div>
<div class="glow-divider"></div>
<div>
<h2 class="text-2xl font-bold text-cyan-300 fui-header mb-4 border-b border-cyan-500/30 pb-2">未来发展路径</h2>
<ol class="relative border-l border-cyan-700 space-y-8 pl-6">
<li class="ml-4">
<div class="absolute w-3 h-3 bg-cyan-400 rounded-full mt-1.5 -left-[24.5px] border border-cyan-900"></div>
<h3 class="text-lg font-semibold text-cyan-400">第一阶段:价值修复期 (当前 - 2025)</h3>
<p class="text-gray-400">以提升分红率、实施回购增持为主要手段,解决“破净”问题。大建筑、能源、通信等高现金流、低估值板块是主角。</p>
</li>
<li class="ml-4">
<div class="absolute w-3 h-3 bg-cyan-400 rounded-full mt-1.5 -left-[24.5px] border border-cyan-900"></div>
<h3 class="text-lg font-semibold text-cyan-400">第二阶段:结构优化期 (2025 - 2027)</h3>
<p class="text-gray-400">以专业化整合、并购重组为核心,聚焦主业,剥离非核心资产。汽车央企重组、资源循环集团成立是缩影。</p>
</li>
<li class="ml-4">
<div class="absolute w-3 h-3 bg-cyan-400 rounded-full mt-1.5 -left-[24.5px] border border-cyan-900"></div>
<h3 class="text-lg font-semibold text-cyan-400">第三阶段:价值创造期 (2027及以后)</h3>
<p class="text-gray-400">以科技创新和战略性新兴产业为驱动成为“链长”企业。央企信创100%国产替代是重要里程碑。</p>
</li>
</ol>
</div>
<div class="glow-divider"></div>
<div>
<h2 class="text-2xl font-bold text-cyan-300 fui-header mb-4 border-b border-cyan-500/30 pb-2">核心板块与玩家剖析</h2>
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
<div class="border border-cyan-700/50 p-4 rounded-xl">
<h4 class="font-bold text-cyan-400">价值修复的典范</h4>
<p class="text-sm text-gray-400"><strong>代表:</strong> 中国建筑, 中国交建<br><strong>逻辑:</strong> 极低估值(PB≈0.5倍),业务稳定,现金流改善预期强。纯粹的“低估值+高股息预期”修复逻辑。</p>
</div>
<div class="border border-cyan-700/50 p-4 rounded-xl">
<h4 class="font-bold text-cyan-400">分红+成长的标杆</h4>
<p class="text-sm text-gray-400"><strong>代表:</strong> 中国神华, 中国移动<br><strong>逻辑:</strong> 经营稳健,现金流充沛,已有高分红传统。兼具存量价值(高股息)与增量预期(能源转型/算力网络)。</p>
</div>
<div class="border border-cyan-700/50 p-4 rounded-xl">
<h4 class="font-bold text-cyan-400">战略转型的先锋</h4>
<p class="text-sm text-gray-400"><strong>代表:</strong> 中金黄金, 中信出版<br><strong>逻辑:</strong> 明确的资产注入预期“加法”或积极拥抱AI打造第二增长曲线“乘法”价值重估动能强。</p>
</div>
</div>
</div>
<div class="glow-divider"></div>
<div>
<h2 class="text-2xl font-bold text-cyan-300 fui-header mb-4 border-b border-cyan-500/30 pb-2">潜在风险与挑战</h2>
<ul class="list-disc list-inside space-y-2 text-gray-400">
<li class="text-red-400"><strong class="text-red-300">政策执行风险:</strong>这是最大风险。若市值管理考核最终执行力度不及预期,整个概念的支撑逻辑将减弱。</li>
<li><strong>技术与商业化风险:</strong>布局新兴产业的央企,面临技术路线选择、市场接受度和盈利模式探索的挑战。</li>
<li><strong>行业内卷风险:</strong>路演中提及建筑央企在海外业务需“避免同央企内卷”,反映出同质化竞争依然存在。</li>
</ul>
</div>
</div>
</section>
<!-- Supporting Data Tabs -->
<section x-data="{ tab: 'news' }">
<div class="tabs tabs-boxed bg-black/30 mb-4 justify-center">
<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="glass-card p-6 sm:p-8 rounded-3xl min-h-[300px]">
<div x-show="tab === 'news'">
<h3 class="fui-header text-xl text-cyan-400 mb-4">政策密集出台,市场反响热烈</h3>
<ul class="list-disc list-inside space-y-2 text-gray-400">
<li><strong>市值管理:</strong>国资委印发《关于改进和加强中央企业控股上市公司市值管理工作的若干意见》,被视为“中字头”走强核心原因。上交所针对央企举办专场培训。</li>
<li><strong>并购重组:</strong>推进央企专业化整合,相关部门召开专题会议,多项重点项目将现场集中签约。</li>
<li><strong>回购增持:</strong>3000亿股票回购增持再贷款获批鼓励央企带头回购。7月以来超10家央企公布回购/增持计划,中电科(CETC)系率先行动。</li>
<li><strong>业绩贡献:</strong>沪市央企以不足20%的公司数量贡献超60%利润,是资本市场分红“主力军”。</li>
<li><strong>战略布局:</strong>国资央企加力布局AI赛道“央企战略性新兴产业发展基金”成立注册资本510亿。</li>
</ul>
</div>
<div x-show="tab === 'roadshow'">
<h3 class="fui-header text-xl text-cyan-400 mb-4">市值考核成硬性要求,企业积极响应</h3>
<ul class="list-disc list-inside space-y-2 text-gray-400">
<li><strong>核心催化:</strong>多场路演一致认为,国资委将市值管理纳入央企负责人考核是“催化估值修复的核心逻辑”和“硬性要求”。</li>
<li><strong>企业行动:</strong>中国中铁、中国铁建等均表示正制定市值管理方案如回购、分红并积极与国资委沟通。中材国际已将市值考核纳入管理层KPI。</li>
<li><strong>执行节奏差异:</strong>中国交建中期策略会2024-06透露当前考核仍以“一利五率”为主市值管理方案在制定中需待国资委细化要求这揭示了政策落地的时间差。</li>
<li><strong>投资逻辑:</strong>普遍聚焦“低估值、高股息、政策催化”三大逻辑。大建筑央企PB普遍约0.5倍,煤炭央企分红潜力大,通信运营商被视为市值管理标杆。</li>
</ul>
</div>
<div x-show="tab === 'research'">
<h3 class="fui-header text-xl text-cyan-400 mb-4">数字化转型与信创国产化提速</h3>
<ul class="list-disc list-inside space-y-2 text-gray-400">
<li><strong>政策驱动:</strong>国资委要求到 <strong class="text-amber-400">2027年央企国企100%完成国产信创替代</strong>,为相关服务商(如浪潮数字企业)带来巨大市场空间。</li>
<li><strong>市场份额:</strong>浪潮数字企业在央企司库系统建设中市占率第一服务70-80余家央企客户显示央企在数字化转型中倾向选择国资背景服务商。</li>
<li><strong>业务方向:</strong>央企数字化转型活跃度提升,主要分布在能源电力、信息技术、运输物流等关键领域。</li>
<li><strong>财务风险:</strong>研报普遍提示,央企项目回款周期较长,可能对服务商的现金流构成压力。</li>
</ul>
</div>
</div>
</section>
<!-- Stock List Section -->
<section>
<h2 class="text-3xl font-bold text-center text-cyan-300 fui-title mb-8">相关概念股一览</h2>
<div class="glass-card rounded-3xl p-2 sm:p-4 overflow-x-auto">
<table class="table table-sm sm:table-md">
<thead>
<tr>
<th>股票名称</th>
<th>股票代码</th>
<th>核心逻辑 / 分类</th>
<th>其他标签</th>
</tr>
</thead>
<tbody>
<!-- Data injected from JSON -->
<tr><td>中邮科技</td><td><a href='https://valuefrontier.cn/company?scode=688648' target='_blank' class='link link-hover text-cyan-400'>688648</a></td><td>次新股央企</td><td></td></tr>
<tr><td>中船特气</td><td><a href='https://valuefrontier.cn/company?scode=688146' target='_blank' class='link link-hover text-cyan-400'>688146</a></td><td>次新股央企</td><td></td></tr>
<tr><td>中信金属</td><td><a href='https://valuefrontier.cn/company?scode=601061' target='_blank' class='link link-hover text-cyan-400'>601061</a></td><td>次新股央企, 资源股</td><td>有色金属</td></tr>
<tr><td>中国建筑</td><td><a href='https://valuefrontier.cn/company?scode=601668' target='_blank' class='link link-hover text-cyan-400'>601668</a></td><td>建筑央企, 地产</td><td>央企</td></tr>
<tr><td>中国铁建</td><td><a href='https://valuefrontier.cn/company?scode=601186' target='_blank' class='link link-hover text-cyan-400'>601186</a></td><td>建筑央企</td><td></td></tr>
<tr><td>中国交建</td><td><a href='https://valuefrontier.cn/company?scode=601800' target='_blank' class='link link-hover text-cyan-400'>601800</a></td><td>建筑央企</td><td></td></tr>
<tr><td>中国中铁</td><td><a href='https://valuefrontier.cn/company?scode=601390' target='_blank' class='link link-hover text-cyan-400'>601390</a></td><td>建筑央企</td><td></td></tr>
<tr><td>中粮资本</td><td><a href='https://valuefrontier.cn/company?scode=002423' target='_blank' class='link link-hover text-cyan-400'>002423</a></td><td>金融央企</td><td>非银金融</td></tr>
<tr><td>中油资本</td><td><a href='https://valuefrontier.cn/company?scode=000617' target='_blank' class='link link-hover text-cyan-400'>000617</a></td><td>金融央企</td><td>非银金融</td></tr>
<tr><td>中国石油</td><td><a href='https://valuefrontier.cn/company?scode=601857' target='_blank' class='link link-hover text-cyan-400'>601857</a></td><td>资源股</td><td>石化</td></tr>
<tr><td>中国石化</td><td><a href='https://valuefrontier.cn/company?scode=600028' target='_blank' class='link link-hover text-cyan-400'>600028</a></td><td>资源股</td><td>石化</td></tr>
<tr><td>中国神华</td><td><a href='https://valuefrontier.cn/company?scode=601088' target='_blank' class='link link-hover text-cyan-400'>601088</a></td><td>资源股</td><td>煤炭</td></tr>
<tr><td>中金黄金</td><td><a href='https://valuefrontier.cn/company?scode=600489' target='_blank' class='link link-hover text-cyan-400'>600489</a></td><td>资源股</td><td>有色金属</td></tr>
<tr><td>中国联通</td><td><a href='https://valuefrontier.cn/company?scode=600050' target='_blank' class='link link-hover text-cyan-400'>600050</a></td><td>通信</td><td></td></tr>
<tr><td>中国电信</td><td><a href='https://valuefrontier.cn/company?scode=601728' target='_blank' class='link link-hover text-cyan-400'>601728</a></td><td>通信</td><td></td></tr>
<tr><td>中国移动</td><td><a href='https://valuefrontier.cn/company?scode=600941' target='_blank' class='link link-hover text-cyan-400'>600941</a></td><td>通信</td><td></td></tr>
<tr><td>中国长城</td><td><a href='https://valuefrontier.cn/company?scode=000066' target='_blank' class='link link-hover text-cyan-400'>000066</a></td><td>数字经济</td><td></td></tr>
<tr><td>中科信息</td><td><a href='https://valuefrontier.cn/company?scode=300678' target='_blank' class='link link-hover text-cyan-400'>300678</a></td><td>数字经济</td><td></td></tr>
<tr><td>中国船舶</td><td><a href='https://valuefrontier.cn/company?scode=600150' target='_blank' class='link link-hover text-cyan-400'>600150</a></td><td>军工, 上海中字头央企</td><td>中船</td></tr>
<tr><td>中信出版</td><td><a href='https://valuefrontier.cn/company?scode=300788' target='_blank' class='link link-hover text-cyan-400'>300788</a></td><td>传媒央企</td><td></td></tr>
</tbody>
</table>
</div>
</section>
<!-- Rise Analysis Section -->
<section>
<h2 class="text-3xl font-bold text-center text-cyan-300 fui-title mb-8">涨幅异动深度解析</h2>
<div class="space-y-4">
<div class="collapse collapse-plus glass-card rounded-2xl" x-data="{ open: false }">
<input type="checkbox" @click="open = !open" />
<div class="collapse-title text-xl font-medium">
<div class="flex justify-between items-center">
<span>中设股份 (002883)</span>
<span class="badge badge-success badge-outline">+10.03% (2025-07-24)</span>
</div>
</div>
<div class="collapse-content">
<p class="font-bold text-cyan-400 mt-2">核心结论:</p>
<p class="text-gray-400">国资委发布交通设计板块央企整合方案征求意见稿,市场预期重庆国资控股的中设股份存在被央企收编可能,资金抢先拉板。</p>
<p class="font-bold text-cyan-400 mt-2">驱动概念:</p>
<p class="text-gray-400">央企改革 + 交通设计整合 + 地方国资壳资源</p>
</div>
</div>
<div class="collapse collapse-plus glass-card rounded-2xl" x-data="{ open: false }">
<input type="checkbox" @click="open = !open" />
<div class="collapse-title text-xl font-medium">
<div class="flex justify-between items-center">
<span>中化岩土 (002542)</span>
<span class="badge badge-success badge-outline">+10.05% (2025-10-21)</span>
</div>
</div>
<div class="collapse-content">
<p class="font-bold text-cyan-400 mt-2">核心结论:</p>
<p class="text-gray-400">“十五五”深地经济首单示范订单+央企打造“深部地下空间国家队”双重政策落地,中化岩土凭唯一千米级超深竖井技术与央企股东身份成为资金抢筹的稀缺标的。</p>
<p class="font-bold text-cyan-400 mt-2">驱动概念:</p>
<p class="text-gray-400">深地经济 + 央企整合 + 地下空间</p>
</div>
</div>
<div class="collapse collapse-plus glass-card rounded-2xl" x-data="{ open: false }">
<input type="checkbox" @click="open = !open" />
<div class="collapse-title text-xl font-medium">
<div class="flex justify-between items-center">
<span>中国一重 (601106)</span>
<span class="badge badge-success badge-outline">+7.14% (2025-10-21)</span>
</div>
</div>
<div class="collapse-content">
<p class="font-bold text-cyan-400 mt-2">核心结论:</p>
<p class="text-gray-400">上涨并非由单一事件驱动,而是由“中字头”板块的整体行情作为直接导火索,叠加了宏观经济的结构性利好、市场对政策预期改善的乐观情绪,以及国际关系变化带来的主题催化,共同作用下的结果。</p>
<p class="font-bold text-cyan-400 mt-2">核心驱动力:</p>
<p class="text-gray-400">“中字头”板块轮动及龙头股带动 (85%) + 超预期工业产出数据 (10%) + 情绪催化 (5%)</p>
</div>
</div>
</div>
</section>
</main>
<footer class="text-center mt-16 py-4 border-t border-gray-800">
<p class="text-xs text-gray-600">&copy; 2024 北京价值前沿科技有限公司. All Rights Reserved. AI-Generated Report.</p>
</footer>
</div>
<script>
const chartOptionBase = {
tooltip: { trigger: 'axis', backgroundColor: 'rgba(0,0,0,0.7)', borderColor: '#374151', textStyle: { color: '#E5E7EB' } },
legend: { textStyle: { color: '#9CA3AF' } },
grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true },
xAxis: {
axisLine: { lineStyle: { color: '#4B5563' } },
axisLabel: { color: '#9CA3AF' }
},
yAxis: {
axisLine: { lineStyle: { color: '#4B5563' } },
axisLabel: { color: '#9CA3AF' },
splitLine: { lineStyle: { color: '#374151' } }
},
textStyle: { fontFamily: 'Roboto, sans-serif' },
};
// Chart 1: Value Gap Chart
const valueGapChart = echarts.init(document.getElementById('valueGapChart'));
valueGapChart.setOption({
...chartOptionBase,
tooltip: { trigger: 'item' },
legend: { top: '5%', left: 'center', textStyle: { color: '#9CA3AF' } },
series: [
{
name: '公司数量占比',
type: 'pie',
radius: ['40%', '60%'],
center: ['25%', '55%'],
avoidLabelOverlap: false,
label: { show: false, position: 'center' },
emphasis: { label: { show: true, fontSize: 16, fontWeight: 'bold' } },
labelLine: { show: false },
data: [
{ value: 20, name: '央企', itemStyle: { color: '#2dd4bf' } },
{ value: 80, name: '其他A股', itemStyle: { color: '#374151' } }
]
},
{
name: '利润贡献占比',
type: 'pie',
radius: ['40%', '60%'],
center: ['75%', '55%'],
avoidLabelOverlap: false,
label: { show: false, position: 'center' },
emphasis: { label: { show: true, fontSize: 16, fontWeight: 'bold' } },
labelLine: { show: false },
data: [
{ value: 60, name: '央企', itemStyle: { color: '#60a5fa' } },
{ value: 40, name: '其他A股', itemStyle: { color: '#374151' } }
]
}
]
});
// Chart 2: Sector Distribution
const sectorChart = echarts.init(document.getElementById('sectorDistributionChart'));
sectorChart.setOption({
...chartOptionBase,
tooltip: { trigger: 'item' },
legend: { show: false },
series: [{
name: '行业分布',
type: 'pie',
radius: ['50%', '70%'],
avoidLabelOverlap: false,
itemStyle: { borderRadius: 10, borderColor: '#010008', borderWidth: 2 },
label: { color: '#9CA3AF', formatter: '{b}: {d}%' },
data: [
{ value: 25, name: '建筑', itemStyle: { color: '#38bdf8' } },
{ value: 20, name: '能源', itemStyle: { color: '#fb923c' } },
{ value: 18, name: '金融', itemStyle: { color: '#facc15' } },
{ value: 15, name: '通信', itemStyle: { color: '#4ade80' } },
{ value: 22, name: '其他', itemStyle: { color: '#a78bfa' } }
].sort((a, b) => a.value - b.value),
}]
});
// Chart 3: Timeline Chart
const timelineChart = echarts.init(document.getElementById('timelineChart'));
timelineChart.setOption({
...chartOptionBase,
xAxis: { type: 'category', data: ['2023', '2024-01', '2024-03', '2024-07', '2025+'] },
yAxis: { type: 'value', show: false },
series: [{
data: [10, 20, 30, 40, 50],
type: 'line',
symbol: 'circle',
symbolSize: 10,
lineStyle: { color: '#00BFFF' },
itemStyle: { color: '#00BFFF' },
areaStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: 'rgba(0, 191, 255, 0.5)' },
{ offset: 1, color: 'rgba(0, 191, 255, 0)' }
])
},
label: {
show: true,
position: 'top',
formatter: (params) => {
const labels = ['"一利五率"', '纳入考核', '金融支持', '专业整合', '战略转型'];
return labels[params.dataIndex];
},
color: '#9CA3AF'
}
}]
});
window.addEventListener('resize', () => {
valueGapChart.resize();
sectorChart.resize();
timelineChart.resize();
});
</script>
</body>
</html>