Files
vf_react/public/htmls/抖音概念.html
2025-12-05 13:29:18 +08:00

544 lines
34 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>
<!-- Tailwind & DaisyUI -->
<link href="https://cdn.jsdelivr.net/npm/daisyui@4.10.2/dist/full.min.css" rel="stylesheet" type="text/css" />
<script src="https://cdn.tailwindcss.com"></script>
<!-- Alpine.js -->
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
<!-- ECharts -->
<script src="https://cdn.jsdelivr.net/npm/echarts@5.5.0/dist/echarts.min.js"></script>
<!-- Google Fonts -->
<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=Orbitron:wght@400;700&display=swap" rel="stylesheet">
<style>
:root {
--glow-color: hsl(180, 100%, 50%);
}
body {
font-family: 'Inter', sans-serif;
background-color: #02040a;
color: #e0e0e0;
overflow-x: hidden;
}
.font-orbitron {
font-family: 'Orbitron', sans-serif;
}
.glass-card {
background: rgba(16, 18, 27, 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 */
box-shadow: 0 8px 32px 0 rgba(2, 4, 10, 0.37);
}
.glow-text {
color: #fff;
text-shadow: 0 0 5px var(--glow-color), 0 0 10px var(--glow-color), 0 0 15px var(--glow-color);
}
.glow-border {
border-color: var(--glow-color);
box-shadow: 0 0 8px var(--glow-color);
}
.section-title {
font-size: 2.5rem;
font-weight: 700;
}
.subsection-title {
font-size: 1.5rem;
font-weight: 600;
color: #00e5ff;
border-left: 3px solid #00e5ff;
padding-left: 1rem;
margin-bottom: 1rem;
}
.background-container {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
overflow: hidden;
}
.background-glow {
position: absolute;
width: 800px;
height: 800px;
background: radial-gradient(circle, hsla(190, 95%, 50%, 0.15) 0%, rgba(2, 4, 10, 0) 60%);
border-radius: 50%;
animation: move-glow 25s infinite alternate ease-in-out;
}
.glow-1 { top: -20%; left: -20%; }
.glow-2 { bottom: -20%; right: -20%; animation-delay: -12.5s; }
@keyframes move-glow {
from { transform: translate(0, 0) scale(1); }
to { transform: translate(100px, 200px) scale(1.2); }
}
::-webkit-scrollbar {
width: 8px;
}
::-webkit-scrollbar-track {
background: #02040a;
}
::-webkit-scrollbar-thumb {
background: rgba(0, 229, 255, 0.3);
border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
background: rgba(0, 229, 255, 0.5);
}
.tab {
transition: all 0.3s ease;
}
.tab-active {
background-color: rgba(0, 229, 255, 0.1);
color: #00e5ff;
border-bottom: 2px solid #00e5ff;
}
</style>
</head>
<body class="min-h-screen">
<div class="background-container">
<div class="background-glow glow-1"></div>
<div class="background-glow glow-2"></div>
</div>
<main class="container mx-auto p-4 md:p-8 space-y-12">
<!-- Header -->
<header class="text-center py-8">
<h1 class="font-orbitron text-5xl md:text-7xl font-bold glow-text">抖音概念</h1>
<h2 class="text-xl md:text-2xl text-gray-400 mt-4">深度投研报告</h2>
<div class="mt-6 text-sm text-gray-500">
<p>由 北京价值前沿科技有限公司 AI投研agent“价小前投研” 进行投研呈现</p>
<p>本报告为AI合成数据投资需谨慎。</p>
</div>
</header>
<!-- Insight Section -->
<section id="insight" class="space-y-8">
<div class="glass-card p-6 md:p-8">
<h3 class="subsection-title font-orbitron">概念核心逻辑与市场认知分析 (Insight)</h3>
<div class="prose max-w-none prose-invert prose-p:text-gray-300 prose-li:text-gray-300 prose-headings:text-cyan-300">
<h4>1. 核心观点摘要</h4>
<p>“抖音概念”已从早期基于流量变现的广告营销主题,进化为由“<b>全域兴趣电商</b>”和“<b>AI技术赋能</b>”双轮驱动的综合性产业生态概念。当前市场对广告代理和MCN的认知较为充分但对其战略重心向<b>货架电商</b>的转移以及<b>“豆包”AI</b>作为底层技术架构的长期价值存在显著的<b>预期差</b>。该概念正处于从主题炒作向基本面驱动过渡的关键阶段,未来潜力在于其生态深度和广度的持续扩张。</p>
<h4>2. 核心驱动力与市场认知</h4>
<ul>
<li><b>庞大且高粘性的流量基本盘</b>:这是所有商业故事的起点。路演数据显示,抖音拥有<b>6亿+日活用户</b>,日均使用时长<b>120分钟</b>,为多元化变现提供了坚实基础。</li>
<li><b>商业模式的持续进化(全域兴趣电商)</b>:本质上是从“货找人”(内容推荐)向“人找货+货找人”(内容场+货架场)的闭环生态演进。长期目标是<b>商城+搜索的GMV占比超过50%</b>,标志着向成熟电商平台的转型。</li>
<li><b>AI技术的底层赋能</b>:“豆包”大模型的崛起是提升生态效率、构筑技术壁垒的关键。其<b>1.6亿</b>用户基础和对核心<b>搜索业务</b>的技术支持标志着抖音驱动力从“算法推荐”升级为“AI原生”。</li>
</ul>
<h4>3. 预期差分析</h4>
<ol>
<li><b>对电商模式的认知滞后</b>市场普遍聚焦MCN和直播带货但平台正通过扶持<b>品牌自播GMV占比已超60%</b>和发展货架电商来“去中心化”。未来核心受益者可能是具备强供应链和精细化运营能力的<b>品牌方</b><b>电商服务商</b></li>
<li><b>对平台运营挑战的忽视</b>市场聚焦GMV高速增长但忽略了路演数据揭示的<b>高退货率</b>平销期22%-25%大促期高达38%),这直接影响商家利润和平台长期健康度。</li>
<li><b>对概念股“纯度”的甄别不足</b>:市场倾向于短期炒作,但<b>环球印务</b>等公司的澄清公告表明,许多关联公司的业务关联度弱、不确定性高,存在显著的“概念稀释”风险。</li>
</ol>
<h4>4. 产业链图谱与核心公司剖析</h4>
<div class="grid grid-cols-1 md:grid-cols-3 gap-4 my-4">
<div class="p-4 border border-cyan-500/30 rounded-lg bg-cyan-500/5">
<h5 class="font-bold text-cyan-200">上游:技术与基础设施</h5>
<p class="text-sm">字节跳动 (火山引擎/豆包), 蓝色光标 (AI营销), 润泽科技 (算力)</p>
</div>
<div class="p-4 border border-cyan-500/30 rounded-lg bg-cyan-500/5">
<h5 class="font-bold text-cyan-200">中游:生态服务商</h5>
<p class="text-sm">天龙集团 (广告), 遥望科技 (MCN), 值得买 (电商服务), 中文在线 (短剧)</p>
</div>
<div class="p-4 border border-cyan-500/30 rounded-lg bg-cyan-500/5">
<h5 class="font-bold text-cyan-200">下游:品牌与商家</h5>
<p class="text-sm">安正时尚, 良品铺子, 拉芳家化等在抖音平台实现销售增长的品牌</p>
</div>
</div>
<ul>
<li><b>领导者 (生态整合者)</b>: <b>蓝色光标</b>,深度绑定字节技术底座,超越传统代理角色,护城河最深。</li>
<li><b>追赶者/转型者</b>: <b>遥望科技</b>,面临平台“去头部化”战略风险,转型压力大。</li>
<li><b>逻辑最纯粹 (下游品牌)</b>: <b>安正时尚</b>签订三年18亿确定性销售协议从业绩层面强绑定。</li>
</ul>
<h4>5. 关键催化剂与未来路径</h4>
<ul>
<li><b>近期催化剂</b>: 关键大促中<b>商城/搜索GMV占比</b>数据;“豆包”商业化进展;平台对达人佣金的管理政策落地。</li>
<li><b>长期发展路径</b>: 从生态扩张(当前) -> 平台基建与效率提升2-3年货架电商占比>50% -> 产业渗透与生态闭环3-5年</li>
</ul>
<h4>6. 潜在风险与挑战</h4>
<ul>
<li><b>商业化风险</b>: <b>高退货率</b>侵蚀利润;货架电商运营经验不足,面临激烈竞争。</li>
<li><b>政策与竞争风险</b>: 数据安全、反垄断等监管压力;来自阿里、腾讯、美团等巨头的全面竞争。</li>
<li><b>信息交叉验证风险</b>: 市场热炒与公司澄清公告的矛盾,揭示短期炒作和信息不对称风险。</li>
</ul>
<h4>7. 综合结论与投资启示</h4>
<p>“抖音概念”已进入“<b>主题与基本面共振</b>”的新阶段。投资逻辑正从“分享流量”转变为“<b>占据新战略货架电商、AI赋能的核心生态位</b>”。最具投资价值的细分环节包括:<b>AI+营销/应用服务商</b>(如蓝色光标)、<b>具备精细化运营能力的电商服务商和品牌方</b>(如值得买、安正时尚)以及<b>短剧内容制作方</b>(如中文在线)。</p>
</div>
</div>
</section>
<!-- Multi-source Data Section -->
<section id="data-summary" class="space-y-8" x-data="{ tab: 'roadshow' }">
<div class="glass-card p-6 md:p-8">
<div class="flex flex-col md:flex-row justify-between items-start md:items-center mb-6">
<h3 class="subsection-title font-orbitron !border-l-0 !pl-0">多源数据摘要</h3>
<div class="tabs tabs-boxed bg-transparent mt-4 md:mt-0">
<a class="tab tab-lg" :class="{ 'tab-active': tab === 'roadshow' }" @click="tab = 'roadshow'">路演纪要</a>
<a class="tab tab-lg" :class="{ 'tab-active': tab === 'news' }" @click="tab = 'news'">新闻动态</a>
<a class="tab tab-lg" :class="{ 'tab-active': tab === 'research' }" @click="tab = 'research'">研报精粹</a>
</div>
</div>
<!-- Roadshow Data -->
<div x-show="tab === 'roadshow'" x-transition>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
<div class="glass-card !bg-opacity-70 p-4 min-h-[350px]" id="gmv-channel-chart"></div>
<div class="glass-card !bg-opacity-70 p-4 min-h-[350px]" id="gmv-target-chart"></div>
<div class="lg:col-span-2 glass-card !bg-opacity-70 p-6">
<h4 class="font-semibold text-lg text-cyan-300 mb-3">核心战略与数据</h4>
<ul class="space-y-2 text-gray-300 list-disc list-inside">
<li><b>核心战略</b>: 推动品牌向商城迁移,长期目标 (2025年) <b>商城(40%) + 搜索(10%) GMV占比超50%</b></li>
<li><b>价格策略</b>: 从早期低价策略转向扶持“<b>品牌正价商品</b>”,减少对白牌依赖。</li>
<li><b>达人生态</b>: 品牌自播主导 (占比已超60%),平台计划<b>标准化达人佣金费率</b>,降低对头部依赖。</li>
<li><b>GMV目标</b>: 2024年预计3.4万亿2025年目标4万亿 (+17.6%)。</li>
<li><b>退货率</b>: 平台平均<b>22%-25%</b>,双十一期间预计<b>38%</b>,显著高于传统电商平台。</li>
<li><b>新兴机会</b>: <b>短剧电商</b>被视为高潜力领域;<b>3C、母婴、珠宝</b>等高客单价品类增速快。</li>
</ul>
</div>
</div>
</div>
<!-- News Data -->
<div x-show="tab === 'news'" x-transition class="prose max-w-none prose-invert prose-p:text-gray-300 prose-li:text-gray-300">
<h4>一、“抖音概念”与“豆包概念”板块动态</h4>
<ul>
<li><b>板块异动频繁</b>: 新闻多次报道“抖音概念局部异动”,省广集团、环球印务、天龙集团等个股多次领涨,显示市场高度关注。</li>
<li><b>豆包概念崛起</b>: 围绕AI智能助手“豆包”形成细分板块。2024年12月因豆包用户规模突破1.6亿,引发板块大幅拉升,但也因部分公司澄清合作关系而出现剧烈回调。</li>
</ul>
<h4>二、抖音自身业务发展</h4>
<ul>
<li><b>搜索业务</b>: 推出独立App“抖音搜索”并上线由豆包大模型支持的“深度思考模型”强化“人找货”能力。</li>
<li><b>电商业务</b>: GMV高速增长双11商城GMV同比增长91%。推出史上最大力度商家扶持计划,全场景免佣。</li>
<li><b>外卖与即时零售</b>: 申请“抖音外卖”商标,整合即时零售业务,将抖音超市合并至小时达,布局本地生活。</li>
<li><b>AI布局</b>: 豆包APP用户规模高速增长并作为技术底座赋能搜索等核心业务火山引擎FORCE大会聚焦大模型应用。</li>
</ul>
</div>
<!-- Research Report Data -->
<div x-show="tab === 'research'" x-transition class="prose max-w-none prose-invert prose-p:text-gray-300 prose-li:text-gray-300">
<h4>一、抖音平台战略定位</h4>
<ul>
<li><b>全域兴趣电商</b>: 从兴趣电商升级大力投入货架电商建设实现“内容场”与“货架场”协同互通。近一年平台GMV增幅超80%。</li>
<li><b>生活服务平台</b>: 业务覆盖全国370+城市合作门店超100万家目标是成为覆盖全场景、全品类的生活服务首选平台。</li>
</ul>
<h4>二、内容生态与趋势</h4>
<ul>
<li><b>内容创作“自下而上”</b>: 潮流趋势从用户自发内容中生长,如“美拉德穿搭”、“莫奈花园穿搭”等。</li>
<li><b>短剧内容爆发</b>: #短剧 话题播放量超2263亿次成为品牌营销新阵地如洁丽雅、立白</li>
<li><b>文化传播</b>: 成为非遗文化重要传播阵地非遗视频购买量增长328%。深度内容(如超长解读视频)受热捧。</li>
</ul>
<h4>三、品牌营销案例</h4>
<ul>
<li><b>高梵</b>: 通过抖音传递“高端鹅绒服”定位品牌指数提升363%。</li>
<li><b>安正时尚</b>: 与抖音电商签署战略合作目标三年销售18亿元深度绑定平台。</li>
<li><b>荣耀手机</b>: 618超品日GMV达3.5亿+斩获4000元以上价格带销量&GMV双冠军。</li>
</ul>
</div>
</div>
</section>
<!-- Rise Analysis Section -->
<section id="rise-analysis">
<div class="glass-card p-6 md:p-8">
<h3 class="subsection-title font-orbitron">涨幅异动分析 (Case Studies)</h3>
<div class="overflow-x-auto">
<table class="table table-zebra w-full">
<thead class="text-cyan-300">
<tr>
<th>股票名称</th>
<th>代码</th>
<th>涨跌幅</th>
<th>日期</th>
<th class="w-2/3">驱动因素解析</th>
</tr>
</thead>
<tbody>
<tr>
<td>安正时尚</td>
<td><a href="https://valuefrontier.cn/company?scode=603839" target="_blank" class="link link-hover">603839</a></td>
<td><span class="text-error">+9.95%</span></td>
<td>2025-09-02</td>
<td class="whitespace-normal"><b>核心结论:</b> 公告与抖音电商签署三年18亿元战略合作叠加“织造中国”IP流量扶持与2%返佣直接触发资金抢筹。协议落地后线上收入占比有望从18%升至45%以上。</td>
</tr>
<tr>
<td>良品铺子</td>
<td><a href="https://valuefrontier.cn/company?scode=603719" target="_blank" class="link link-hover">603719</a></td>
<td><span class="text-error">+10.03%</span></td>
<td>2025-07-10</td>
<td class="whitespace-normal"><b>核心结论:</b> 大额回购+湖北特色食品补贴+抖音渠道高增共振。券商预计2025年抖音渠道收入同比+120%6月GMV已占线上28%,成为核心增长引擎。</td>
</tr>
<tr>
<td>拉芳家化</td>
<td><a href="https://valuefrontier.cn/company?scode=603630" target="_blank" class="link link-hover">603630</a></td>
<td><span class="text-error">+9.98%</span></td>
<td>2025-06-12</td>
<td class="whitespace-normal"><b>核心结论:</b> 抖音渠道销售放量。2025Q1拉芳抖音GMV同比增1034%主推产品采用抖音自播模式占比超80%,显示新营销模式成功。</td>
</tr>
<tr>
<td>天下秀</td>
<td><a href="https://valuefrontier.cn/company?scode=600556" target="_blank" class="link link-hover">600556</a></td>
<td><span class="text-error">+10.09%</span></td>
<td>2025-10-28</td>
<td class="whitespace-normal"><b>核心结论:</b> 五部委虚拟现实产业规划+抖音开放“数字人直播”一级入口双重催化。抖音官方将天下秀列为首批技术方案商,边际订单可见度骤升。</td>
</tr>
<tr>
<td>供销大集</td>
<td><a href="https://valuefrontier.cn/company?scode=000564" target="_blank" class="link link-hover">000564</a></td>
<td><span class="text-error">+10.15%</span></td>
<td>2025-09-16</td>
<td class="whitespace-normal"><b>核心结论:</b> 统一大市场政策+县域商业数据验证。公司已完成与抖音小时达系统对接1-8月即时零售GMV同比+320%,形成抖音生态实物交割场景。</td>
</tr>
</tbody>
</table>
</div>
</div>
</section>
<!-- Stock List Section -->
<section id="stock-list">
<div class="glass-card p-6 md:p-8">
<h3 class="subsection-title font-orbitron">核心概念股全景</h3>
<div class="overflow-x-auto">
<table class="table w-full">
<thead class="text-cyan-300">
<tr>
<th>股票名称</th>
<th>代码</th>
<th>核心关联业务</th>
<th>标签</th>
</tr>
</thead>
<tbody>
<!-- 广告营销 -->
<tr class="bg-white/5"><td colspan="4" class="font-bold text-gray-300">广告营销服务商</td></tr>
<tr>
<td>蓝色光标</td>
<td><a href="https://valuefrontier.cn/company?scode=300058" target="_blank" class="link link-hover">300058</a></td>
<td class="whitespace-normal">字节系国内最大合作伙伴之一全方位紧密合作。与火山引擎合作开发AI营销工具并深入合作视频生成模型。</td>
<td>广告营销, 火山引擎合作</td>
</tr>
<tr>
<td>天龙集团</td>
<td><a href="https://valuefrontier.cn/company?scode=300063" target="_blank" class="link link-hover">300063</a></td>
<td class="whitespace-normal">巨量引擎的综合代理商、巨量千川三星级服务商。</td>
<td>广告营销</td>
</tr>
<tr>
<td>引力传媒</td>
<td><a href="https://valuefrontier.cn/company?scode=603598" target="_blank" class="link link-hover">603598</a></td>
<td class="whitespace-normal">连续取得抖音巨量引擎品效销全牌照,包括千川三星级服务商、星图优选服务商等。</td>
<td>广告营销</td>
</tr>
<tr>
<td>省广集团</td>
<td><a href="https://valuefrontier.cn/company?scode=002400" target="_blank" class="link link-hover">002400</a></td>
<td class="whitespace-normal">巨量引擎是公司重要的供应商。</td>
<td>广告营销</td>
</tr>
<tr>
<td>浙文互联</td>
<td><a href="https://valuefrontier.cn/company?scode=600986" target="_blank" class="link link-hover">600986</a></td>
<td class="whitespace-normal">获巨量千川二星级服务商、抖音电商银牌品牌服务商资质;与巨量引擎在数字人共建方向有合作。</td>
<td>广告营销</td>
</tr>
<!-- 电商服务 -->
<tr class="bg-white/5"><td colspan="4" class="font-bold text-gray-300">电商生态服务商</td></tr>
<tr>
<td>遥望科技</td>
<td><a href="https://valuefrontier.cn/company?scode=002291" target="_blank" class="link link-hover">002291</a></td>
<td class="whitespace-normal">直播电商头部企业,完成抖音、快手、淘宝三平台全域布局,为抖音千川一级代理商。</td>
<td>电商</td>
</tr>
<tr>
<td>值得买</td>
<td><a href="https://valuefrontier.cn/company?scode=300785" target="_blank" class="link link-hover">300785</a></td>
<td class="whitespace-normal">旗下子公司持有巨量引擎综合代理商、巨量千川服务商、巨量星图代理商等关键资质。</td>
<td>电商</td>
</tr>
<tr>
<td>元隆雅图</td>
<td><a href="https://valuefrontier.cn/company?scode=002878" target="_blank" class="link link-hover">002878</a></td>
<td class="whitespace-normal">子公司谦玛网络拥有巨量引擎平台综合代理商及星图代理商资质。</td>
<td>电商</td>
</tr>
<!-- 内容生态 -->
<tr class="bg-white/5"><td colspan="4" class="font-bold text-gray-300">内容生态合作伙伴</td></tr>
<tr>
<td>中文在线</td>
<td><a href="https://valuefrontier.cn/company?scode=300364" target="_blank" class="link link-hover">300364</a></td>
<td class="whitespace-normal">短剧在抖音等平台广告推流获得用户,与字节旗下红果合作。</td>
<td>内容</td>
</tr>
<tr>
<td>华策影视</td>
<td><a href="https://valuefrontier.cn/company?scode=300133" target="_blank" class="link link-hover">300133</a></td>
<td class="whitespace-normal">与字节旗下红果视频合作开发短剧业务。</td>
<td>内容</td>
</tr>
<tr>
<td>视觉中国</td>
<td><a href="https://valuefrontier.cn/company?scode=000681" target="_blank" class="link link-hover">000681</a></td>
<td class="whitespace-normal">抖音旗下剪映加入了视觉中国的调用模块,用户可通过剪映付费使用。</td>
<td>内容</td>
</tr>
<tr>
<td>掌阅科技</td>
<td><a href="https://valuefrontier.cn/company?scode=603533" target="_blank" class="link link-hover">603533</a></td>
<td class="whitespace-normal">与抖音在版权、内容生产、广告商业化等多方面开展了深度合作。</td>
<td>广告营销</td>
</tr>
<!-- 技术合作 -->
<tr class="bg-white/5"><td colspan="4" class="font-bold text-gray-300">技术与生态合作</td></tr>
<tr>
<td>易点天下</td>
<td><a href="https://valuefrontier.cn/company?scode=301171" target="_blank" class="link link-hover">301171</a></td>
<td class="whitespace-normal">与巨量引擎保持良好合作帮助字节等出海与火山引擎合作打造数据湖仓助力旗下KreadoAI平台。</td>
<td>广告营销, 火山引擎合作</td>
</tr>
<tr>
<td>游族网络</td>
<td><a href="https://valuefrontier.cn/company?scode=002174" target="_blank" class="link link-hover">002174</a></td>
<td class="whitespace-normal">与火山引擎达成战略合作以AI赋能游戏行业。</td>
<td>火山引擎合作</td>
</tr>
<tr>
<td>中广天择</td>
<td></td>
<td class="whitespace-normal">公司是抖音本地生活优质供应商。</td>
<td>本地生活</td>
</tr>
<tr>
<td>东方甄选</td>
<td></td>
<td class="whitespace-normal">2022年在抖音直播间走红是内容电商的标志性案例。</td>
<td>内容</td>
</tr>
</tbody>
</table>
</div>
</div>
</section>
</main>
<script>
document.addEventListener('DOMContentLoaded', function () {
// GMV Channel Distribution Chart
var gmvChannelChart = echarts.init(document.getElementById('gmv-channel-chart'));
var channelOption = {
title: {
text: '抖音电商GMV渠道构成 (2024双十一)',
left: 'center',
textStyle: { color: '#e0e0e0', fontSize: 16 }
},
tooltip: {
trigger: 'item',
formatter: '{a} <br/>{b}: {c}%'
},
legend: {
orient: 'vertical',
left: 'left',
top: 'center',
textStyle: { color: '#b0b0b0' }
},
series: [
{
name: 'GMV占比',
type: 'pie',
radius: ['40%', '70%'],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 10,
borderColor: '#02040a',
borderWidth: 2
},
label: {
show: false,
position: 'center'
},
emphasis: {
label: {
show: true,
fontSize: '20',
fontWeight: 'bold',
color: '#fff'
}
},
labelLine: { show: false },
data: [
{ value: 51, name: '直播电商' },
{ value: 28, name: '抖音商城' },
{ value: 10, name: '搜索电商' },
{ value: 11, name: '短视频电商' }
]
}
],
color: ['#00e5ff', '#ff00ff', '#00ff7f', '#ffff00']
};
gmvChannelChart.setOption(channelOption);
// GMV Target Chart
var gmvTargetChart = echarts.init(document.getElementById('gmv-target-chart'));
var targetOption = {
title: {
text: '抖音电商GMV目标 (万亿)',
left: 'center',
textStyle: { color: '#e0e0e0', fontSize: 16 }
},
tooltip: { trigger: 'axis' },
xAxis: {
type: 'category',
data: ['2023 (实际)', '2024 (预计)', '2025 (目标)'],
axisLine: { lineStyle: { color: '#888' } }
},
yAxis: {
type: 'value',
axisLine: { lineStyle: { color: '#888' } },
splitLine: { lineStyle: { color: '#333' } }
},
series: [{
data: [
{ value: (3.4 / 1.8).toFixed(2), itemStyle: { color: '#ff00ff' } }, // Assuming 80% YoY growth to get 2023 approx.
{ value: 3.4, itemStyle: { color: '#00e5ff' } },
{ value: 4.0, itemStyle: { color: '#00ff7f' } }
],
type: 'bar',
barWidth: '40%',
label: {
show: true,
position: 'top',
color: '#fff',
formatter: '{c} 万亿'
}
}]
};
gmvTargetChart.setOption(targetOption);
window.addEventListener('resize', function() {
gmvChannelChart.resize();
gmvTargetChart.resize();
});
});
</script>
</body>
</html>