update pay ui
This commit is contained in:
403
public/htmls/DeepSeek智算一体机.html
Normal file
403
public/htmls/DeepSeek智算一体机.html
Normal file
@@ -0,0 +1,403 @@
|
||||
<!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>DeepSeek智算一体机 - 深度行业研究报告</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>
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
|
||||
|
||||
body {
|
||||
font-family: 'Inter', sans-serif;
|
||||
background-color: #000000;
|
||||
background-image:
|
||||
radial-gradient(ellipse 80% 80% at 50% -20%, rgba(120, 119, 198, 0.3), rgba(255, 255, 255, 0)),
|
||||
url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?q=80&w=2072&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-attachment: fixed;
|
||||
color: #e0e0e0;
|
||||
}
|
||||
|
||||
.glass-card {
|
||||
background: rgba(10, 10, 25, 0.6);
|
||||
backdrop-filter: blur(16px) saturate(180%);
|
||||
-webkit-backdrop-filter: blur(16px) saturate(180%);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 24px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.glass-card:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 0 30px rgba(0, 191, 255, 0.2);
|
||||
border-color: rgba(0, 191, 255, 0.3);
|
||||
}
|
||||
|
||||
.bento-grid {
|
||||
display: grid;
|
||||
gap: 1rem;
|
||||
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||
}
|
||||
|
||||
.bento-item {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.bento-item::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: radial-gradient(circle at var(--x, 50%) var(--y, 50%), rgba(0, 191, 255, 0.2) 0%, transparent 40%);
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.bento-item:hover::before {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.glow-title {
|
||||
text-shadow: 0 0 8px rgba(0, 191, 255, 0.5), 0 0 16px rgba(0, 191, 255, 0.3);
|
||||
}
|
||||
|
||||
.glow-border {
|
||||
border-image: linear-gradient(to right, rgba(0, 191, 255, 0.5), rgba(120, 119, 198, 0.5)) 1;
|
||||
}
|
||||
|
||||
.prose-custom {
|
||||
color: #d1d5db;
|
||||
}
|
||||
|
||||
.prose-custom h1, .prose-custom h2, .prose-custom h3, .prose-custom h4, .prose-custom strong {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.prose-custom ul > li::before {
|
||||
background-color: #00bfff;
|
||||
}
|
||||
|
||||
.table-custom thead tr {
|
||||
border-bottom: 2px solid rgba(0, 191, 255, 0.3);
|
||||
}
|
||||
|
||||
.table-custom tbody tr {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
transition: background-color 0.2s ease;
|
||||
}
|
||||
|
||||
.table-custom tbody tr:hover {
|
||||
background-color: rgba(0, 191, 255, 0.1);
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body class="min-h-screen">
|
||||
<div class="container mx-auto p-4 md:p-8">
|
||||
|
||||
<!-- Header -->
|
||||
<header class="text-center py-12">
|
||||
<h1 class="text-4xl md:text-6xl font-bold glow-title bg-clip-text text-transparent bg-gradient-to-r from-cyan-300 to-indigo-400">
|
||||
DeepSeek智算一体机
|
||||
</h1>
|
||||
<p class="mt-4 text-lg md:text-xl text-gray-300">深度行业研究报告</p>
|
||||
<div class="mt-6 text-sm text-gray-500">
|
||||
<p>由 北京价值前沿科技有限公司 AI投研agent：“价小前投研” 进行投研呈现</p>
|
||||
<p>本报告为AI合成数据，投资需谨慎</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main class="space-y-8">
|
||||
|
||||
<!-- Concept Event & Core View -->
|
||||
<section class="grid grid-cols-1 lg:grid-cols-5 gap-8">
|
||||
<div class="glass-card p-6 lg:col-span-3">
|
||||
<h2 class="text-2xl font-bold mb-4 text-cyan-300">概念事件：技术平权引爆私有化部署浪潮</h2>
|
||||
<div class="prose prose-custom max-w-none">
|
||||
<p>DeepSeek开源其业界领先的AI大模型（特别是671B参数模型），极大地降低了顶尖AI技术的使用门槛。这一“技术平权”事件迅速引爆了市场，尤其是在对数据安全、主权和成本控制有极高要求的政企客户中，产生了强烈的私有化部署需求。由于公有云API调用存在网络不稳定、数据安全隐患及长期成本高昂等问题，“开箱即用”的本地化解决方案——<strong>智算一体机</strong>——应运而生，成为承接这一历史性机遇的关键载体。</p>
|
||||
<p>随着“春节后”企业级需求爆发，各大厂商迅速响应，截至2025年2月底已有超60家企业推出相关产品。从国家队、云巨头到传统ICT厂商和软件解决方案商，全产业链快速入局。品高股份3.6亿元订单等商业化落地案例，标志着概念已从主题炒作向基本面逻辑过渡。国家《全国一体化算力基础设施高质量发展行动计划（2025-2027）》将“国产大模型一体机列入优先采购目录”，为概念的长期发展提供了强有力的政策背书。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="glass-card p-6 lg:col-span-2">
|
||||
<h2 class="text-2xl font-bold mb-4 text-cyan-300">核心观点摘要</h2>
|
||||
<div class="prose prose-custom max-w-none">
|
||||
<p>“DeepSeek智算一体机”概念正处于从<strong>主题爆发期向业绩兑现期过渡</strong>的关键阶段。其核心驱动力源于<strong>DeepSeek技术平权、国家信创与数据安全战略、以及显著的部署成本效益</strong>三重要素的共振。</p>
|
||||
<p>未来，该市场潜力巨大（预测2027年超5000亿元），但将迅速从“百花齐放”的硬件竞赛，演变为一场围绕<strong>生态、渠道和差异化解决方案</strong>的激烈淘汰赛。投资机会将集中在核心生态平台（如华为昇腾）及具备深度行业解决方案能力的集成商。</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Market Analysis & Forecast -->
|
||||
<section class="grid grid-cols-1 lg:grid-cols-2 gap-8">
|
||||
<div class="glass-card p-6">
|
||||
<h2 class="text-2xl font-bold mb-4 text-cyan-300">市场核心逻辑与预期差分析</h2>
|
||||
<div class="prose prose-custom max-w-none">
|
||||
<h4>核心驱动力：</h4>
|
||||
<ul>
|
||||
<li><strong>技术突破与成本下降：</strong>路演数据显示，DeepSeek技术革新使原需多台服务器的部署任务“仅需1到2台”，硬件采购成本大幅降低，解决了私有化部署的经济可行性问题。</li>
|
||||
<li><strong>政策驱动 (AI+信创)：</strong>党政军、央国企是私有化部署主力军，背后是“支持国产大模型”和“保护敏感数据”的双重战略需求，为一体机采购提供了高度确定性。</li>
|
||||
<li><strong>商业模式优势：</strong>“开箱即用”的特性解决了企业IT部门部署能力不足的痛点，极大降低了AI落地门槛，研报称可实现“3小时完成从开机到推理服务上线”。</li>
|
||||
</ul>
|
||||
<h4>预期差分析：</h4>
|
||||
<ul>
|
||||
<li><strong>负向预期差 (风险)：</strong>市场可能高估了进入门槛，低估了竞争的残酷性。路演纪要警示“算力一体机厂商面临同质化竞争风险”，市场快速“红海化”的风险未被充分定价。</li>
|
||||
<li><strong>正向预期差 (机会)：</strong>市场可能低估了“AI+行业”解决方案的价值。当目光聚焦硬件时，提供“硬件+模型+行业应用”深度融合方案的公司（如科大讯飞、天融信）拥有更高的附加值和客户粘性。</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="glass-card p-6 flex flex-col">
|
||||
<h2 class="text-2xl font-bold mb-4 text-cyan-300">市场空间预测 (2025-2027E)</h2>
|
||||
<p class="text-gray-400 mb-4">研报指出，私有化部署需求激增，预计2027年一体机市场空间超5000亿元。</p>
|
||||
<div id="market-forecast-chart" class="flex-grow w-full h-64 md:h-full"></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Key Players Bento Grid -->
|
||||
<section class="glass-card p-6" x-data="{}" @mousemove="
|
||||
const items = document.querySelectorAll('.bento-item');
|
||||
items.forEach(item => {
|
||||
const rect = item.getBoundingClientRect();
|
||||
const x = $event.clientX - rect.left;
|
||||
const y = $event.clientY - rect.top;
|
||||
item.style.setProperty('--x', `${x}px`);
|
||||
item.style.setProperty('--y', `${y}px`);
|
||||
});
|
||||
">
|
||||
<h2 class="text-3xl font-bold mb-6 text-center glow-title">产业链核心厂商概览</h2>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
|
||||
<!-- Column 1 -->
|
||||
<div class="flex flex-col gap-4">
|
||||
<div class="glass-card p-4 bento-item">
|
||||
<h3 class="font-bold text-white">华为昇腾</h3>
|
||||
<p class="text-sm text-gray-300">生态定义者。提供全栈能力，是国产算力生态核心，超13家伙伴基于其推出一体机。</p>
|
||||
</div>
|
||||
<div class="glass-card p-4 bento-item">
|
||||
<h3 class="font-bold text-white">中国电信天翼云</h3>
|
||||
<p class="text-sm text-gray-300">息壤智算一体机-DeepSeek版。定位“安全可控”，主攻国央企、高校市场。</p>
|
||||
</div>
|
||||
<div class="glass-card p-4 bento-item">
|
||||
<h3 class="font-bold text-white">浪潮信息</h3>
|
||||
<p class="text-sm text-gray-300">硬件领导者。推出推理一体机，兼容DeepSeek全系模型，单机支持百亿级模型推理。</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Column 2 -->
|
||||
<div class="flex flex-col gap-4">
|
||||
<div class="glass-card p-4 bento-item">
|
||||
<h3 class="font-bold text-white">科大讯飞</h3>
|
||||
<p class="text-sm text-gray-300">差异化竞争者。推出“星火+DeepSeek双引擎一体机”，融合自有模型优势。</p>
|
||||
</div>
|
||||
<div class="glass-card p-4 bento-item">
|
||||
<h3 class="font-bold text-white">中科曙光</h3>
|
||||
<p class="text-sm text-gray-300">硬件领导者。全国产超融合一体机，液冷技术领先，兼容DeepSeek及其他主流模型。</p>
|
||||
</div>
|
||||
<div class="glass-card p-4 bento-item">
|
||||
<h3 class="font-bold text-white">联想 & 沐曦</h3>
|
||||
<p class="text-sm text-gray-300">国产GPU方案。配备沐曦曦思N260国产GPU，上市首月发货量破千台。</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Column 3 -->
|
||||
<div class="flex flex-col gap-4">
|
||||
<div class="glass-card p-4 bento-item">
|
||||
<h3 class="font-bold text-white">天融信</h3>
|
||||
<p class="text-sm text-gray-300">安全赛道切入。推出安全智算一体机，融合“计算、存储、网络、安全、智能”五大能力。</p>
|
||||
</div>
|
||||
<div class="glass-card p-4 bento-item">
|
||||
<h3 class="font-bold text-white">紫光股份 (新华三)</h3>
|
||||
<p class="text-sm text-gray-300">硬件领导者。灵犀Cube大模型一体机，覆盖14B至671B全规模DeepSeek模型。</p>
|
||||
</div>
|
||||
<div class="glass-card p-4 bento-item">
|
||||
<h3 class="font-bold text-white">中国长城</h3>
|
||||
<p class="text-sm text-gray-300">信创先锋。擎天训推一体机基于飞腾S5000C处理器，全面支持DeepSeek私有化部署。</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Column 4 -->
|
||||
<div class="flex flex-col gap-4">
|
||||
<div class="glass-card p-4 bento-item">
|
||||
<h3 class="font-bold text-white">百度智能云</h3>
|
||||
<p class="text-sm text-gray-300">云厂商代表。千帆DeepSeek一体机，全系支持DeepSeek模型家族，单机8卡可承载满血版。</p>
|
||||
</div>
|
||||
<div class="glass-card p-4 bento-item">
|
||||
<h3 class="font-bold text-white">京东云</h3>
|
||||
<p class="text-sm text-gray-300">云厂商代表。具备国产算力全适配、AI应用开箱即用、超高性价比等特性。</p>
|
||||
</div>
|
||||
<div class="glass-card p-4 bento-item">
|
||||
<h3 class="font-bold text-white">南威软件</h3>
|
||||
<p class="text-sm text-gray-300">智能体方案。融合算力+大模型+智能体，预置30+智能体场景，已获金融、能源订单。</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Catalysts & Investment Conclusion -->
|
||||
<section class="grid grid-cols-1 lg:grid-cols-2 gap-8">
|
||||
<div class="glass-card p-6">
|
||||
<h2 class="text-2xl font-bold mb-4 text-cyan-300">关键催化剂与未来路径</h2>
|
||||
<div class="prose prose-custom max-w-none">
|
||||
<h4>近期催化剂 (3-6个月):</h4>
|
||||
<ul>
|
||||
<li><strong>大规模招标项目落地：</strong>跟踪国家级或省级政务云、大型央企的集中采购公告。</li>
|
||||
<li><strong>国产AI芯片适配进展：</strong>关注华为昇腾、沐曦、海光等与DeepSeek新版本的适配优化成果。</li>
|
||||
<li><strong>标杆应用案例出炉：</strong>类似深圳福田区“AI数智员工”的成功案例形成示范效应，刺激采购需求。</li>
|
||||
</ul>
|
||||
<h4>长期发展路径：</h4>
|
||||
<ol>
|
||||
<li><strong>硬件普及期 (当前-2026):</strong> 核心是“跑马圈地”，竞争焦点在于供应链、成本和渠道。</li>
|
||||
<li><strong>解决方案深化期 (2026-2027):</strong> 硬件同质化，竞争转向MaaS平台、行业知识库等软件服务能力。</li>
|
||||
<li><strong>生态成熟期 (2027以后):</strong> 形成少数几个核心技术生态圈，市场份额高度集中。</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
<div class="glass-card p-6">
|
||||
<h2 class="text-2xl font-bold mb-4 text-cyan-300">综合结论与投资启示</h2>
|
||||
<div class="prose prose-custom max-w-none">
|
||||
<p>“DeepSeek智算一体机”概念已走过纯粹炒作阶段，进入<strong>由订单和业绩驱动的1.0时代</strong>。这是一个由真实需求引爆、具备广阔前景的赛道，但行业的“内卷”程度也远超预期，投资需精挑细选。</p>
|
||||
<h4>最具投资价值的细分环节：</h4>
|
||||
<ol>
|
||||
<li><strong>核心生态平台：</strong>以<strong>华为昇腾</strong>为代表的国产AI芯片及生态提供商，议价能力最强，护城河最深。</li>
|
||||
<li><strong>具备差异化解决方案能力的集成商：</strong>能将一体机与自身<strong>行业Know-how、专有数据或特定功能（如安全）</strong>深度绑定的公司，有望在价格战中维持较高毛利率。</li>
|
||||
</ol>
|
||||
<h4>需重点跟踪的关键指标：</h4>
|
||||
<ul>
|
||||
<li>订单公告与合同金额</li>
|
||||
<li>毛利率变化</li>
|
||||
<li>国产AI芯片出货量</li>
|
||||
<li>下游应用渗透率</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Stock Table -->
|
||||
<section class="glass-card p-6">
|
||||
<h2 class="text-3xl font-bold mb-6 text-center glow-title">相关核心上市公司列表</h2>
|
||||
<div class="overflow-x-auto">
|
||||
<table class="table table-custom w-full">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="text-white">股票名称</th>
|
||||
<th class="text-white">股票代码</th>
|
||||
<th class="text-white">核心逻辑 / 产品名称</th>
|
||||
<th class="text-white">其他标签</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr><td>浪潮信息</td><td><a href='https://valuefrontier.cn/company?scode=000977' target='_blank' class='link link-hover text-cyan-400'>000977</a></td><td>浪潮 DeepSeek“推理一体机”</td><td>硬件领导者, 全面兼容DeepSeek V3/R1</td></tr>
|
||||
<tr><td>中科曙光</td><td><a href='https://valuefrontier.cn/company?scode=603019' target='_blank' class='link link-hover text-cyan-400'>603019</a></td><td>曙光 DeepSeek人工智能一体机</td><td>硬件领导者, 液冷技术领先, SothisAI3.0平台</td></tr>
|
||||
<tr><td>紫光股份</td><td><a href='https://valuefrontier.cn/company?scode=000938' target='_blank' class='link link-hover text-cyan-400'>000938</a></td><td>新华三 DeepSeek智能一体机</td><td>硬件领导者, UniCube, 支持全系列模型</td></tr>
|
||||
<tr><td>科大讯飞</td><td><a href='https://valuefrontier.cn/company?scode=002230' target='_blank' class='link link-hover text-cyan-400'>002230</a></td><td>“星火+DeepSeek双引擎一体机”</td><td>差异化竞争, AI软件龙头</td></tr>
|
||||
<tr><td>天融信</td><td><a href='https://valuefrontier.cn/company?scode=002212' target='_blank' class='link link-hover text-cyan-400'>002212</a></td><td>融信 DeepSeek安全智算一体机</td><td>安全赛道切入, "五位一体"能力</td></tr>
|
||||
<tr><td>拓维信息</td><td><a href='https://valuefrontier.cn/company?scode=002261' target='_blank' class='link link-hover text-cyan-400'>002261</a></td><td>兆瀚AI算力硬件 (基于昇腾+鲲鹏)</td><td>华为昇腾生态, 适配满血版671B</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>长城擎天GF7280 V5 AI训推一体机</td><td>信创先锋, 基于飞腾CPU</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>息壤智算一体机-DeepSeek版</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>DeepSeek一体机</td><td>国家队, 基于"星罗"算力平台</td></tr>
|
||||
<tr><td>软通动力</td><td><a href='https://valuefrontier.cn/company?scode=301236' target='_blank' class='link link-hover text-cyan-400'>301236</a></td><td>软通动力 DeepSeek应用方案一体机</td><td>解决方案商, "算力+模型+应用"集成</td></tr>
|
||||
<tr><td>深信服</td><td><a href='https://valuefrontier.cn/company?scode=300454' target='_blank' class='link link-hover text-cyan-400'>300454</a></td><td>深信服一朵云平台</td><td>为DeepSeek场景提供一键部署、性能优化方案</td></tr>
|
||||
<tr><td>麒麟信安</td><td><a href='https://valuefrontier.cn/company?scode=688152' target='_blank' class='link link-hover text-cyan-400'>688152</a></td><td>麒麟信安全国产化智算一体机</td><td>全国产化, 鲲鹏+昇腾+麒麟OS</td></tr>
|
||||
<tr><td>优刻得</td><td><a href='https://valuefrontier.cn/company?scode=688158' target='_blank' class='link link-hover text-cyan-400'>688158</a></td><td>优刻得DeepSeek满血版大模型一体机</td><td>支持多种国产AI芯片, 全栈式解决方案</td></tr>
|
||||
<tr><td>云从科技</td><td><a href='https://valuefrontier.cn/company?scode=688327' target='_blank' class='link link-hover text-cyan-400'>688327</a></td><td>从容大模型训推一体机</td><td>基于昇腾平台, 支持多模态模型</td></tr>
|
||||
<tr><td>新致软件</td><td><a href='https://valuefrontier.cn/company?scode=688590' target='_blank' class='link link-hover text-cyan-400'>688590</a></td><td>新致信创一体机</td><td>基于海光DCU服务器, 支持百亿级模型训练</td></tr>
|
||||
<tr><td>海光信息</td><td><a href='https://valuefrontier.cn/company?scode=688041' target='_blank' class='link link-hover text-cyan-400'>688041</a></td><td>提供核心DCU芯片</td><td>上游核心算力, DeepSeek FP8官方适配</td></tr>
|
||||
<tr><td>品高股份</td><td><a href='https://valuefrontier.cn/company?scode=688227' target='_blank' class='link link-hover text-cyan-400'>688227</a></td><td>DeepSeek V3.1大模型一体机</td><td>获3.6亿元大单, 订单驱动型</td></tr>
|
||||
<tr><td>恒为科技</td><td><a href='https://valuefrontier.cn/company?scode=603496' target='_blank' class='link link-hover text-cyan-400'>603496</a></td><td>昇腾/DeepSeek一体机</td><td>训推/推理两类, 主打开箱即用</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
var chartDom = document.getElementById('market-forecast-chart');
|
||||
var myChart = echarts.init(chartDom);
|
||||
var option;
|
||||
|
||||
option = {
|
||||
backgroundColor: 'transparent',
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'cross',
|
||||
label: {
|
||||
backgroundColor: '#6a7985'
|
||||
}
|
||||
},
|
||||
textStyle: {
|
||||
color: '#ffffff'
|
||||
},
|
||||
backgroundColor: 'rgba(20, 20, 40, 0.8)',
|
||||
borderColor: '#00bfff'
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
data: ['2025', '2026', '2027'],
|
||||
axisLine: { lineStyle: { color: 'rgba(255,255,255,0.5)' } },
|
||||
axisLabel: { color: '#e0e0e0' }
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
name: '市场空间 (亿元)',
|
||||
axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,0.5)' } },
|
||||
axisLabel: { color: '#e0e0e0' },
|
||||
splitLine: { lineStyle: { color: 'rgba(255,255,255,0.1)' } }
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '市场空间',
|
||||
type: 'line',
|
||||
stack: 'Total',
|
||||
smooth: true,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
color: '#00bfff'
|
||||
},
|
||||
showSymbol: false,
|
||||
areaStyle: {
|
||||
opacity: 0.8,
|
||||
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)' }
|
||||
])
|
||||
},
|
||||
emphasis: {
|
||||
focus: 'series'
|
||||
},
|
||||
data: [1236, 2937, 5208]
|
||||
}
|
||||
],
|
||||
textStyle: {
|
||||
color: '#e0e0e0'
|
||||
}
|
||||
};
|
||||
|
||||
option && myChart.setOption(option);
|
||||
|
||||
window.addEventListener('resize', () => {
|
||||
myChart.resize();
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user