update pay ui

This commit is contained in:
2025-12-05 13:29:18 +08:00
parent 20994cfb13
commit 48d9c76c5e
1008 changed files with 417880 additions and 486974 deletions

View File

@@ -0,0 +1,471 @@
<!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>深度投研报告马斯克Grok3大模型</title>
<link href="https://cdn.jsdelivr.net/npm/daisyui@4.12.2/dist/full.min.css" rel="stylesheet" type="text/css" />
<script src="https://cdn.tailwindcss.com/3.4.4"></script>
<script src="https://cdn.jsdelivr.net/npm/echarts@5.5.0/dist/echarts.min.js"></script>
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.14.0/dist/cdn.min.js"></script>
<style>
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');
body {
font-family: 'Poppins', sans-serif;
background-color: #020011;
overflow-x: hidden;
}
.glass-card {
background: rgba(10, 10, 30, 0.5);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 1.5rem; /* 24px */
transition: all 0.3s ease;
}
.glass-card:hover {
background: rgba(20, 20, 40, 0.6);
box-shadow: 0 0 25px rgba(70, 100, 255, 0.2);
border-color: rgba(70, 100, 255, 0.3);
}
.glow-effect {
position: absolute;
width: 800px;
height: 800px;
border-radius: 50%;
opacity: 0.15;
filter: blur(150px);
z-index: -1;
}
.glow-1 {
background: radial-gradient(circle, rgba(90, 80, 255, 1) 0%, rgba(10, 0, 50, 0) 70%);
top: -20%;
left: -10%;
}
.glow-2 {
background: radial-gradient(circle, rgba(0, 255, 255, 1) 0%, rgba(0, 10, 60, 0) 70%);
bottom: -30%;
right: -20%;
}
.main-title {
font-size: 3.5rem;
font-weight: 700;
background: linear-gradient(90deg, #a7b3ff, #f3d1ff, #a7b3ff);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
text-fill-color: transparent;
background-size: 200% auto;
animation: text-shine 5s linear infinite;
}
@keyframes text-shine {
to {
background-position: 200% center;
}
}
.section-title {
font-size: 1.875rem; /* 30px */
font-weight: 600;
color: #d1d5db; /* gray-300 */
border-bottom: 1px solid rgba(70, 100, 255, 0.3);
padding-bottom: 0.75rem;
}
.timeline .timeline-start, .timeline .timeline-end {
color: #9ca3af; /* gray-400 */
}
.timeline-box {
background: rgba(30, 30, 50, 0.6);
}
.daisy-table {
background: rgba(10, 10, 30, 0.7);
backdrop-filter: blur(10px);
border-radius: 1.5rem;
border-spacing: 0;
border-collapse: separate;
overflow: hidden;
}
.daisy-table th {
background-color: rgba(70, 100, 255, 0.2);
color: #e5e7eb;
font-weight: 600;
}
.daisy-table td, .daisy-table th {
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.daisy-table tr:last-child td {
border-bottom: none;
}
.daisy-table tr:hover {
background-color: rgba(70, 100, 255, 0.1);
}
</style>
</head>
<body class="text-gray-300 min-h-screen">
<div class="glow-effect glow-1"></div>
<div class="glow-effect glow-2"></div>
<div class="container mx-auto px-4 py-12 max-w-7xl">
<!-- Header -->
<header class="text-center mb-16">
<h1 class="main-title mb-4">马斯克Grok-3大模型</h1>
<h2 class="text-xl font-light text-gray-400">深度投研报告</h2>
<p class="mt-4 text-sm text-gray-500">
北京价值前沿科技有限公司 AI投研agent“价小前投研” 进行投研呈现
<br>
本报告为AI合成数据投资需谨慎。
</p>
</header>
<!-- Core Insight -->
<section class="mb-20">
<div class="glass-card p-8 shadow-2xl">
<h3 class="section-title mb-6">核心观点摘要</h3>
<p class="text-lg leading-relaxed text-gray-300">
“马斯克Grok3大模型”概念的本质是一场以“<strong class="text-cyan-300">暴力美学</strong>”式的<strong class="text-cyan-300">算力投入</strong>为核心驱动力旨在通过基础设施的代际领先来挑战现有AI霸主OpenAI的战略突袭。目前该概念正处于<strong class="text-purple-300">从叙事构建向硬件订单兑现过渡的关键阶段</strong>其长期潜力不仅在于模型本身的性能更在于其与马斯克旗下物理世界资产特斯拉、SpaceX结合后可能开创的独特“<strong class="text-purple-300">AI+硬件</strong>”生态闭环。
</p>
</div>
</section>
<!-- Concept Genesis Timeline -->
<section class="mb-20">
<h3 class="section-title mb-10 text-center">概念事件脉络</h3>
<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 text-cyan-400"><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"></path></svg>
</div>
<div class="timeline-start md:text-end mb-10">
<time class="font-mono italic">前期酝酿 (2024年底 - 2025年初)</time>
<div class="text-lg font-black text-gray-200">资本与算力集结</div>
市场已传闻马斯克团队计划推出第三代模型,并建设<strong class="text-cyan-300">10万卡集群</strong>。随后xAI宣布完成<strong class="text-purple-300">60亿美元</strong>C轮融资资金明确用于“加速基础设施建设”为Grok3的算力投入奠定基础。
</div>
<hr class="bg-cyan-400"/>
</li>
<li>
<hr class="bg-cyan-400"/>
<div class="timeline-middle">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="h-5 w-5 text-cyan-400"><path fill-rule="evenodd" d="M9.663 2.251a.75.75 0 01.674 0l7.5 4.125a.75.75 0 010 1.348l-7.5 4.125a.75.75 0 01-.674 0l-7.5-4.125a.75.75 0 010-1.348l7.5-4.125zM10 6.639L13.875 9 10 11.361 6.125 9 10 6.639zM10 12.361L6.125 10.001 2.25 12.125a.75.75 0 000 1.348l7.5 4.125a.75.75 0 00.674 0l7.5-4.125a.75.75 0 000-1.348L13.875 10 10 12.361z" clip-rule="evenodd"></path></svg>
</div>
<div class="timeline-end mb-10">
<time class="font-mono italic">2025年2月18日</time>
<div class="text-lg font-black text-gray-200">正式引爆</div>
马斯克在X平台宣布Grok 3正式发布并进行现场演示誉其为“<strong class="text-cyan-300">地球上最聪明的人工智能</strong>”。核心信息释放:模型训练动用<strong class="text-purple-300">10万至20万张H100 GPU</strong>计算量为Grok 2的10倍。
</div>
<hr class="bg-cyan-400"/>
</li>
<li>
<hr class="bg-cyan-400"/>
<div class="timeline-middle">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="h-5 w-5 text-cyan-400"><path d="M12.232 4.232a2.5 2.5 0 013.536 3.536l-1.225 1.224a.75.75 0 001.061 1.06l1.224-1.224a4 4 0 00-5.656-5.656l-3 3a4 4 0 00.225 5.865.75.75 0 00.977-1.138 2.5 2.5 0 01-.142-3.665l3-3z"></path><path d="M8.603 3.799a4.49 4.49 0 01.322-1.212.75.75 0 00-1.138-.977A6 6 0 003.799 8.603a.75.75 0 00.977 1.138c.41-.35.801-.722 1.138-1.138a4.49 4.49 0 011.212-.322zM10 12.5a2.5 2.5 0 100-5 2.5 2.5 0 000 5z"></path><path d="M7.768 15.768a2.5 2.5 0 01-3.536-3.536l1.225-1.224a.75.75 0 00-1.061-1.06l-1.224 1.224a4 4 0 005.656 5.656l3-3a4 4 0 00-.225-5.865.75.75 0 00-.977 1.138 2.5 2.5 0 01.142 3.665l-3 3z"></path></svg>
</div>
<div class="timeline-start md:text-end mb-10">
<time class="font-mono italic">发布后</time>
<div class="text-lg font-black text-gray-200">市场发酵与深度解读</div>
技术细节如“<strong class="text-cyan-300">思维链</strong>”被披露产业链联动效应显现直接催化A股对变压器、光模块等基础设施供应商的关注。宏大的应用蓝图<strong class="text-purple-300">AI游戏、SpaceX、特斯拉、Optimus</strong>)展开,市场竞争态势升级。
</div>
</li>
</ul>
</section>
<!-- Core Logic & Market Analysis - Bento Grid -->
<section class="mb-20">
<h3 class="section-title mb-10 text-center">核心逻辑与市场认知</h3>
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
<!-- Core Drivers -->
<div class="lg:col-span-2 glass-card p-8 flex flex-col justify-between">
<div>
<h4 class="text-xl font-semibold text-gray-100 mb-4">核心驱动力</h4>
<ul class="space-y-4">
<li class="flex items-start">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 mr-3 text-cyan-400 flex-shrink-0 mt-1" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z" /></svg>
<div><strong class="text-cyan-300">算力即权力:</strong> Grok3的基石是“大力出奇迹”。通过60亿美元融资建设一个10万起步、目标20万卡的H100集群试图用压倒性的算力资源直接挑战对手。</div>
</li>
<li class="flex items-start">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 mr-3 text-purple-400 flex-shrink-0 mt-1" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9V3m-9 9h18" /></svg>
<div><strong class="text-purple-300">物理世界应用牵引:</strong> 终极目标是为特斯拉的自动驾驶(FSD)和Optimus人形机器人提供“大脑”这是区别于纯软件AI公司的最重要差异化优势。</div>
</li>
<li class="flex items-start">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 mr-3 text-cyan-400 flex-shrink-0 mt-1" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" /></svg>
<div><strong class="text-cyan-300">独特数据飞轮:</strong> 直接调用X平台推特的实时数据作为核心训练来源为其提供了捕捉实时动态、理解人类社会脉搏的独特数据养料。</div>
</li>
</ul>
</div>
</div>
<!-- Market Sentiment -->
<div class="glass-card p-8">
<h4 class="text-xl font-semibold text-gray-100 mb-4">市场热度与情绪</h4>
<p>市场对该概念表现出极高的热度和普遍乐观的情绪。媒体用“地球上最聪明”、“中美AI军备竞赛”等字眼渲染其重要性券商研报密集覆盖将其发布视为AI算力产业链的强心剂。整体情绪围绕着“AI军备竞赛”和“马斯克光环”对技术突破和产业链机会抱有强烈期待。</p>
</div>
<!-- Expectation Gaps -->
<div class="lg:col-span-3 glass-card p-8">
<h4 class="text-xl font-semibold text-gray-100 mb-4">预期差分析:宏大叙事 vs. 细节现实</h4>
<div class="grid md:grid-cols-3 gap-6 text-sm">
<div class="bg-slate-800/50 p-4 rounded-xl border border-white/10">
<h5 class="font-bold text-cyan-300 mb-2">模型性能</h5>
<p><strong class="text-gray-400">市场认知:</strong> 全面超越GPT-4o等对手。</p>
<p><strong class="text-gray-400">潜在真相:</strong> 推理速度极快,但逻辑能力或略逊于国内头部产品,代码能力是突出优势。更像有特定强项的“偏科生”。</p>
</div>
<div class="bg-slate-800/50 p-4 rounded-xl border border-white/10">
<h5 class="font-bold text-cyan-300 mb-2">产品状态</h5>
<p><strong class="text-gray-400">市场认知:</strong> 正式发布,功能强大。</p>
<p><strong class="text-gray-400">潜在真相:</strong> 路演反馈存在BUG和功能不完善问题更像一个性能强大的公测版距离成熟商业产品尚有距离。</p>
</div>
<div class="bg-slate-800/50 p-4 rounded-xl border border-white/10">
<h5 class="font-bold text-cyan-300 mb-2">商业模式</h5>
<p><strong class="text-gray-400">市场认知:</strong> 收费40美金/月,定位高端。</p>
<p><strong class="text-gray-400">潜在真相:</strong> 路演揭示了“免费至算力不足时为止”的激进用户获取策略,核心目标是抢占市场份额而非短期盈利。</p>
</div>
</div>
</div>
</div>
</section>
<!-- Performance Chart -->
<section class="mb-20">
<h3 class="section-title mb-10 text-center">性能基准对比 (新闻与研报数据)</h3>
<div class="glass-card p-8">
<div id="performance-chart" style="width: 100%; height: 400px;"></div>
</div>
</section>
<!-- Data Synthesis Tabs -->
<section class="mb-20" x-data="{ tab: 'performance' }">
<h3 class="section-title mb-10 text-center">综合数据摘要</h3>
<div class="tabs tabs-boxed justify-center mb-6 bg-slate-800/50">
<a class="tab" :class="{'tab-active': tab === 'performance'}" @click.prevent="tab = 'performance'">发布与性能</a>
<a class="tab" :class="{'tab-active': tab === 'compute'}" @click.prevent="tab = 'compute'">算力与技术</a>
<a class="tab" :class="{'tab-active': tab === 'ecosystem'}" @click.prevent="tab = 'ecosystem'">应用与生态</a>
<a class="tab" :class="{'tab-active': tab === 'competition'}" @click.prevent="tab = 'competition'">竞争与展望</a>
</div>
<div class="glass-card p-8 min-h-[300px]">
<div x-show="tab === 'performance'" x-transition>
<h4 class="text-lg font-bold text-cyan-300 mb-4">发布与性能</h4>
<ul class="space-y-3 list-disc list-inside">
<li><strong>发布信息:</strong> 马斯克于北京时间2月18日中午12点在X平台宣布发布并进行现场演示。</li>
<li><strong>官方评价:</strong> 马斯克称其为“地球上最聪明的人工智能”,具有“极强推理能力”。</li>
<li><strong>性能对比:</strong> 在数学(AIME)、推理(GPQA)、代码等多领域测试性能领先于Gemini-2 Pro、DeepSeek V3、GPT-4o等。</li>
<li><strong>市场观点:</strong> 存在分歧。有观点认为其是“目前最强基础模型”也有观点认为“没有很强的对比差距”奇安信董事长齐向东称其“性能和DeepSeek持平”。</li>
<li><strong>推理速度:</strong> 路演测评显示其推理速度极快几何题推理仅需45秒快于竞品。</li>
</ul>
</div>
<div x-show="tab === 'compute'" x-transition>
<h4 class="text-lg font-bold text-cyan-300 mb-4">算力与技术</h4>
<ul class="space-y-3 list-disc list-inside">
<li><strong>训练规模:</strong> 动用10万至20万个Nvidia H100 GPU计算量是Grok 2的10倍训练集规模也是Grok 2的十倍。</li>
<li><strong>基础设施:</strong> 为满足能耗和散热,数据中心率先使用了<strong class="text-purple-300">液冷技术</strong>,并面临供电挑战。</li>
<li><strong>核心技术:</strong> 引入<strong class="text-purple-300">“思维链”(Chain of Thought)</strong>推理能力,能够像人类一样逐步处理复杂任务,展示中间推导步骤。</li>
<li><strong>训练创新:</strong> 改进训练流程,引入合成数据集、自我纠错机制及强化学习,模型可反思并删除错误数据。</li>
<li><strong>资金支持:</strong> xAI完成60亿美元C轮融资由A16Z、BlackRock、英伟达等巨头参投用于基础设施建设。</li>
</ul>
</div>
<div x-show="tab === 'ecosystem'" x-transition>
<h4 class="text-lg font-bold text-cyan-300 mb-4">应用与生态</h4>
<ul class="space-y-3 list-disc list-inside">
<li><strong>商业模式:</strong> 存在矛盾信息。新闻报道收费40美元/月,而路演信息则强调初期免费抢占市场。</li>
<li><strong>平台支持:</strong> 微软已将Grok3等AI模型添加到其Azure云计算平台。</li>
<li><strong>核心应用场景:</strong>
<ul class="ml-6 mt-2 space-y-2 list-['-_']">
<li><strong class="text-purple-300">游戏:</strong> 成立AI游戏工作室Grok3的物理编程和3D模拟能力或成关键技术支撑。</li>
<li><strong class="text-purple-300">航天:</strong> 计划用于SpaceX火星任务进行轨道优化未来将Grok 3与Optimus送往火星。</li>
<li><strong class="text-purple-300">汽车与机器人:</strong> 深度整合至特斯拉智能驾驶(FSD)和Optimus人形机器人构建“AI+实体物理世界”闭环。</li>
</ul>
</li>
</ul>
</div>
<div x-show="tab === 'competition'" x-transition>
<h4 class="text-lg font-bold text-cyan-300 mb-4">竞争与展望</h4>
<ul class="space-y-3 list-disc list-inside">
<li><strong>主要对手:</strong> 与OpenAI的竞争白热化。在Grok 3发布之际OpenAI CEO阿尔特曼宣布GPT-4o智力水平提升市场预期OpenAI可能发布GPT-4.5进行“狙击”。</li>
<li><strong>行业背景:</strong> Grok-3的发布被视为“一场中美AI的军备竞赛”。</li>
<li><strong>开源策略:</strong> 当前版本暂未开源。马斯克承诺“在下个版本推出时会开源上个版本”Grok 2预计在几个月到六个月内开源。</li>
<li><strong>未来展望 (Grok 4):</strong> 目前基于<strong class="text-purple-300">百万卡集群</strong>的Grok-4已进入训练阶段训练量预计是Grok 3的10倍功能将有进一步提升。</li>
</ul>
</div>
</div>
</section>
<!-- Risks -->
<section class="mb-20">
<h3 class="section-title mb-10 text-center">潜在风险与挑战</h3>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="alert bg-orange-900/50 border-orange-500/50 text-orange-200">
<svg xmlns="http://www.w3.org/2000/svg" class="stroke-current shrink-0 h-6 w-6" fill="none" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"></path></svg>
<div>
<h3 class="font-bold">技术与商业化风险</h3>
<div class="text-xs">“大力出奇迹”模式的投入产出比可能边际递减。高昂的训练成本与不确定的商业化路径免费vs收费是长期挑战。</div>
</div>
</div>
<div class="alert bg-red-900/50 border-red-500/50 text-red-200">
<svg xmlns="http://www.w3.org/2000/svg" class="stroke-current shrink-0 h-6 w-6" fill="none" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" /></svg>
<div>
<h3 class="font-bold">信息交叉验证风险 (最关键)</h3>
<div class="text-xs">
<strong>核心矛盾:</strong> 关于Grok3的发布状态存在根本性矛盾。新闻和研报称其于2025年2月18日“正式发布”但同期路演纪要却质疑“Grok3是否存在”认为可能是名称混淆或对未来产品的假设。市场可能正在交易一个被超前解读的概念。
</div>
</div>
</div>
</div>
</section>
<!-- Associated Stocks -->
<section class="mb-12">
<h3 class="section-title mb-10 text-center">产业链与核心公司</h3>
<div class="overflow-x-auto">
<table class="table w-full daisy-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=002112" target="_blank" class="link link-hover text-cyan-400">002112</a></td>
<td>公司官微确认“主变走进了马斯克xAI超级计算机中心”。<strong>(唯一官方证实)</strong></td>
<td><div class="badge badge-accent badge-outline">供货预期</div></td>
</tr>
<tr>
<td>博创科技</td>
<td>-</td>
<td>网传公司是xAI的AEC有源铜缆供货商之一未证实</td>
<td><div class="badge badge-warning badge-outline">供货预期</div></td>
</tr>
<tr>
<td>海鸥股份</td>
<td><a href="https://valuefrontier.cn/company?scode=603269" target="_blank" class="link link-hover text-cyan-400">603269</a></td>
<td>网传,将成为国内唯一获北美认证的数据中心冷却塔供公司(未证实)</td>
<td><div class="badge badge-warning badge-outline">供货预期</div></td>
</tr>
<tr>
<td>天孚通信</td>
<td><a href="https://valuefrontier.cn/company?scode=300394" target="_blank" class="link link-hover text-cyan-400">300394</a></td>
<td>Grok3概念相关光器件供应商行业龙头</td>
<td><div class="badge badge-info badge-outline">光器件</div></td>
</tr>
<tr>
<td>光迅科技</td>
<td><a href="https://valuefrontier.cn/company?scode=002281" target="_blank" class="link link-hover text-cyan-400">002281</a></td>
<td>Grok3概念相关光器件供应商</td>
<td><div class="badge badge-info badge-outline">光器件</div></td>
</tr>
<tr>
<td>伊戈尔</td>
<td><a href="https://valuefrontier.cn/company?scode=002922" target="_blank" class="link link-hover text-cyan-400">002922</a></td>
<td>Grok3概念相关变压器供应商</td>
<td><div class="badge badge-primary badge-outline">变压器</div></td>
</tr>
<tr>
<td>沪电股份</td>
<td><a href="https://valuefrontier.cn/company?scode=002463" target="_blank" class="link link-hover text-cyan-400">002463</a></td>
<td>英伟达H100供应链相关 (Grok3用10w张H100进行训练)</td>
<td><div class="badge badge-secondary badge-outline">英伟达</div></td>
</tr>
<tr>
<td>鹏鼎控股</td>
<td><a href="https://valuefrontier.cn/company?scode=002938" target="_blank" class="link link-hover text-cyan-400">002938</a></td>
<td>英伟达H100供应链相关 (Grok3用10w张H100进行训练)</td>
<td><div class="badge badge-secondary badge-outline">英伟达</div></td>
</tr>
</tbody>
</table>
</div>
</section>
<footer class="text-center text-gray-600 text-sm mt-16 pb-8">
<p>&copy; 2024 北京价值前沿科技有限公司. All Rights Reserved.</p>
</footer>
</div>
<script>
document.addEventListener('DOMContentLoaded', function () {
var chartDom = document.getElementById('performance-chart');
var myChart = echarts.init(chartDom, 'dark');
var option;
option = {
backgroundColor: 'transparent',
title: {
text: '主流大模型基准测试得分对比',
subtext: '数据来源综合研报,分数越高越好',
left: 'center',
textStyle: { color: '#e5e7eb' },
subtextStyle: { color: '#9ca3af' }
},
tooltip: {
trigger: 'axis',
axisPointer: { type: 'shadow' }
},
legend: {
data: ['Grok 3', 'GPT-4o', 'Gemini-2 Pro', 'DeepSeek V3'],
top: 'bottom',
textStyle: { color: '#d1d5db' }
},
grid: {
left: '3%',
right: '4%',
bottom: '10%',
containLabel: true
},
xAxis: {
type: 'value',
boundaryGap: [0, 0.01],
axisLine: { lineStyle: { color: 'rgba(255,255,255,0.2)' } }
},
yAxis: {
type: 'category',
data: ['代码能力 (Code)', '科学知识 (GPQA)', '数学能力 (AIME)'],
axisLine: { lineStyle: { color: 'rgba(255,255,255,0.2)' } }
},
series: [
{
name: 'Grok 3',
type: 'bar',
data: [88.5, 78.2, 85.1],
itemStyle: { color: '#00ffff' },
label: { show: true, position: 'right', color: '#fff' }
},
{
name: 'GPT-4o',
type: 'bar',
data: [87.1, 75.2, 83.6],
itemStyle: { color: '#8A2BE2' },
label: { show: true, position: 'right', color: '#fff' }
},
{
name: 'Gemini-2 Pro',
type: 'bar',
data: [84.2, 71.8, 81.9],
itemStyle: { color: '#4169E1' },
label: { show: true, position: 'right', color: '#fff' }
},
{
name: 'DeepSeek V3',
type: 'bar',
data: [86.9, 70.1, 82.5],
itemStyle: { color: '#32CD32' },
label: { show: true, position: 'right', color: '#fff' }
}
]
};
myChart.setOption(option);
window.addEventListener('resize', myChart.resize);
});
</script>
</body>
</html>