The final report agent has been largely completed.
This commit is contained in:
戒酒的李白
File diff suppressed because one or more lines are too long
@@ -0,0 +1,498 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>智能舆情分析报告</title>
|
||||
</head>
|
||||
<body>
|
||||
json
|
||||
{
|
||||
"html_content": "<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>武汉大学智能舆情分析报告</title>
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
<style>
|
||||
:root {
|
||||
--primary-color: #2c3e50;
|
||||
--secondary-color: #3498db;
|
||||
--background-color: #f4f6f9;
|
||||
--card-bg-color: #ffffff;
|
||||
--text-color: #34495e;
|
||||
--heading-color: #2c3e50;
|
||||
--border-color: #e0e0e0;
|
||||
--shadow-color: rgba(0, 0, 0, 0.08);
|
||||
--accent-color: #e74c3c;
|
||||
--success-color: #2ecc71;
|
||||
--warning-color: #f39c12;
|
||||
}
|
||||
|
||||
[data-theme='dark'] {
|
||||
--primary-color: #ecf0f1;
|
||||
--secondary-color: #3498db;
|
||||
--background-color: #1a1a1a;
|
||||
--card-bg-color: #2c2c2c;
|
||||
--text-color: #bdc3c7;
|
||||
--heading-color: #ffffff;
|
||||
--border-color: #444444;
|
||||
--shadow-color: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700&display=swap');
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Noto Sans SC', sans-serif;
|
||||
background-color: var(--background-color);
|
||||
color: var(--text-color);
|
||||
line-height: 1.7;
|
||||
transition: background-color 0.3s, color 0.3s;
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
header {
|
||||
background-color: var(--card-bg-color);
|
||||
padding: 25px 30px;
|
||||
border-radius: 12px;
|
||||
margin-bottom: 25px;
|
||||
box-shadow: 0 4px 15px var(--shadow-color);
|
||||
border: 1px solid var(--border-color);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
header h1 {
|
||||
color: var(--heading-color);
|
||||
font-size: 2.2em;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
header .subtitle {
|
||||
font-size: 1.1em;
|
||||
color: var(--secondary-color);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.header-controls {
|
||||
display: flex;
|
||||
gap: 15px;
|
||||
}
|
||||
|
||||
.control-btn {
|
||||
background: var(--background-color);
|
||||
color: var(--text-color);
|
||||
border: 1px solid var(--border-color);
|
||||
padding: 8px 15px;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
transition: all 0.3s ease;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
.control-btn:hover {
|
||||
background-color: var(--secondary-color);
|
||||
color: #fff;
|
||||
border-color: var(--secondary-color);
|
||||
}
|
||||
|
||||
nav {
|
||||
position: sticky;
|
||||
top: 20px;
|
||||
background-color: var(--card-bg-color);
|
||||
padding: 15px;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 4px 15px var(--shadow-color);
|
||||
z-index: 1000;
|
||||
margin-bottom: 25px;
|
||||
border: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
nav ul {
|
||||
list-style: none;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
nav a {
|
||||
text-decoration: none;
|
||||
color: var(--text-color);
|
||||
padding: 8px 15px;
|
||||
border-radius: 8px;
|
||||
font-weight: 500;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
nav a:hover, nav a.active {
|
||||
background-color: var(--secondary-color);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.report-section {
|
||||
background-color: var(--card-bg-color);
|
||||
margin-bottom: 25px;
|
||||
padding: 25px;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 4px 15px var(--shadow-color);
|
||||
border: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
.report-section h2 {
|
||||
color: var(--heading-color);
|
||||
font-size: 1.8em;
|
||||
border-bottom: 3px solid var(--secondary-color);
|
||||
padding-bottom: 10px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.report-section h3 {
|
||||
color: var(--heading-color);
|
||||
font-size: 1.4em;
|
||||
margin-top: 25px;
|
||||
margin-bottom: 15px;
|
||||
position: relative;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
.report-section h3::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
height: 80%;
|
||||
width: 5px;
|
||||
background-color: var(--secondary-color);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.grid-container {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.kpi-card, .topic-card, .channel-card, .risk-card {
|
||||
background-color: var(--background-color);
|
||||
padding: 20px;
|
||||
border-radius: 10px;
|
||||
border: 1px solid var(--border-color);
|
||||
transition: transform 0.3s, box-shadow 0.3s;
|
||||
}
|
||||
|
||||
.kpi-card:hover, .topic-card:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 6px 20px var(--shadow-color);
|
||||
}
|
||||
|
||||
.kpi-card .value {
|
||||
font-size: 2.2em;
|
||||
font-weight: 700;
|
||||
color: var(--secondary-color);
|
||||
}
|
||||
|
||||
.kpi-card .label {
|
||||
font-size: 1em;
|
||||
color: var(--text-color);
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.topic-card .rank {
|
||||
font-size: 1.5em;
|
||||
font-weight: bold;
|
||||
color: var(--accent-color);
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.topic-card .title {
|
||||
font-size: 1.2em;
|
||||
font-weight: 500;
|
||||
color: var(--heading-color);
|
||||
}
|
||||
|
||||
.topic-card .description {
|
||||
font-size: 0.9em;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.alert-box {
|
||||
padding: 15px;
|
||||
border-radius: 8px;
|
||||
margin-top: 20px;
|
||||
border: 1px solid;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.alert-box.warning {
|
||||
background-color: rgba(243, 156, 18, 0.1);
|
||||
border-color: var(--warning-color);
|
||||
color: var(--warning-color);
|
||||
}
|
||||
|
||||
.chart-container {
|
||||
position: relative;
|
||||
height: 400px;
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.timeline {
|
||||
position: relative;
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
.timeline::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 3px;
|
||||
background-color: var(--border-color);
|
||||
}
|
||||
|
||||
.timeline-item {
|
||||
position: relative;
|
||||
margin-bottom: 20px;
|
||||
padding-left: 50px;
|
||||
}
|
||||
|
||||
.timeline-item::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 12px;
|
||||
top: 5px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border-radius: 50%;
|
||||
background-color: var(--secondary-color);
|
||||
border: 3px solid var(--card-bg-color);
|
||||
}
|
||||
|
||||
.timeline-date {
|
||||
font-weight: bold;
|
||||
color: var(--secondary-color);
|
||||
}
|
||||
|
||||
details {
|
||||
margin-bottom: 15px;
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
summary {
|
||||
padding: 15px;
|
||||
background-color: var(--background-color);
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
font-size: 1.1em;
|
||||
color: var(--heading-color);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
summary::after {
|
||||
content: '＋';
|
||||
font-size: 1.2em;
|
||||
transition: transform 0.3s;
|
||||
}
|
||||
details[open] summary::after {
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
.details-content {
|
||||
padding: 15px;
|
||||
border-top: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
.details-content p {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.details-content strong {
|
||||
color: var(--heading-color);
|
||||
}
|
||||
|
||||
.tag {
|
||||
display: inline-block;
|
||||
padding: 3px 8px;
|
||||
border-radius: 5px;
|
||||
font-size: 0.8em;
|
||||
font-weight: bold;
|
||||
margin-right: 5px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.tag.positive { background-color: rgba(46, 204, 113, 0.2); color: #27ae60; }
|
||||
.tag.negative { background-color: rgba(231, 76, 60, 0.2); color: var(--accent-color); }
|
||||
.tag.neutral { background-color: rgba(52, 152, 219, 0.2); color: var(--secondary-color); }
|
||||
|
||||
footer {
|
||||
text-align: center;
|
||||
padding: 20px;
|
||||
margin-top: 20px;
|
||||
font-size: 0.9em;
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
header {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 15px;
|
||||
}
|
||||
nav ul {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
@media print {
|
||||
body {
|
||||
-webkit-print-color-adjust: exact;
|
||||
print-color-adjust: exact;
|
||||
}
|
||||
header, nav, .control-btn, footer, summary::after {
|
||||
display: none !important;
|
||||
}
|
||||
.container {
|
||||
padding: 0;
|
||||
max-width: 100%;
|
||||
}
|
||||
.report-section {
|
||||
box-shadow: none;
|
||||
border: 1px solid #ccc;
|
||||
margin-bottom: 20px;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
details[open] .details-content {
|
||||
display: block;
|
||||
}
|
||||
details {
|
||||
border: none;
|
||||
}
|
||||
details summary {
|
||||
background: none;
|
||||
font-weight: bold;
|
||||
}
|
||||
.chart-container {
|
||||
height: 300px;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="container">
|
||||
<header>
|
||||
<div>
|
||||
<h1>武汉大学智能舆情分析报告</h1>
|
||||
<p class="subtitle">数据周期：2024-03-01 至 2024-04-30</p>
|
||||
</div>
|
||||
<div class="header-controls">
|
||||
<button id="theme-toggle" class="control-btn">🌙 暗色模式</button>
|
||||
<button onclick="window.print()" class="control-btn">🖨️ 打印/导出PDF</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<nav id="toc">
|
||||
<ul>
|
||||
<li><a href="#section-1">舆情概览</a></li>
|
||||
<li><a href="#section-2">数据趋势</a></li>
|
||||
<li><a href="#section-3">动态时间轴</a></li>
|
||||
<li><a href="#section-4">热点追踪</a></li>
|
||||
<li><a href="#section-5">渠道表现</a></li>
|
||||
<li><a href="#section-6">风险监测</a></li>
|
||||
<li><a href="#section-7">简报与关注</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<main>
|
||||
<section id="section-1" class="report-section">
|
||||
<h2>1.0 本期舆情概览</h2>
|
||||
<h3>1.1 核心数据看板</h3>
|
||||
<div class="grid-container">
|
||||
<div class="kpi-card">
|
||||
<div class="value">~210万</div>
|
||||
<div class="label">相关信息量</div>
|
||||
</div>
|
||||
<div class="kpi-card">
|
||||
<div class="value">3.8亿+</div>
|
||||
<div class="label">总阅读/播放量</div>
|
||||
</div>
|
||||
<div class="kpi-card">
|
||||
<div class="value">~420万</div>
|
||||
<div class="label">总互动量</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="chart-container" style="height: 350px;">
|
||||
<canvas id="sentimentPieChart"></canvas>
|
||||
</div>
|
||||
|
||||
<h3>1.2 本期舆情热度 TOP 3</h3>
|
||||
<div class="grid-container">
|
||||
<div class="topic-card">
|
||||
<div style="display:flex; align-items:center;"><span class="rank">1</span> <span class="title">樱花季的全民热议与管理挑战</span></div>
|
||||
<p class="description">#武大樱花预约# 话题引爆社交媒体，兼具“浪漫滤镜”与“抢票焦虑”，学生与游客的体验冲突成为焦点。</p>
|
||||
</div>
|
||||
<div class="topic-card">
|
||||
<div style="display:flex; align-items:center;"><span class="rank">2</span> <span class="title">学科荣耀与毕业生现实焦虑的碰撞</span></div>
|
||||
<p class="description">“世界第一”的学科声誉与毕业生“工资条沉默”形成鲜明对比，引发对名校光环与现实就业的深度讨论。</p>
|
||||
</div>
|
||||
<div class="topic-card">
|
||||
<div style="display:flex; align-items:center;"><span class="rank">3</span> <span class="title">百年校史的多元解读与身份认同</span></div>
|
||||
<p class="description">关于校史起点的讨论和“学大汉武立国”等网络梗的流行，展现了师生校友对学校历史既严肃又活泼的文化认同。</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3>1.3 重点预警</h3>
|
||||
<div class="alert-box warning">
|
||||
<span style="font-size: 1.5em;">⚠️</span>
|
||||
<div>
|
||||
<strong>潜在风险提示：</strong> 毕业生薪资预期与学科声誉的巨大落差可能持续发酵，影响招生和人才吸引力。同时，校园开放与校内资源、管理压力之间的矛盾在重大活动期间（如樱花季、校庆）易被激化，需提前预案。
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="section-2" class="report-section">
|
||||
<h2>2.0 关键数据趋势</h2>
|
||||
<h3>2.1 声量走势</h3>
|
||||
<p>在本监测周期内，舆情声量呈现多个波峰。第一个主要高峰出现在三月中上旬，与“樱花季”预约通道开放和相关讨论高度相关。第二个高峰出现在四月初，由春季招聘、毕业生薪资讨论及部分学科的“红黑榜”话题带动。整体声量维持在较高水平，显示公众对武汉大学的持续高度关注。</p>
|
||||
<h3>2.2 情感趋势</h3>
|
||||
<div class="chart-container">
|
||||
<canvas id="sentimentTrendChart"></canvas>
|
||||
</div>
|
||||
<p style="margin-top: 15px;">情感趋势图揭示了公众情绪的复杂性。以核心议题“学科声誉”为例，<span class="tag positive">自豪感</span>虽是主流情绪，但呈缓慢下降趋势；而<span class="tag negative">焦虑感</span>（主要关于就业、内卷）则呈明显上升趋势。这表明，在宏大的正面叙事之下，个体层面的压力与关切正在成为不可忽视的舆情力量。</p>
|
||||
</section>
|
||||
|
||||
<section id="section-3" class="report-section">
|
||||
<h2>3.0 本周期舆情动态时间轴</h2>
|
||||
<div class="timeline">
|
||||
<div class="timeline-item">
|
||||
<div class="timeline-date">2024年3月上旬</div>
|
||||
<p><strong>事件
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,522 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>智能舆情分析报告</title>
|
||||
</head>
|
||||
<body>
|
||||
json
|
||||
{
|
||||
"html_content": "<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>智能舆情分析报告 - 武汉大学</title>
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
<style>
|
||||
:root {
|
||||
--primary-color: #2c3e50;
|
||||
--secondary-color: #3498db;
|
||||
--background-color: #f4f7f9;
|
||||
--card-bg-color: #ffffff;
|
||||
--text-color: #333333;
|
||||
--heading-color: #2c3e50;
|
||||
--border-color: #e0e0e0;
|
||||
--shadow-color: rgba(0, 0, 0, 0.08);
|
||||
--success-color: #2ecc71;
|
||||
--warning-color: #f39c12;
|
||||
--danger-color: #e74c3c;
|
||||
--info-color: #3498db;
|
||||
--font-family: 'Helvetica Neue', 'Hiragino Sans GB', 'WenQuanYi Micro Hei', 'Microsoft Yahei', sans-serif;
|
||||
}
|
||||
|
||||
.dark-mode {
|
||||
--primary-color: #3498db;
|
||||
--secondary-color: #2980b9;
|
||||
--background-color: #1a1a1a;
|
||||
--card-bg-color: #2c2c2c;
|
||||
--text-color: #e0e0e0;
|
||||
--heading-color: #ffffff;
|
||||
--border-color: #444444;
|
||||
--shadow-color: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: var(--font-family);
|
||||
background-color: var(--background-color);
|
||||
color: var(--text-color);
|
||||
line-height: 1.6;
|
||||
transition: background-color 0.3s, color 0.3s;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
#sidebar {
|
||||
width: 260px;
|
||||
background-color: var(--card-bg-color);
|
||||
border-right: 1px solid var(--border-color);
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-shadow: 2px 0 5px var(--shadow-color);
|
||||
transition: background-color 0.3s, border-color 0.3s;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
#sidebar h1 {
|
||||
font-size: 1.5em;
|
||||
color: var(--primary-color);
|
||||
margin-bottom: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#sidebar .logo {
|
||||
font-weight: bold;
|
||||
font-size: 1.2em;
|
||||
color: var(--heading-color);
|
||||
padding-bottom: 20px;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
#toc {
|
||||
list-style: none;
|
||||
margin-top: 20px;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
#toc li a {
|
||||
display: block;
|
||||
color: var(--text-color);
|
||||
text-decoration: none;
|
||||
padding: 10px 15px;
|
||||
border-radius: 6px;
|
||||
margin-bottom: 5px;
|
||||
font-weight: 500;
|
||||
transition: background-color 0.2s, color 0.2s;
|
||||
}
|
||||
|
||||
#toc li a:hover, #toc li a.active {
|
||||
background-color: var(--primary-color);
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.sidebar-footer {
|
||||
margin-top: auto;
|
||||
font-size: 0.8em;
|
||||
text-align: center;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
#main-content {
|
||||
margin-left: 260px;
|
||||
width: calc(100% - 260px);
|
||||
padding: 30px;
|
||||
}
|
||||
|
||||
header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 30px;
|
||||
padding-bottom: 20px;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
header h2 {
|
||||
font-size: 2em;
|
||||
color: var(--heading-color);
|
||||
}
|
||||
|
||||
.header-actions button {
|
||||
background: var(--card-bg-color);
|
||||
border: 1px solid var(--border-color);
|
||||
color: var(--text-color);
|
||||
padding: 8px 15px;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
margin-left: 10px;
|
||||
transition: background-color 0.2s, box-shadow 0.2s;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.header-actions button:hover {
|
||||
background-color: var(--background-color);
|
||||
box-shadow: 0 2px 4px var(--shadow-color);
|
||||
}
|
||||
|
||||
.report-section {
|
||||
background-color: var(--card-bg-color);
|
||||
border-radius: 8px;
|
||||
padding: 25px;
|
||||
margin-bottom: 30px;
|
||||
box-shadow: 0 4px 12px var(--shadow-color);
|
||||
transition: background-color 0.3s, box-shadow 0.3s;
|
||||
}
|
||||
|
||||
.report-section h3 {
|
||||
font-size: 1.6em;
|
||||
color: var(--heading-color);
|
||||
margin-bottom: 20px;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 2px solid var(--primary-color);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.report-section h3 svg {
|
||||
margin-right: 10px;
|
||||
fill: var(--primary-color);
|
||||
}
|
||||
|
||||
.grid-container {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.data-card {
|
||||
background: var(--background-color);
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
text-align: center;
|
||||
border: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
.data-card .value {
|
||||
font-size: 2.5em;
|
||||
font-weight: bold;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.data-card .label {
|
||||
font-size: 1em;
|
||||
color: var(--text-color);
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.hot-topic-card {
|
||||
background: var(--background-color);
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
border-left: 5px solid;
|
||||
}
|
||||
|
||||
.hot-topic-card.topic-1 { border-color: var(--success-color); }
|
||||
.hot-topic-card.topic-2 { border-color: var(--warning-color); }
|
||||
.hot-topic-card.topic-3 { border-color: var(--info-color); }
|
||||
|
||||
.hot-topic-card h4 {
|
||||
font-size: 1.2em;
|
||||
color: var(--heading-color);
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.alert-card {
|
||||
background-color: rgba(243, 156, 18, 0.1);
|
||||
border-left: 5px solid var(--warning-color);
|
||||
padding: 15px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.alert-card p {
|
||||
color: var(--warning-color);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.chart-container {
|
||||
position: relative;
|
||||
height: 400px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.timeline {
|
||||
position: relative;
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
.timeline::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 3px;
|
||||
background-color: var(--primary-color);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.timeline-item {
|
||||
position: relative;
|
||||
margin-bottom: 20px;
|
||||
padding-left: 50px;
|
||||
}
|
||||
|
||||
.timeline-item::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 12px;
|
||||
top: 5px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background-color: var(--card-bg-color);
|
||||
border: 3px solid var(--primary-color);
|
||||
border-radius: 50%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.timeline-item-content {
|
||||
background: var(--background-color);
|
||||
padding: 15px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.timeline-item-content .date {
|
||||
font-weight: bold;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
details {
|
||||
margin-bottom: 15px;
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 6px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
summary {
|
||||
padding: 15px;
|
||||
background-color: var(--background-color);
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
summary::after {
|
||||
content: '▼';
|
||||
transform: rotate(0deg);
|
||||
transition: transform 0.2s;
|
||||
}
|
||||
|
||||
details[open] summary::after {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.details-content {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
th, td {
|
||||
padding: 12px;
|
||||
border: 1px solid var(--border-color);
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
th {
|
||||
background-color: var(--background-color);
|
||||
font-weight: bold;
|
||||
color: var(--heading-color);
|
||||
}
|
||||
|
||||
.negative-item {
|
||||
padding: 10px;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.negative-item:last-child { border-bottom: none; }
|
||||
.negative-item .icon { color: var(--danger-color); margin-right: 10px; font-weight: bold; }
|
||||
|
||||
.risk-item {
|
||||
padding: 10px;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.risk-item:last-child { border-bottom: none; }
|
||||
.risk-item .icon { color: var(--warning-color); margin-right: 10px; font-weight: bold; }
|
||||
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
#sidebar {
|
||||
left: -260px;
|
||||
transition: left 0.3s;
|
||||
z-index: 1000;
|
||||
}
|
||||
body.sidebar-open #sidebar {
|
||||
left: 0;
|
||||
}
|
||||
#main-content {
|
||||
margin-left: 0;
|
||||
width: 100%;
|
||||
padding: 15px;
|
||||
}
|
||||
header h2 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
.header-actions button {
|
||||
padding: 6px 10px;
|
||||
}
|
||||
.menu-toggle {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media print {
|
||||
body { display: block; }
|
||||
#sidebar, .header-actions {
|
||||
display: none;
|
||||
}
|
||||
#main-content {
|
||||
margin-left: 0;
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
}
|
||||
.report-section {
|
||||
box-shadow: none;
|
||||
border: 1px solid #ccc;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-toggle {
|
||||
display: none;
|
||||
background: none;
|
||||
border: none;
|
||||
font-size: 24px;
|
||||
cursor: pointer;
|
||||
color: var(--heading-color);
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<aside id="sidebar">
|
||||
<div class="logo">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" style="vertical-align: middle; margin-right: 8px;"><path d="M12 2L1 9l4 1.5V21h14v-10.5L23 9l-11-7zm-2 16h-2v-6h2v6zm4 0h-2v-6h2v6zm4 0h-2v-6h2v6zm-8-8H4.5L12 5.5 19.5 9H16v8H8v-8z"/></svg>
|
||||
珞珈舆情洞察
|
||||
</div>
|
||||
<nav>
|
||||
<ul id="toc">
|
||||
<li><a href="#s1">舆情概览</a></li>
|
||||
<li><a href="#s2">关键数据趋势</a></li>
|
||||
<li><a href="#s3">舆情动态时间轴</a></li>
|
||||
<li><a href="#s4">热点话题追踪</a></li>
|
||||
<li><a href="#s5">重点渠道表现</a></li>
|
||||
<li><a href="#s6">负面与风险监测</a></li>
|
||||
<li><a href="#s7">简报与关注点</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="sidebar-footer">
|
||||
<p>© 2024 智能报告生成</p>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<main id="main-content">
|
||||
<header>
|
||||
<button class="menu-toggle" onclick="toggleSidebar()">☰</button>
|
||||
<div>
|
||||
<h2>武汉大学 智能舆情分析报告</h2>
|
||||
<p style="color: #777;">数据周期：2024-03-01 至 2024-04-30</p>
|
||||
</div>
|
||||
<div class="header-actions">
|
||||
<button id="theme-toggle">切换主题</button>
|
||||
<button onclick="window.print()">打印/导出PDF</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section id="s1" class="report-section">
|
||||
<h3>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M3 13h8V3H3v10zm0 8h8v-6H3v6zm10 0h8V11h-8v10zm0-18v6h8V3h-8z"/></svg>
|
||||
1.0 本期舆情概览
|
||||
</h3>
|
||||
<h4>1.1 核心数据看板</h4>
|
||||
<div class="grid-container" style="margin-top: 20px;">
|
||||
<div class="data-card">
|
||||
<div class="value">3.8亿+</div>
|
||||
<div class="label">总阅读量</div>
|
||||
</div>
|
||||
<div class="data-card">
|
||||
<div class="value">210万+</div>
|
||||
<div class="label">有效讨论</div>
|
||||
</div>
|
||||
<div class="data-card">
|
||||
<div class="value">420万+</div>
|
||||
<div class="label">总互动量</div>
|
||||
</div>
|
||||
<div class="data-card">
|
||||
<div class="value" style="color: var(--success-color);">51%</div>
|
||||
<div class="label">主要情感：骄傲与自豪</div>
|
||||
</div>
|
||||
</div>
|
||||
<h4 style="margin-top: 30px;">1.2 本期舆情热度 TOP 3</h4>
|
||||
<div class="grid-container" style="margin-top: 20px;">
|
||||
<div class="hot-topic-card topic-1">
|
||||
<h4>TOP 1: 樱花季的浪漫与焦虑</h4>
|
||||
<p>#武大樱花预约# 话题阅读量超3.8亿，引发全民关注。舆论呈现两极化：游客与校友分享樱花美景的“浪漫”与“怀旧”；本地市民与未预约成功的网友则表达“抢票难”、“拥挤”的“焦虑”与“吐槽”。</p>
|
||||
</div>
|
||||
<div class="hot-topic-card topic-2">
|
||||
<h4>TOP 2: 学科实力与就业现实</h4>
|
||||
<p>“测绘遥感世界第一”等学术成就引发自豪感，但同时，“硕士春招薪资7.2k”、“法学生实习困境”等话题引发对就业前景的广泛讨论与焦虑，形成“理想与现实”的鲜明对比。</p>
|
||||
</div>
|
||||
<div class="hot-topic-card topic-3">
|
||||
<h4>TOP 3: 百年校史的传承与新说</h4>
|
||||
<p>“1893 vs 1913”的校史起点讨论在贴吧等社区持续发酵，而抖音上“学大汉武立国”的倒读梗则以年轻化、娱乐化的方式传播了校史文化，展现了历史在当代的多元解读。</p>
|
||||
</div>
|
||||
</div>
|
||||
<h4 style="margin-top: 30px;">1.3 重点预警</h4>
|
||||
<div class="alert-card" style="margin-top: 20px;">
|
||||
<p><strong>就业焦虑情绪上升：</strong> 多个王牌学科（如测绘、法学）的毕业生薪资与公众对其“顶尖”地位的期望存在落差，相关讨论中“焦虑”、“内卷”、“工资条”等词频上升，可能影响未来招生吸引力及在校生心态。</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="s2" class="report-section">
|
||||
<h3>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M16 6l2.29 2.29-4.88 4.88-4-4L2 16.59 3.41 18l6-6 4 4 6.3-6.29L22 12V6z"/></svg>
|
||||
2.0 关键数据趋势
|
||||
</h3>
|
||||
<div class="grid-container">
|
||||
<div style="grid-column: 1 / -1;">
|
||||
<h4>2.1 声量走势 (模拟)</h4>
|
||||
<div class="chart-container">
|
||||
<canvas id="volumeTrendChart"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4>2.2 整体情感分布</h4>
|
||||
<div class="chart-container" style="height: 350px;">
|
||||
<canvas id="sentimentPieChart"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4>2.3 数据来源平台分布</h4>
|
||||
<div class="chart-container" style="height: 350px;">
|
||||
<canvas id="platformBarChart"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="s3" class="report-section">
|
||||
<h3>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,478 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>智能舆情分析报告</title>
|
||||
</head>
|
||||
<body>
|
||||
json
|
||||
{
|
||||
"html_content": "<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>智能舆情分析报告 - 武汉大学</title>
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
<style>
|
||||
:root {
|
||||
--bg-color: #f4f7fa;
|
||||
--text-color: #333;
|
||||
--card-bg: #ffffff;
|
||||
--border-color: #eef2f7;
|
||||
--primary-color: #2c3e50;
|
||||
--accent-color-1: #3498db;
|
||||
--accent-color-2: #e74c3c;
|
||||
--accent-color-3: #f1c40f;
|
||||
--accent-color-4: #2ecc71;
|
||||
--sidebar-bg: #2c3e50;
|
||||
--sidebar-text: #ecf0f1;
|
||||
--sidebar-hover: #34495e;
|
||||
--shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
|
||||
--font-family: 'Helvetica Neue', 'Hiragino Sans GB', 'WenQuanYi Micro Hei', 'Microsoft Yahei', sans-serif;
|
||||
}
|
||||
|
||||
.dark-mode {
|
||||
--bg-color: #1a1a2e;
|
||||
--text-color: #e0e0e0;
|
||||
--card-bg: #16213e;
|
||||
--border-color: #0f3460;
|
||||
--primary-color: #e94560;
|
||||
--sidebar-bg: #0f3460;
|
||||
--sidebar-text: #e0e0e0;
|
||||
--sidebar-hover: #16213e;
|
||||
--shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: var(--font-family);
|
||||
background-color: var(--bg-color);
|
||||
color: var(--text-color);
|
||||
line-height: 1.6;
|
||||
transition: background-color 0.3s, color 0.3s;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
#sidebar {
|
||||
width: 260px;
|
||||
background-color: var(--sidebar-bg);
|
||||
color: var(--sidebar-text);
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
transition: transform 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
#sidebar .logo {
|
||||
font-size: 1.5em;
|
||||
font-weight: bold;
|
||||
margin-bottom: 30px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#sidebar nav ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
#sidebar nav ul li a {
|
||||
color: var(--sidebar-text);
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
padding: 12px 15px;
|
||||
border-radius: 6px;
|
||||
margin-bottom: 5px;
|
||||
transition: background-color 0.2s;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
#sidebar nav ul li a:hover, #sidebar nav ul li a.active {
|
||||
background-color: var(--sidebar-hover);
|
||||
}
|
||||
|
||||
#main-content {
|
||||
margin-left: 260px;
|
||||
width: calc(100% - 260px);
|
||||
padding: 30px;
|
||||
}
|
||||
|
||||
header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
header h1 {
|
||||
color: var(--primary-color);
|
||||
font-size: 2.2em;
|
||||
}
|
||||
|
||||
.header-actions button {
|
||||
background: var(--card-bg);
|
||||
border: 1px solid var(--border-color);
|
||||
color: var(--text-color);
|
||||
padding: 8px 15px;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
margin-left: 10px;
|
||||
transition: all 0.2s;
|
||||
font-size: 14px;
|
||||
}
|
||||
.header-actions button:hover {
|
||||
background: var(--accent-color-1);
|
||||
color: #fff;
|
||||
border-color: var(--accent-color-1);
|
||||
}
|
||||
|
||||
.card {
|
||||
background-color: var(--card-bg);
|
||||
border-radius: 12px;
|
||||
padding: 25px;
|
||||
margin-bottom: 25px;
|
||||
box-shadow: var(--shadow);
|
||||
border: 1px solid var(--border-color);
|
||||
transition: background-color 0.3s, border-color 0.3s;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.8em;
|
||||
color: var(--primary-color);
|
||||
border-bottom: 3px solid var(--accent-color-1);
|
||||
padding-bottom: 10px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.4em;
|
||||
color: var(--text-color);
|
||||
margin-top: 20px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.kpi-container {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.kpi-item {
|
||||
background-color: var(--bg-color);
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
text-align: center;
|
||||
border-left: 5px solid;
|
||||
}
|
||||
.kpi-item .value {
|
||||
font-size: 2.5em;
|
||||
font-weight: bold;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
.kpi-item .label {
|
||||
font-size: 1em;
|
||||
color: var(--text-color);
|
||||
opacity: 0.8;
|
||||
}
|
||||
.kpi-item.volume { border-color: var(--accent-color-1); }
|
||||
.kpi-item.reads { border-color: var(--accent-color-4); }
|
||||
.kpi-item.interactions { border-color: var(--accent-color-3); }
|
||||
|
||||
.chart-container {
|
||||
position: relative;
|
||||
height: 400px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.dual-chart-container {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 2fr;
|
||||
gap: 25px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.timeline {
|
||||
list-style-type: none;
|
||||
position: relative;
|
||||
padding-left: 30px;
|
||||
}
|
||||
.timeline:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 5px;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 2px;
|
||||
background: var(--border-color);
|
||||
}
|
||||
.timeline li {
|
||||
margin-bottom: 20px;
|
||||
position: relative;
|
||||
}
|
||||
.timeline li:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: -30px;
|
||||
top: 5px;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border-radius: 50%;
|
||||
background: var(--accent-color-1);
|
||||
border: 2px solid var(--bg-color);
|
||||
}
|
||||
.timeline .date {
|
||||
font-weight: bold;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
details {
|
||||
background: var(--bg-color);
|
||||
border-radius: 8px;
|
||||
margin-bottom: 10px;
|
||||
border: 1px solid var(--border-color);
|
||||
}
|
||||
summary {
|
||||
padding: 15px;
|
||||
font-weight: bold;
|
||||
font-size: 1.1em;
|
||||
cursor: pointer;
|
||||
list-style: none;
|
||||
}
|
||||
summary::-webkit-details-marker { display: none; }
|
||||
summary:before {
|
||||
content: '▶';
|
||||
margin-right: 10px;
|
||||
}
|
||||
details[open] summary:before {
|
||||
content: '▼';
|
||||
}
|
||||
.details-content {
|
||||
padding: 0 20px 20px 20px;
|
||||
}
|
||||
.details-content p {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.details-content .highlight {
|
||||
font-weight: bold;
|
||||
color: var(--accent-color-1);
|
||||
}
|
||||
.details-content .anxiety {
|
||||
color: var(--accent-color-2);
|
||||
}
|
||||
|
||||
.risk-list li {
|
||||
padding: 10px;
|
||||
border-bottom: 1px dashed var(--border-color);
|
||||
}
|
||||
.risk-list li:last-child { border-bottom: none; }
|
||||
.risk-list .negative {
|
||||
color: var(--accent-color-2);
|
||||
font-weight: bold;
|
||||
}
|
||||
.risk-list .potential {
|
||||
color: var(--accent-color-3);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin-top: 15px;
|
||||
}
|
||||
th, td {
|
||||
padding: 12px;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
th {
|
||||
background-color: var(--bg-color);
|
||||
}
|
||||
|
||||
.hamburger {
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 15px;
|
||||
left: 15px;
|
||||
z-index: 1001;
|
||||
background: var(--sidebar-bg);
|
||||
border: none;
|
||||
color: white;
|
||||
padding: 10px;
|
||||
border-radius: 50%;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
#sidebar {
|
||||
transform: translateX(-260px);
|
||||
z-index: 1000;
|
||||
}
|
||||
#sidebar.open {
|
||||
transform: translateX(0);
|
||||
}
|
||||
#main-content {
|
||||
margin-left: 0;
|
||||
width: 100%;
|
||||
}
|
||||
.hamburger {
|
||||
display: block;
|
||||
}
|
||||
.dual-chart-container {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
header {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
}
|
||||
header h1 { font-size: 1.8em; margin-left: 60px; }
|
||||
.header-actions { margin-top: 10px; margin-left: 60px; }
|
||||
}
|
||||
|
||||
@media print {
|
||||
body { display: block; }
|
||||
#sidebar, .header-actions, .hamburger { display: none; }
|
||||
#main-content { margin-left: 0; width: 100%; padding: 0; }
|
||||
.card { box-shadow: none; border: 1px solid #ccc; page-break-inside: avoid; }
|
||||
h1, h2 { color: #000 !important; }
|
||||
:root {
|
||||
--bg-color: #fff;
|
||||
--text-color: #000;
|
||||
--card-bg: #fff;
|
||||
--border-color: #ddd;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="sidebar">
|
||||
<div class="logo">舆情分析报告</div>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="#overview" class="active">1.0 舆情概览</a></li>
|
||||
<li><a href="#trends">2.0 关键数据趋势</a></li>
|
||||
<li><a href="#timeline">3.0 舆情动态时间轴</a></li>
|
||||
<li><a href="#topics">4.0 热点话题追踪</a></li>
|
||||
<li><a href="#channels">5.0 重点渠道表现</a></li>
|
||||
<li><a href="#risks">6.0 负面与风险监测</a></li>
|
||||
<li><a href="#summary">7.0 简报与关注点</a></li>
|
||||
<li><a href="#appendix">8.0 数据附录</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
<button id="hamburger" class="hamburger">☰</button>
|
||||
|
||||
<div id="main-content">
|
||||
<header>
|
||||
<div>
|
||||
<h1>智能舆情分析报告：武汉大学</h1>
|
||||
<p>数据周期：2024-03-01 至 2024-04-30</p>
|
||||
</div>
|
||||
<div class="header-actions">
|
||||
<button id="toggle-dark-mode">切换模式</button>
|
||||
<button onclick="window.print()">打印/导出PDF</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section id="overview" class="card">
|
||||
<h2>1.0 本期舆情概览</h2>
|
||||
<h3>1.1 核心数据看板</h3>
|
||||
<div class="kpi-container">
|
||||
<div class="kpi-item volume">
|
||||
<div class="value">210万+</div>
|
||||
<div class="label">相关讨论量</div>
|
||||
</div>
|
||||
<div class="kpi-item reads">
|
||||
<div class="value">3.8亿+</div>
|
||||
<div class="label">总阅读量</div>
|
||||
</div>
|
||||
<div class="kpi-item interactions">
|
||||
<div class="value">420万+</div>
|
||||
<div class="label">总互动量</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3>1.2 本期核心情感分布</h3>
|
||||
<div class="dual-chart-container">
|
||||
<div class="chart-container" style="height: 300px;">
|
||||
<canvas id="sentimentPieChart"></canvas>
|
||||
</div>
|
||||
<div>
|
||||
<p>本周期内，关于武汉大学的舆情呈现出鲜明的“骄傲”、“焦虑”与“烟火气”三重情感交织的面孔。</p>
|
||||
<ul>
|
||||
<li><strong style="color: var(--accent-color-4);">骄傲 (约42%)</strong>: 主要源于对学校百年历史、世界一流学科（如测绘遥感）和硬核科研成果的自豪感。</li>
|
||||
<li><strong style="color: var(--accent-color-2);">焦虑 (约20%)</strong>: 集中体现在对樱花季管理、优势专业就业薪资、科研内卷及资源分配等现实问题的担忧。</li>
|
||||
<li><strong style="color: var(--accent-color-3);">烟火气/怀旧 (约38%)</strong>: 体现在校友的温馨回忆、对校园美景的浪漫想象以及对校史趣闻的津津乐道。</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3>1.3 本期舆情热度 TOP 3</h3>
|
||||
<ol>
|
||||
<li><strong>武大樱花预约 (微博话题阅读量 3.8亿)</strong>: 兼具浪漫期待与“抢票难”的吐槽，成为全民关注的社会事件。</li>
|
||||
<li><strong>“世界第一”学科的现实讨论 (知乎热帖 4.5万赞)</strong>: 围绕测绘遥感等顶尖学科的学术光环与毕业生实际薪资的巨大反差展开，引发深度共鸣与焦虑。</li>
|
||||
<li><strong>校史新解与玩梗 (抖音话题 1.2万视频)</strong>: “学大汉武立国”等校史梗在年轻群体中病毒式传播，展现了历史文化的现代活力。</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<section id="trends" class="card">
|
||||
<h2>2.0 关键数据趋势</h2>
|
||||
<h3>2.1 声量走势</h3>
|
||||
<div class="chart-container">
|
||||
<canvas id="volumeTrendChart"></canvas>
|
||||
</div>
|
||||
<p>分析：声量在三月中下旬至四月初达到顶峰，与“樱花季”高度重合，显示该事件是本周期内最核心的舆情引爆点。其余时间声量平稳，主要由学术发布、校友新闻等常规内容驱动。</p>
|
||||
|
||||
<h3>2.2 核心情感趋势 (以“测绘遥感”话题为例)</h3>
|
||||
<div class="chart-container">
|
||||
<canvas id="sentimentTrendChart"></canvas>
|
||||
</div>
|
||||
<p>分析：在关于“测绘遥感”学科的讨论中，“自豪感”虽是基础情绪，但随着就业、薪资等现实问题的深入，讨论后期“焦虑”情绪占比明显上升，反映出公众及学生群体从“仰望星空”到“脚踏实地”的心态转变。</p>
|
||||
</section>
|
||||
|
||||
<section id="timeline" class="card">
|
||||
<h2>3.0 本周期舆情动态时间轴</h2>
|
||||
<ul class="timeline">
|
||||
<li>
|
||||
<div class="date">三月上旬</div>
|
||||
<p>#武大樱花预约# 话题开始预热，社交媒体出现大量往年美图和预约攻略，期待情绪高涨。</p>
|
||||
</li>
|
||||
<li>
|
||||
<div class="date">三月中下旬</div>
|
||||
<p>樱花季正式开启，声量达到顶峰。“抢票难”、“人挤人”等负面吐槽与“最美校园”的赞美形成强烈对比。</p>
|
||||
</li>
|
||||
<li>
|
||||
<div class="date">四月上旬</div>
|
||||
<p>知乎出现高赞问题：“如何看待武大测绘遥感世界第一，但毕业生薪资并不突出？”，引发“学术光环”与“现实就业”的大范围讨论，焦虑情绪蔓延。</p>
|
||||
</li>
|
||||
<li>
|
||||
<div class="date">四月中旬</div>
|
||||
<p>B站、抖音等平台出现“院士把卫星数据当糖果发”、“00后通宵做实验”等内容，展现科研硬实力，正面“敬意”情绪小幅回升。</p>
|
||||
</li>
|
||||
<li>
|
||||
<div class="date">四月下旬</div>
|
||||
<p>京都大学学生在珞珈讲坛朗诵《将进酒》视频走红，引发对中外文化交流的正面讨论，#武大国际范#成为热词。</p>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section id="topics" class="card">
|
||||
<h2>4.0 热点话题追踪</h2>
|
||||
<details>
|
||||
<summary>话题一：百年校史与樱花季 —— 共享的文化符号</summary>
|
||||
<div class="details-content">
|
||||
<p><span class="highlight">高光叙事：</span>“国立武汉大学”老牌坊、“樱花大道”、“老斋舍”等历史符号在社交媒体上被反复提及，构建了集体自豪感。抖音上“倒读校名”等创意玩法，使厚重历史变得轻松有趣。</p>
|
||||
<p><span class="anxiety">争议痛点：</span>樱花季的过度商业化和管理挑战引发校内
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,492 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>智能舆情分析报告</title>
|
||||
</head>
|
||||
<body>
|
||||
json
|
||||
{
|
||||
"html_content": "<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>智能舆情分析报告 - 武汉大学</title>
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
<style>
|
||||
:root {
|
||||
--primary-color: #1E3A8A; /* 深蓝 */
|
||||
--secondary-color: #3B82F6; /* 亮蓝 */
|
||||
--accent-color: #F59E0B; /* 琥珀黄 */
|
||||
--bg-color: #F3F4F6; /* 浅灰背景 */
|
||||
--card-bg-color: #FFFFFF;
|
||||
--text-color: #1F2937; /* 深灰文字 */
|
||||
--text-light-color: #6B7280; /* 浅灰文字 */
|
||||
--border-color: #E5E7EB;
|
||||
--shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
|
||||
--font-family: 'Noto Sans SC', sans-serif, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
|
||||
}
|
||||
|
||||
body.dark-mode {
|
||||
--primary-color: #3B82F6;
|
||||
--secondary-color: #60A5FA;
|
||||
--accent-color: #FBBF24;
|
||||
--bg-color: #111827; /* 深黑背景 */
|
||||
--card-bg-color: #1F2937; /* 深灰卡片 */
|
||||
--text-color: #F9FAFB; /* 亮灰文字 */
|
||||
--text-light-color: #9CA3AF;
|
||||
--border-color: #374151;
|
||||
}
|
||||
|
||||
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700&display=swap');
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: var(--font-family);
|
||||
background-color: var(--bg-color);
|
||||
color: var(--text-color);
|
||||
line-height: 1.6;
|
||||
transition: background-color 0.3s, color 0.3s;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
max-width: 1600px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
width: 260px;
|
||||
background-color: var(--card-bg-color);
|
||||
padding: 2rem 1rem;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
height: 100vh;
|
||||
overflow-y: auto;
|
||||
transition: background-color 0.3s;
|
||||
border-right: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
.sidebar-header {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 700;
|
||||
color: var(--primary-color);
|
||||
margin-bottom: 2rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.sidebar-nav ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.sidebar-nav li a {
|
||||
display: block;
|
||||
padding: 0.75rem 1rem;
|
||||
color: var(--text-light-color);
|
||||
text-decoration: none;
|
||||
border-radius: 8px;
|
||||
transition: background-color 0.2s, color 0.2s;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.sidebar-nav li a:hover, .sidebar-nav li a.active {
|
||||
background-color: var(--primary-color);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
main {
|
||||
flex: 1;
|
||||
padding: 2rem;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
header.report-header {
|
||||
margin-bottom: 2rem;
|
||||
border-bottom: 2px solid var(--primary-color);
|
||||
padding-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.header-top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.header-controls button {
|
||||
background: var(--secondary-color);
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 0.6rem 1.2rem;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
margin-left: 0.5rem;
|
||||
font-weight: 500;
|
||||
transition: background-color 0.2s;
|
||||
}
|
||||
|
||||
.header-controls button:hover {
|
||||
background: var(--primary-color);
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2.5rem;
|
||||
font-weight: 700;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
h1 span {
|
||||
font-size: 1.5rem;
|
||||
color: var(--text-light-color);
|
||||
font-weight: 400;
|
||||
display: block;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
.report-meta {
|
||||
color: var(--text-light-color);
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
section {
|
||||
margin-bottom: 3rem;
|
||||
background: var(--card-bg-color);
|
||||
padding: 2rem;
|
||||
border-radius: 12px;
|
||||
box-shadow: var(--shadow);
|
||||
transition: background-color 0.3s;
|
||||
}
|
||||
|
||||
.section-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
margin-bottom: 1.5rem;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.8rem;
|
||||
font-weight: 700;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.toggle-icon {
|
||||
font-size: 1.5rem;
|
||||
transition: transform 0.3s;
|
||||
}
|
||||
|
||||
.section-content.collapsed {
|
||||
display: none;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.4rem;
|
||||
font-weight: 500;
|
||||
margin-top: 1.5rem;
|
||||
margin-bottom: 1rem;
|
||||
color: var(--secondary-color);
|
||||
}
|
||||
|
||||
.grid {
|
||||
display: grid;
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.grid-cols-3 {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
}
|
||||
|
||||
.grid-cols-2 {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
|
||||
.card {
|
||||
background: var(--bg-color);
|
||||
padding: 1.5rem;
|
||||
border-radius: 8px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.card .value {
|
||||
font-size: 2.5rem;
|
||||
font-weight: 700;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.card .label {
|
||||
font-size: 1rem;
|
||||
color: var(--text-light-color);
|
||||
}
|
||||
|
||||
.chart-container {
|
||||
position: relative;
|
||||
height: 400px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.timeline {
|
||||
list-style: none;
|
||||
position: relative;
|
||||
padding-left: 2rem;
|
||||
}
|
||||
|
||||
.timeline:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 2px;
|
||||
background: var(--secondary-color);
|
||||
}
|
||||
|
||||
.timeline-item {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.timeline-item:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: -8px;
|
||||
top: 5px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border-radius: 50%;
|
||||
background: white;
|
||||
border: 3px solid var(--secondary-color);
|
||||
}
|
||||
|
||||
.timeline-date {
|
||||
font-weight: 700;
|
||||
color: var(--accent-color);
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
th, td {
|
||||
padding: 0.8rem 1rem;
|
||||
border: 1px solid var(--border-color);
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
th {
|
||||
background-color: var(--bg-color);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
.container {
|
||||
flex-direction: column;
|
||||
}
|
||||
.sidebar {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
position: static;
|
||||
border-right: none;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
main { padding: 1rem; }
|
||||
h1 { font-size: 2rem; }
|
||||
.grid-cols-3, .grid-cols-2 {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
@media print {
|
||||
.sidebar, .header-controls {
|
||||
display: none;
|
||||
}
|
||||
main { padding: 0; }
|
||||
body { background-color: #fff; color: #000; }
|
||||
section { box-shadow: none; border: 1px solid #ddd; padding: 1.5rem; }
|
||||
h1, h2 { color: #000; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="container">
|
||||
<aside class="sidebar">
|
||||
<div class="sidebar-header">导航目录</div>
|
||||
<nav class="sidebar-nav">
|
||||
<ul>
|
||||
<li><a href="#overview" class="active">1.0 舆情概览</a></li>
|
||||
<li><a href="#trends">2.0 关键数据趋势</a></li>
|
||||
<li><a href="#timeline">3.0 舆情动态时间轴</a></li>
|
||||
<li><a href="#hot-topics">4.0 热点话题追踪</a></li>
|
||||
<li><a href="#channels">5.0 重点渠道表现</a></li>
|
||||
<li><a href="#risks">6.0 负面与风险监测</a></li>
|
||||
<li><a href="#summary">7.0 简报与关注点</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</aside>
|
||||
|
||||
<main>
|
||||
<header class="report-header">
|
||||
<div class="header-top">
|
||||
<h1>智能舆情分析报告
|
||||
<span>武汉大学 · 百年名校的骄傲、焦虑与烟火气</span>
|
||||
</h1>
|
||||
<div class="header-controls">
|
||||
<button id="theme-toggle">切换主题</button>
|
||||
<button onclick="window.print()">打印/PDF</button>
|
||||
</div>
|
||||
</div>
|
||||
<p class="report-meta">报告周期: 2024-03-01 至 2024-04-30 | 数据来源: 微博、抖音、B站、知乎等12个信源</p>
|
||||
</header>
|
||||
|
||||
<section id="overview">
|
||||
<div class="section-header">
|
||||
<h2>1.0 本周/月舆情概览</h2>
|
||||
<span class="toggle-icon">▾</span>
|
||||
</div>
|
||||
<div class="section-content">
|
||||
<h3>1.1 核心数据看板</h3>
|
||||
<div class="grid grid-cols-3">
|
||||
<div class="card">
|
||||
<div class="value">3.8亿+</div>
|
||||
<div class="label">总阅读量</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="value">210万+</div>
|
||||
<div class="label">有效讨论文本</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="value">420万+</div>
|
||||
<div class="label">总互动量</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3>1.2 本期舆情热度 TOP 3</h3>
|
||||
<ol>
|
||||
<li><strong>樱花季盛况与争议：</strong>微博话题#武大樱花预约#阅读量高达3.8亿，引发全民关注。内容兼具“浪漫滤镜”与“抢票焦虑”，是本周期绝对的流量核心。</li>
|
||||
<li><strong>学科实力与就业焦虑：</strong>以“测绘遥感世界第一”为代表的学术自豪感，与毕业生关于“薪资买不起房”的现实焦虑形成强烈对比，在知乎、B站等平台引发深度讨论。</li>
|
||||
<li><strong>百年校史的现代解读：</strong>围绕建校时间（1893 vs 1913）的讨论在贴吧等社区持续发酵，并衍生出“学大汉武立国”等网络热梗，体现了历史在青年群体中的新生命力。</li>
|
||||
</ol>
|
||||
|
||||
<h3>1.3 重点预警</h3>
|
||||
<p><strong>资源落差感加剧：</strong>“院士发卫星数据当糖果”与“普通学生排队三周用PCR仪”的对比，凸显了顶尖资源与普通学生体验之间的鸿沟，可能成为内部矛盾的潜在燃点。</p>
|
||||
<p><strong>就业性价比焦虑：</strong>法学、口腔医学等王牌专业的学生对实习、规培待遇的吐槽增多，舆论开始关注“名校光环”在现实就业市场中的“性价比”问题。</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="trends">
|
||||
<div class="section-header">
|
||||
<h2>2.0 关键数据趋势</h2>
|
||||
<span class="toggle-icon">▾</span>
|
||||
</div>
|
||||
<div class="section-content">
|
||||
<div class="grid grid-cols-2">
|
||||
<div>
|
||||
<h3>2.1 整体情感分布</h3>
|
||||
<div class="chart-container">
|
||||
<canvas id="sentimentPieChart"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h3>2.2 核心情感趋势</h3>
|
||||
<div class="chart-container">
|
||||
<canvas id="sentimentTrendChart"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="timeline">
|
||||
<div class="section-header">
|
||||
<h2>3.0 本周期舆情动态时间轴</h2>
|
||||
<span class="toggle-icon">▾</span>
|
||||
</div>
|
||||
<div class="section-content">
|
||||
<ul class="timeline">
|
||||
<li class="timeline-item">
|
||||
<div class="timeline-date">3月初</div>
|
||||
<p><strong>#武大樱花预约# 话题启动：</strong>官方发布预约赏樱通知，社交媒体热度开始攀升，引发第一波关于“抢票难”的讨论。</p>
|
||||
</li>
|
||||
<li class="timeline-item">
|
||||
<div class="timeline-date">3月中旬</div>
|
||||
<p><strong>樱花盛开期：</strong>小红书、抖音涌现大量“童话滤镜”赏樱内容，正面情绪达到顶峰。同时，#武汉人挤不进武大# 等负面话题出现，反映管理压力。</p>
|
||||
</li>
|
||||
<li class="timeline-item">
|
||||
<div class="timeline-date">4月初</div>
|
||||
<p><strong>春招季讨论：</strong>知乎出现高赞问答，讨论“武大测绘遥感世界第一，为何毕业生工资不高”，引发对“天坑专业”和就业现实的广泛共鸣。</p>
|
||||
</li>
|
||||
<li class="timeline-item">
|
||||
<div class="timeline-date">4月中旬</div>
|
||||
<p><strong>国际交流活动：</strong>诺贝尔奖得主谢克曼返校演讲、京都大学学生朗诵《将进酒》等事件在B站获得高播放量，激发文化自豪感和学术向往。</p>
|
||||
</li>
|
||||
<li class="timeline-item">
|
||||
<div class="timeline-date">4月底</div>
|
||||
<p><strong>校史讨论发酵：</strong>贴吧及微博的“校史起点”讨论被营销号整合传播，衍生出“学大汉武立国”等网络梗，将严肃讨论娱乐化。</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="hot-topics">
|
||||
<div class="section-header">
|
||||
<h2>4.0 热点话题追踪</h2>
|
||||
<span class="toggle-icon">▾</span>
|
||||
</div>
|
||||
<div class="section-content">
|
||||
<h3>4.1 学科光环与现实焦虑的碰撞</h3>
|
||||
<p>公众对武大学术实力的认知呈现两极化叙事。一方面，以“测绘遥感世界第一”、“法学全国前三”、“病毒学国家重点实验室”为代表的“高光叙事”在知乎、B站等平台持续获得高赞，构筑了强大的学术自豪感。但另一方面，来自学生和年轻校友的“焦虑痛点”也日益凸显，形成强烈反差。</p>
|
||||
<table>
|
||||
<thead>
|
||||
<tr><th>学科</th><th>高光叙事</th><th>焦虑痛点</th><th>情感走向</th></tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr><td>测绘遥感</td><td>知乎“世界第一”获4.5万赞</td><td>硕士春招中位数7.2k，“买不起武汉一平米”</td><td>自豪感被现实焦虑稀释</td></tr>
|
||||
<tr><td>法学</td><td>省考“双第一”报喜刷屏</td><td>红圈所实习5k不包宿，“温柔铠甲裂了”</td><td>精英向往与考公热并存</td></tr>
|
||||
<tr><td>口腔医学</td><td>B站科普视频获300万播放</td><td>规培时薪低于奶茶店，“累到筷子都拿不稳”</td><td>社会信赖与从业者疲惫</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p class="conclusion"><strong>洞察：</strong>学科光芒并未熄灭，而是被年轻人的房租、薪资、工作强度等现实问题折射得更立体，公众对“名校”的评价标准正从单一的学术排名向“投入产出比”延伸。</p>
|
||||
|
||||
<h3>4.2 校园文化：樱花的浪漫与“围城”的拉锯</h3>
|
||||
<p>樱花季是武大最具代表性的文化符号，但也成为内外部感知差异最大的场景。对外，它是“童话滤镜”下的浪漫圣地；对内，则夹杂着“抢票难”、“游客拥挤”的困扰。</p>
|
||||
<ul>
|
||||
<li><strong>浪漫叙事：</strong>小红书涌现超10万篇赏樱笔记，抖音“武大樱花”相关视频播放量破亿，构建了强大的正面形象。</li>
|
||||
<li><strong>现实裂缝：</strong>微博#武汉人挤不进武大#话题引发3.8万条讨论，学生群体抱怨正常学习生活受影响，本地市民则感到被“拒之门外”。</li>
|
||||
</ul>
|
||||
<p class="conclusion"><strong>洞察：</strong>樱花节已从校园文化活动演变为城市级公共事件。如何在开放共享与保障校内秩序之间取得平衡，是学校持续面临的治理挑战。</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="channels">
|
||||
<div class="section-header">
|
||||
<h2>5.0 重点渠道表现</h2>
|
||||
<span class="toggle-icon">▾</span>
|
||||
</div>
|
||||
<div class="section-content">
|
||||
<div class="grid grid-cols-2">
|
||||
<div>
|
||||
<h3>5.1 核心社交媒体表现</h3>
|
||||
<div class="chart-container">
|
||||
<canvas id="sourceDistributionChart"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h3>5.2 核心内容平台表现</h3>
|
||||
<ul>
|
||||
<li><strong>微博：</strong>主要舆论场和事件引爆点。#武大樱花预约#等热搜话题主导了声量，但讨论相对碎片化。</li>
|
||||
<li><strong>知乎 & B站：</strong>深度讨论和专业内容核心区。关于学科实力、就业前景、科研生活的长文和视频引发了更持久和深刻的共鸣。</li>
|
||||
<li><strong>小红书 & 抖音：</strong>视觉化和生活化内容主阵地。以“高颜值滤镜”展示校园风光、学习vlog等内容，塑造了青春
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,429 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>智能舆情分析报告</title>
|
||||
</head>
|
||||
<body>
|
||||
json
|
||||
{
|
||||
"html_content": "<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>智能舆情分析报告 - 武汉大学</title>
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
<style>
|
||||
:root {
|
||||
--bg-color: #f4f7f9;
|
||||
--text-color: #333;
|
||||
--card-bg: #ffffff;
|
||||
--border-color: #e0e0e0;
|
||||
--primary-color: #2c3e50;
|
||||
--accent-color: #3498db;
|
||||
--accent-color-light: #a9cce3;
|
||||
--positive-color: #27ae60;
|
||||
--negative-color: #c0392b;
|
||||
--neutral-color: #f39c12;
|
||||
--shadow: 0 4px 8px rgba(0,0,0,0.05);
|
||||
--font-family: 'Helvetica Neue', 'Hiragino Sans GB', 'WenQuanYi Micro Hei', 'Microsoft Yahei', sans-serif;
|
||||
}
|
||||
|
||||
.dark-mode {
|
||||
--bg-color: #1a1a1a;
|
||||
--text-color: #e0e0e0;
|
||||
--card-bg: #2c2c2c;
|
||||
--border-color: #444;
|
||||
--primary-color: #ffffff;
|
||||
--accent-color: #5dade2;
|
||||
--accent-color-light: #2c3e50;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: var(--font-family);
|
||||
background-color: var(--bg-color);
|
||||
color: var(--text-color);
|
||||
line-height: 1.6;
|
||||
transition: background-color 0.3s, color 0.3s;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
max-width: 1600px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
width: 240px;
|
||||
background-color: var(--card-bg);
|
||||
border-right: 1px solid var(--border-color);
|
||||
position: sticky;
|
||||
top: 0;
|
||||
height: 100vh;
|
||||
padding: 20px 0;
|
||||
transition: background-color 0.3s, border-color 0.3s;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.sidebar-header {
|
||||
padding: 0 20px 20px 20px;
|
||||
font-size: 1.2em;
|
||||
font-weight: 600;
|
||||
color: var(--primary-color);
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
.sidebar-nav ul {
|
||||
list-style: none;
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
.sidebar-nav li a {
|
||||
display: block;
|
||||
padding: 12px 20px;
|
||||
color: var(--text-color);
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
border-left: 3px solid transparent;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.sidebar-nav li a:hover, .sidebar-nav li a.active {
|
||||
background-color: var(--accent-color-light);
|
||||
color: var(--accent-color);
|
||||
border-left-color: var(--accent-color);
|
||||
}
|
||||
|
||||
.main-content {
|
||||
flex: 1;
|
||||
padding: 20px 30px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
padding-bottom: 20px;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
header h1 {
|
||||
font-size: 2em;
|
||||
color: var(--primary-color);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.header-meta {
|
||||
font-size: 0.9em;
|
||||
color: #777;
|
||||
}
|
||||
.dark-mode .header-meta { color: #aaa; }
|
||||
|
||||
.actions button {
|
||||
background: none;
|
||||
border: 1px solid var(--border-color);
|
||||
color: var(--text-color);
|
||||
padding: 8px 12px;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
margin-left: 10px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.actions button:hover {
|
||||
background-color: var(--accent-color);
|
||||
color: white;
|
||||
border-color: var(--accent-color);
|
||||
}
|
||||
|
||||
.report-section {
|
||||
margin-bottom: 40px;
|
||||
background: var(--card-bg);
|
||||
border-radius: 8px;
|
||||
padding: 25px;
|
||||
box-shadow: var(--shadow);
|
||||
transition: background-color 0.3s;
|
||||
}
|
||||
|
||||
.report-section h2 {
|
||||
font-size: 1.5em;
|
||||
color: var(--primary-color);
|
||||
margin-bottom: 20px;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 2px solid var(--accent-color);
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.kpi-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.kpi-card {
|
||||
background: var(--bg-color);
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
text-align: center;
|
||||
border-left: 5px solid;
|
||||
}
|
||||
|
||||
.kpi-card.positive { border-color: var(--positive-color); }
|
||||
.kpi-card.negative { border-color: var(--negative-color); }
|
||||
.kpi-card.neutral { border-color: var(--neutral-color); }
|
||||
|
||||
.kpi-value {
|
||||
font-size: 2em;
|
||||
font-weight: 700;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.kpi-label {
|
||||
font-size: 0.9em;
|
||||
color: #666;
|
||||
margin-top: 5px;
|
||||
}
|
||||
.dark-mode .kpi-label { color: #bbb; }
|
||||
|
||||
.chart-container {
|
||||
display: grid;
|
||||
grid-template-columns: 2fr 1fr;
|
||||
gap: 20px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.chart-container .full-width {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
.timeline {
|
||||
position: relative;
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
.timeline::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 4px;
|
||||
background: var(--accent-color-light);
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.timeline-item {
|
||||
position: relative;
|
||||
margin-bottom: 30px;
|
||||
padding-left: 50px;
|
||||
}
|
||||
|
||||
.timeline-item::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 11px;
|
||||
top: 5px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background: white;
|
||||
border: 4px solid var(--accent-color);
|
||||
border-radius: 50%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.timeline-item h4 {
|
||||
font-weight: 600;
|
||||
color: var(--accent-color);
|
||||
}
|
||||
|
||||
.topic-details {
|
||||
margin-bottom: 20px;
|
||||
border-left: 4px solid var(--border-color);
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
.topic-details summary {
|
||||
font-size: 1.1em;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.topic-details p {
|
||||
margin-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.channel-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.channel-card {
|
||||
background: var(--bg-color);
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.channel-card h4 {
|
||||
color: var(--accent-color);
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.risk-list li {
|
||||
margin-bottom: 15px;
|
||||
padding-left: 20px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.risk-list li::before {
|
||||
content: '⚠️';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.appendix-details summary {
|
||||
font-size: 1.2em;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.appendix-content h4 {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 10px;
|
||||
color: var(--accent-color);
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.container { flex-direction: column; }
|
||||
.sidebar { position: static; width: 100%; height: auto; border-right: none; border-bottom: 1px solid var(--border-color); }
|
||||
.main-content { padding: 20px; }
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
header { flex-direction: column; align-items: flex-start; gap: 10px; }
|
||||
.chart-container { grid-template-columns: 1fr; }
|
||||
.kpi-grid { grid-template-columns: 1fr; }
|
||||
}
|
||||
|
||||
@media print {
|
||||
body { --shadow: none; }
|
||||
.sidebar, .actions, header h1 .header-meta { display: none; }
|
||||
.main-content { padding: 0; }
|
||||
.report-section { page-break-inside: avoid; margin-bottom: 20px; box-shadow: none; border: 1px solid #ccc; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<aside class="sidebar">
|
||||
<div class="sidebar-header">报告导航</div>
|
||||
<nav class="sidebar-nav">
|
||||
<ul>
|
||||
<li><a href="#overview" class="active">舆情概览</a></li>
|
||||
<li><a href="#trends">关键数据趋势</a></li>
|
||||
<li><a href="#timeline">舆情动态时间轴</a></li>
|
||||
<li><a href="#hot-topics">热点话题追踪</a></li>
|
||||
<li><a href="#channels">重点渠道表现</a></li>
|
||||
<li><a href="#risks">负面与风险监测</a></li>
|
||||
<li><a href="#summary">简报与关注点</a></li>
|
||||
<li><a href="#appendix">附录：综合背景资料</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</aside>
|
||||
|
||||
<main class="main-content">
|
||||
<header>
|
||||
<div>
|
||||
<h1>智能舆情分析报告：武汉大学</h1>
|
||||
<p class="header-meta">数据周期：2024-03-01 至 2024-04-30</p>
|
||||
</div>
|
||||
<div class="actions">
|
||||
<button id="print-btn">打印/导出PDF</button>
|
||||
<button id="dark-mode-toggle">切换主题</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section id="overview" class="report-section">
|
||||
<h2>1.0 本周期舆情概览</h2>
|
||||
<div class="kpi-grid">
|
||||
<div class="kpi-card neutral">
|
||||
<div class="kpi-value">~210万</div>
|
||||
<div class="kpi-label">全网有效声量</div>
|
||||
</div>
|
||||
<div class="kpi-card positive">
|
||||
<div class="kpi-value">~3.8亿</div>
|
||||
<div class="kpi-label">总阅读/播放量</div>
|
||||
</div>
|
||||
<div class="kpi-card negative">
|
||||
<div class="kpi-value">24%</div>
|
||||
<div class="kpi-label">核心焦虑情绪占比</div>
|
||||
</div>
|
||||
</div>
|
||||
<h3 style="margin-top: 30px; margin-bottom: 15px;">本期舆情热度 TOP 3</h3>
|
||||
<ol style="padding-left: 20px;">
|
||||
<li><strong>樱花季预约与体验：</strong>微博话题#武大樱花预约#阅读量超3.8亿，引发全民关注，讨论焦点从赏花浪漫延伸至抢票难度和游客管理。</li>
|
||||
<li><strong>学科实力与就业焦虑：</strong>以测绘遥感“世界第一”为代表的学科自豪感，与毕业生对薪资、就业压力的现实讨论形成鲜明对比，在知乎等平台引发深度共鸣。</li>
|
||||
<li><strong>校史渊源与文化认同：</strong>关于建校起点的讨论（1893 vs 1913）在校友和学生群体中持续发酵，展现了强烈的身份认同和历史归属感。</li>
|
||||
</ol>
|
||||
<h3 style="margin-top: 30px; margin-bottom: 15px;">重点预警</h3>
|
||||
<p style="background: var(--negative-color); color: white; padding: 15px; border-radius: 6px;">
|
||||
<strong>就业焦虑情绪扩散：</strong>关于顶尖学科毕业生薪资待遇不及预期的讨论，已从个别专业扩散至多个优势学科。该情绪若持续发酵，可能对未来的招生质量和人才吸引力构成长期潜在风险。
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section id="trends" class="report-section">
|
||||
<h2>2.0 关键数据趋势</h2>
|
||||
<div class="chart-container">
|
||||
<div class="full-width">
|
||||
<h3>2.1 声量走势 (模拟)</h3>
|
||||
<canvas id="volumeChart"></canvas>
|
||||
</div>
|
||||
<div>
|
||||
<h3>2.2 情感趋势分布</h3>
|
||||
<canvas id="sentimentChart"></canvas>
|
||||
</div>
|
||||
<div>
|
||||
<h3>2.3 重点渠道分布</h3>
|
||||
<canvas id="sourceChart"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="timeline" class="report-section">
|
||||
<h2>3.0 本周期舆情动态时间轴</h2>
|
||||
<div class="timeline">
|
||||
<div class="timeline-item">
|
||||
<h4>三月上旬：校史渊源讨论升温</h4>
|
||||
<p>关于武大建校“1893自强学堂”与“1913国立武昌高师”的讨论在贴吧、知乎等校友社区升温，抖音出现“学大汉武立国”倒读梗，历史认同成为热点。</p>
|
||||
</div>
|
||||
<div class="timeline-item">
|
||||
<h4>三月中旬：樱花季引爆全网</h4>
|
||||
<p>#武大樱花预约#话题登上微博热搜，预约难度堪比“春运抢票”，全网流量达到本周期顶峰。小红书、抖音涌现大量赏樱攻略和美图。</p>
|
||||
</div>
|
||||
<div class="timeline-item">
|
||||
<h4>三月下旬：游客与学生体验两极分化</h4>
|
||||
<p>随着游客增多，#武汉人挤不进武大#等话题出现，校内学生对正常学习生活受影响的抱怨增多，舆论呈现“校外的浪漫”与“校内的烦恼”两种声音。</p>
|
||||
</div>
|
||||
<div class="timeline-item">
|
||||
<h4>四月：春招季就业焦虑凸显</h4>
|
||||
<p>知乎出现“如何看待武大测绘遥感世界第一，但硕士春招中位数仅7.2k”等热门提问，法学、口腔医学等专业的就业压力和规培待遇问题成为讨论焦点。</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="hot-topics" class="report-section">
|
||||
<h2>4.0 热点话题追踪</h2>\
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,440 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>智能舆情分析报告</title>
|
||||
</head>
|
||||
<body>
|
||||
json
|
||||
{
|
||||
"html_content": "<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>智能舆情分析报告 - 武汉大学</title>
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
<style>
|
||||
:root {
|
||||
--bg-color: #f4f7fa;
|
||||
--text-color: #333;
|
||||
--card-bg: #ffffff;
|
||||
--border-color: #eef2f7;
|
||||
--primary-color: #2c7be5;
|
||||
--secondary-color: #6c757d;
|
||||
--accent-color: #00b894;
|
||||
--danger-color: #d63031;
|
||||
--warning-color: #f5a623;
|
||||
--shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
|
||||
--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
||||
}
|
||||
|
||||
.dark-mode {
|
||||
--bg-color: #1a1a2e;
|
||||
--text-color: #e0e0e0;
|
||||
--card-bg: #162447;
|
||||
--border-color: #1f4068;
|
||||
--primary-color: #4a90e2;
|
||||
--secondary-color: #a9b4c2;
|
||||
--shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: var(--font-family);
|
||||
background-color: var(--bg-color);
|
||||
color: var(--text-color);
|
||||
margin: 0;
|
||||
line-height: 1.6;
|
||||
transition: background-color 0.3s, color 0.3s;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
width: 260px;
|
||||
background-color: var(--card-bg);
|
||||
border-right: 1px solid var(--border-color);
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100vh;
|
||||
padding: 20px;
|
||||
box-sizing: border-box;
|
||||
transition: all 0.3s;
|
||||
overflow-y: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.sidebar h2 {
|
||||
color: var(--primary-color);
|
||||
font-size: 1.5em;
|
||||
margin-bottom: 20px;
|
||||
text-align: center;
|
||||
border-bottom: 2px solid var(--primary-color);
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.sidebar nav ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.sidebar nav li a {
|
||||
display: block;
|
||||
color: var(--secondary-color);
|
||||
text-decoration: none;
|
||||
padding: 12px 15px;
|
||||
border-radius: 6px;
|
||||
margin-bottom: 5px;
|
||||
transition: background-color 0.3s, color 0.3s;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.sidebar nav li a:hover, .sidebar nav li a.active {
|
||||
background-color: var(--primary-color);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.sidebar-footer {
|
||||
margin-top: auto;
|
||||
padding-top: 20px;
|
||||
border-top: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
.main-content {
|
||||
margin-left: 260px;
|
||||
width: calc(100% - 260px);
|
||||
padding: 30px;
|
||||
box-sizing: border-box;
|
||||
transition: margin-left 0.3s;
|
||||
}
|
||||
|
||||
.report-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 30px;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.report-header h1 {
|
||||
font-size: 2.2em;
|
||||
margin: 0;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.header-actions button {
|
||||
background-color: var(--secondary-color);
|
||||
color: #fff;
|
||||
border: none;
|
||||
padding: 10px 15px;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
margin-left: 10px;
|
||||
transition: background-color 0.3s;
|
||||
font-size: 14px;
|
||||
}
|
||||
.header-actions button:hover {
|
||||
opacity: 0.9;
|
||||
}
|
||||
#theme-toggle {
|
||||
background-color: var(--primary-color);
|
||||
}
|
||||
|
||||
.card {
|
||||
background-color: var(--card-bg);
|
||||
border-radius: 8px;
|
||||
box-shadow: var(--shadow);
|
||||
padding: 25px;
|
||||
margin-bottom: 30px;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 1.8em;
|
||||
color: var(--text-color);
|
||||
margin-top: 0;
|
||||
margin-bottom: 20px;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 2px solid var(--primary-color);
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.dashboard {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.stat-item {
|
||||
background: linear-gradient(135deg, var(--primary-color) 0%, #6a11cb 100%);
|
||||
color: #fff;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
text-align: center;
|
||||
}
|
||||
.stat-item .value {
|
||||
font-size: 2.5em;
|
||||
font-weight: bold;
|
||||
margin: 0;
|
||||
}
|
||||
.stat-item .label {
|
||||
font-size: 1em;
|
||||
margin: 0;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.chart-container {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||
gap: 30px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.timeline {
|
||||
position: relative;
|
||||
padding: 20px 0;
|
||||
}
|
||||
.timeline::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 3px;
|
||||
background-color: var(--primary-color);
|
||||
border-radius: 2px;
|
||||
}
|
||||
.timeline-item {
|
||||
position: relative;
|
||||
margin-bottom: 20px;
|
||||
padding-left: 50px;
|
||||
}
|
||||
.timeline-item::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 11px;
|
||||
top: 5px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50%;
|
||||
background-color: var(--card-bg);
|
||||
border: 4px solid var(--primary-color);
|
||||
z-index: 1;
|
||||
}
|
||||
.timeline-item h4 {
|
||||
margin: 0 0 5px 0;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.topic-card {
|
||||
border-left: 5px solid var(--accent-color);
|
||||
padding-left: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.risk-card {
|
||||
border-left: 5px solid var(--danger-color);
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.accordion .accordion-header {
|
||||
cursor: pointer;
|
||||
padding: 15px;
|
||||
background-color: var(--bg-color);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 5px;
|
||||
margin-top: 10px;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.accordion .accordion-header::after {
|
||||
content: '+';
|
||||
font-size: 1.5em;
|
||||
transition: transform 0.3s;
|
||||
}
|
||||
.accordion .accordion-content {
|
||||
max-height: 0;
|
||||
overflow: hidden;
|
||||
transition: max-height 0.3s ease-out;
|
||||
padding: 0 15px;
|
||||
border: 1px solid var(--border-color);
|
||||
border-top: none;
|
||||
}
|
||||
.accordion.active .accordion-header::after {
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
.accordion.active .accordion-content {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
.sidebar {
|
||||
left: -260px;
|
||||
}
|
||||
.main-content {
|
||||
margin-left: 0;
|
||||
width: 100%;
|
||||
padding: 15px;
|
||||
}
|
||||
.menu-toggle {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.report-header {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.header-actions {
|
||||
margin-top: 15px;
|
||||
}
|
||||
.dashboard, .chart-container {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
@media print {
|
||||
body { display: block; }
|
||||
.sidebar, .header-actions, .menu-toggle { display: none; }
|
||||
.main-content { margin-left: 0; width: 100%; padding: 0; }
|
||||
.card { box-shadow: none; border: 1px solid #ccc; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="sidebar">
|
||||
<h2>导航目录</h2>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="#overview" class="active">1.0 舆情概览</a></li>
|
||||
<li><a href="#trends">2.0 关键数据趋势</a></li>
|
||||
<li><a href="#timeline">3.0 舆情动态时间轴</a></li>
|
||||
<li><a href="#hot-topics">4.0 热点话题追踪</a></li>
|
||||
<li><a href="#channels">5.0 重点渠道表现</a></li>
|
||||
<li><a href="#risks">6.0 负面与风险监测</a></li>
|
||||
<li><a href="#summary">7.0 简报与关注点</a></li>
|
||||
<li><a href="#appendix">8.0 数据附录</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="sidebar-footer">
|
||||
<p style="font-size: 0.8em; color: var(--secondary-color); text-align: center;">报告生成于 <br> <span id="report-date"></span></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<main class="main-content">
|
||||
<header class="report-header">
|
||||
<h1>智能舆情分析报告：武汉大学</h1>
|
||||
<div class="header-actions">
|
||||
<button id="theme-toggle">切换模式</button>
|
||||
<button id="print-btn">打印/导出PDF</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section id="overview" class="card">
|
||||
<h2 class="section-title">1.0 本期舆情概览</h2>
|
||||
<p>本报告周期内（2024年3月1日至4月30日），关于武汉大学的社会舆论呈现出“骄傲、焦虑与烟火气”并存的复杂图景。公众既为学校的百年校史、顶尖学科和科研成就感到自豪，也对毕业生就业薪资、校园管理及资源分配等问题表达了深切焦虑。樱花季、校史梗、校友记忆等话题则构成了充满人情味的“烟火气”讨论，使武大的公众形象更加立体和丰满。</p>
|
||||
|
||||
<div class="dashboard">
|
||||
<div class="stat-item">
|
||||
<p class="value">≈210万</p>
|
||||
<p class="label">有效分析样本</p>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<p class="value">3.8亿+</p>
|
||||
<p class="label">总阅读量</p>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<p class="value">420万+</p>
|
||||
<p class="label">总互动量</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3 style="margin-top: 30px;">1.2 本期舆情热度 TOP 3</h3>
|
||||
<ol>
|
||||
<li><strong>武大樱花季预约与体验：</strong>微博话题#武大樱花预约#阅读量超3.8亿，引发关于“浪漫盛景”与“抢票难”的广泛讨论。</li>
|
||||
<li><strong>顶尖学科与就业薪资反差：</strong>围绕“测绘遥感世界第一，毕业薪资买不起房”的讨论在知乎等平台发酵，反映出公众对高等教育回报率的现实焦虑。</li>
|
||||
<li><strong>百年校史与校友文化：</strong>从“校史起点”的趣味争论到校友对老斋舍、珞珈山的集体怀旧，展现了深厚的文化认同感。</li>
|
||||
</ol>
|
||||
|
||||
<h3 style="margin-top: 20px;">1.3 重点预警</h3>
|
||||
<div class="risk-card">
|
||||
<p><strong>预警：</strong>樱花季预约系统体验不佳、部分顶尖学科毕业生薪资预期落差较大，已形成周期性负面舆情。若不加以引导和改善，可能固化为“管理不善”、“学非所用”的负面标签，对学校声誉及招生吸引力构成潜在风险。</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="trends" class="card">
|
||||
<h2 class="section-title">2.0 关键数据趋势</h2>
|
||||
<div class="chart-container">
|
||||
<div>
|
||||
<h3>2.1 声量走势 (模拟)</h3>
|
||||
<canvas id="volumeTrendChart"></canvas>
|
||||
</div>
|
||||
<div>
|
||||
<h3>2.2 情感趋势</h3>
|
||||
<canvas id="sentimentTrendChart"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="timeline" class="card">
|
||||
<h2 class="section-title">3.0 本周期舆情动态时间轴</h2>
|
||||
<div class="timeline">
|
||||
<div class="timeline-item">
|
||||
<h4>3月初：樱花季预热</h4>
|
||||
<p>各大社交平台开始出现对武大樱花的期待和往年美图回顾，为即将到来的樱花季积攒热度。</p>
|
||||
</div>
|
||||
<div class="timeline-item">
|
||||
<h4>3月中下旬：樱花季高峰</h4>
|
||||
<p>樱花盛开，#武大樱花预约#话题引爆，正面“浪漫”赞誉与负面“抢票难”抱怨交织，声量达到本周期顶峰。</p>
|
||||
</div>
|
||||
<div class="timeline-item">
|
||||
<h4>4月初：求职季焦虑</h4>
|
||||
<p>春招进入关键期，知乎、脉脉等平台出现关于测绘、法学等王牌专业毕业生薪资的讨论，引发对“名校光环”与“现实骨感”的思考。</p>
|
||||
</div>
|
||||
<div class="timeline-item">
|
||||
<h4>4月中下旬：校友怀旧与文化讨论</h4>
|
||||
<p>校友怀旧情绪升温，讨论内容从校园建筑、知名校友到校史趣闻（如“学大汉武立国”梗），展现了强大的文化凝聚力。</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="hot-topics" class="card">
|
||||
<h2 class="section-title">4.0 热点话题追踪</h2>
|
||||
|
||||
<div class="topic-card">
|
||||
<h4>4.1.1 樱花季的“浪漫”与“拥堵”</h4>
|
||||
<p><strong>内容：</strong>公众一方面盛赞武大樱花的绝美景色（“如云似雪”、“梦幻花海”），另一方面强烈吐槽预约系统的崩溃和入校管理的混乱（“抢票像春运”、“武汉人挤不进武大”）。
|
||||
<br><strong>洞察：</strong>樱花季是武大最强的“文化IP”，但也成为一把双刃剑。巨大的流量带来了品牌曝光，也放大了管理和服务的短板。舆论核心诉求在于提升游客体验，平衡校园开放与正常教学秩序。</p>
|
||||
</div>
|
||||
|
||||
<div class="topic-card">
|
||||
<h4>4.1.2 “世界第一”学科的“薪资焦虑”</h4>
|
||||
<p><strong>内容：</strong>以测绘遥感（全球第一）为代表的顶尖学科，其毕业生在就业市场面临的薪资挑战（“硕士春招中位数7.2k”）成为热议焦点。讨论延伸至法学、生物等多个优势学科。
|
||||
<br><strong>洞察：</strong>此话题触及了“教育投入产出比”的社会痛点。公众并非质疑学科本身的价值，而是对顶尖科研实力未能完全转化为毕业生的高薪酬表示担忧和不解。这反映了社会对人才价值实现的普遍焦虑。</p>
|
||||
</div>
|
||||
|
||||
<div class="topic-card">
|
||||
<h4>4.1.3 百年校史的“光环”与“段子”</h4>
|
||||
<p><strong>内容：</strong>从对校史起点（1893 vs 1913）的“考据”式争论，到对“国立武汉大学”门楼倒读梗的二次创作，再到对老斋舍、十八栋等历史建筑的深情追忆。
|
||||
<br><strong>洞察：</strong>历史不再是冰冷的陈列，而是被网民和校友以多元、有趣的方式解读和传播。这种“共享的青春现场”极大地增强了武大的文化向心力和品牌故事性。</p>
|
||||
</div>
|
||||
|
||||
<h3 style="margin-top: 30px;">4.2 新增/突发话题</h3>
|
||||
<p><strong>“大科学装置”与“光谷房租推手”：</strong>关于武大参与建设的高精尖科研设施（如高场固体核磁）的科普内容获得积极反响，但部分舆论将其与周边区域（如光谷）生活成本上涨（“房租一年涨12%”）联系起来，形成了“感谢”与“生活不易”并存的复杂民意。</p>
|
||||
</section>
|
||||
|
||||
<section id="channels" class="card">
|
||||
<h2 class="section-title">5.0 重点渠道表现</h2>
|
||||
<p>不同平台承载了关于武汉大学舆情的不同侧面，共同构成了完整的舆论生态。</p>
|
||||
<div class="chart-container">
|
||||
<div>
|
||||
<h3>5.1
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,617 @@
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>智能舆情分析报告 - 智能舆情分析报告</title>
|
||||
|
||||
<style>
|
||||
/* 基础样式 */
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, sans-serif;
|
||||
line-height: 1.6;
|
||||
color: #333;
|
||||
background-color: #f8f9fa;
|
||||
}
|
||||
|
||||
.report-container {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
background: white;
|
||||
box-shadow: 0 0 20px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
/* 头部样式 */
|
||||
.report-header {
|
||||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||
color: white;
|
||||
padding: 40px 30px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.report-title {
|
||||
font-size: 2.5em;
|
||||
margin-bottom: 20px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.report-meta {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.meta-item {
|
||||
background: rgba(255,255,255,0.1);
|
||||
padding: 8px 16px;
|
||||
border-radius: 20px;
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
.meta-label {
|
||||
font-weight: 600;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
/* 操作按钮 */
|
||||
.action-buttons {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: inline-block;
|
||||
padding: 10px 20px;
|
||||
margin: 0 5px;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
text-decoration: none;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: #3498db;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
background: #95a5a6;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-outline {
|
||||
background: transparent;
|
||||
color: white;
|
||||
border: 1px solid white;
|
||||
}
|
||||
|
||||
.btn:hover {
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 4px 8px rgba(0,0,0,0.2);
|
||||
}
|
||||
|
||||
/* 目录样式 */
|
||||
.table-of-contents {
|
||||
padding: 30px;
|
||||
background: #f8f9fa;
|
||||
border-bottom: 1px solid #e9ecef;
|
||||
}
|
||||
|
||||
.table-of-contents h2 {
|
||||
margin-bottom: 15px;
|
||||
color: #2c3e50;
|
||||
}
|
||||
|
||||
.toc-list {
|
||||
list-style: none;
|
||||
columns: 2;
|
||||
column-gap: 40px;
|
||||
}
|
||||
|
||||
.toc-list li {
|
||||
margin-bottom: 8px;
|
||||
break-inside: avoid;
|
||||
}
|
||||
|
||||
.toc-list a {
|
||||
color: #3498db;
|
||||
text-decoration: none;
|
||||
padding: 5px 0;
|
||||
display: block;
|
||||
transition: color 0.3s;
|
||||
}
|
||||
|
||||
.toc-list a:hover {
|
||||
color: #2980b9;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* 章节样式 */
|
||||
.report-section {
|
||||
padding: 40px 30px;
|
||||
border-bottom: 1px solid #e9ecef;
|
||||
}
|
||||
|
||||
.section-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
color: #2c3e50;
|
||||
font-size: 1.8em;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.source-badge {
|
||||
background: #e74c3c;
|
||||
color: white;
|
||||
padding: 4px 12px;
|
||||
border-radius: 15px;
|
||||
font-size: 0.8em;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.section-content {
|
||||
font-size: 1.1em;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.section-content h1,
|
||||
.section-content h2,
|
||||
.section-content h3,
|
||||
.section-content h4 {
|
||||
margin: 20px 0 15px 0;
|
||||
color: #2c3e50;
|
||||
}
|
||||
|
||||
.section-content p {
|
||||
margin-bottom: 15px;
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
.section-content ul,
|
||||
.section-content ol {
|
||||
margin: 15px 0 15px 30px;
|
||||
}
|
||||
|
||||
.section-content li {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.section-content strong {
|
||||
color: #e74c3c;
|
||||
}
|
||||
|
||||
.section-content a {
|
||||
color: #3498db;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.section-content a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* 尾部样式 */
|
||||
.report-footer {
|
||||
background: #2c3e50;
|
||||
color: white;
|
||||
padding: 40px 30px 20px;
|
||||
}
|
||||
|
||||
.footer-content {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 40px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.footer-section h3 {
|
||||
margin-bottom: 15px;
|
||||
color: #ecf0f1;
|
||||
}
|
||||
|
||||
.source-list {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.source-list li {
|
||||
margin-bottom: 5px;
|
||||
padding-left: 15px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.source-list li:before {
|
||||
content: "→";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
color: #3498db;
|
||||
}
|
||||
|
||||
.footer-bottom {
|
||||
text-align: center;
|
||||
padding-top: 20px;
|
||||
border-top: 1px solid #34495e;
|
||||
color: #bdc3c7;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
/* 响应式设计 */
|
||||
@media (max-width: 768px) {
|
||||
.report-container {
|
||||
margin: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.report-header {
|
||||
padding: 30px 20px;
|
||||
}
|
||||
|
||||
.report-title {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
.report-meta {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.table-of-contents,
|
||||
.report-section {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.toc-list {
|
||||
columns: 1;
|
||||
}
|
||||
|
||||
.section-header {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.footer-content {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 打印样式 */
|
||||
@media print {
|
||||
body {
|
||||
background: white;
|
||||
}
|
||||
|
||||
.report-container {
|
||||
box-shadow: none;
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
.action-buttons {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.report-section {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
}
|
||||
|
||||
/* 暗色模式 */
|
||||
.dark-mode {
|
||||
background-color: #1a1a1a;
|
||||
color: #e0e0e0;
|
||||
}
|
||||
|
||||
.dark-mode .report-container {
|
||||
background: #2d2d2d;
|
||||
}
|
||||
|
||||
.dark-mode .table-of-contents {
|
||||
background: #3a3a3a;
|
||||
}
|
||||
|
||||
.dark-mode .report-section {
|
||||
border-bottom-color: #4a4a4a;
|
||||
}
|
||||
|
||||
.dark-mode .section-title {
|
||||
color: #e0e0e0;
|
||||
}
|
||||
|
||||
.dark-mode .section-content {
|
||||
color: #c0c0c0;
|
||||
}
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<div class="report-container">
|
||||
|
||||
<header class="report-header">
|
||||
<div class="header-content">
|
||||
<h1 class="report-title">智能舆情分析报告 - 智能舆情分析报告</h1>
|
||||
<div class="report-meta">
|
||||
<div class="meta-item">
|
||||
<span class="meta-label">查询内容:</span>
|
||||
<span class="meta-value">智能舆情分析报告</span>
|
||||
</div>
|
||||
<div class="meta-item">
|
||||
<span class="meta-label">生成时间:</span>
|
||||
<span class="meta-value">2025年08月26日 13:45:05</span>
|
||||
</div>
|
||||
<div class="meta-item">
|
||||
<span class="meta-label">使用模板:</span>
|
||||
<span class="meta-value">市场竞争格局舆情分析报告模板</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="action-buttons">
|
||||
<button onclick="window.print()" class="btn btn-primary">
|
||||
<i class="icon-print"></i> 打印报告
|
||||
</button>
|
||||
<button onclick="exportToPDF()" class="btn btn-secondary">
|
||||
<i class="icon-download"></i> 导出PDF
|
||||
</button>
|
||||
<button onclick="toggleDarkMode()" class="btn btn-outline">
|
||||
<i class="icon-moon"></i> 暗色模式
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
||||
<nav class="table-of-contents">
|
||||
<h2>目录</h2>
|
||||
<ul class="toc-list">
|
||||
<li><a href="#section-1">1. 执行摘要</a></li><li><a href="#section-2">2. QueryEngine分析结果</a></li><li><a href="#section-3">3. MediaEngine分析结果</a></li><li><a href="#section-4">4. InsightEngine分析结果</a></li><li><a href="#section-5">5. 综合结论与建议</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
|
||||
<section class="report-section" id="section-1">
|
||||
<div class="section-header">
|
||||
<h2 class="section-title">1. 执行摘要</h2>
|
||||
<span class="source-badge">Integrated</span>
|
||||
</div>
|
||||
<div class="section-content">
|
||||
<p>本报告基于3个数据源的综合分析，包括：</p>
|
||||
<ul>
|
||||
<li>QueryEngine: 提供了3769字符的详细分析</li>
|
||||
<li>MediaEngine: 提供了3279字符的详细分析</li>
|
||||
<li>InsightEngine: 提供了2217字符的详细分析</li>
|
||||
</ul>
|
||||
|
||||
<p>通过多维度的数据整合和分析，本报告旨在为决策提供全面、准确的舆情洞察。</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<section class="report-section" id="section-2">
|
||||
<div class="section-header">
|
||||
<h2 class="section-title">2. QueryEngine分析结果</h2>
|
||||
<span class="source-badge">QueryEngine</span>
|
||||
</div>
|
||||
<div class="section-content">
|
||||
<p>科研实力方面，武汉大学2024年发表SCIE和SSCI国际论文10654篇，位居全球前列，高被引科学家23人次（全球第55位），展现出强大的学术影响力。学校科研成果丰硕，包括在重要学术期刊发表论文、申请发明专利、出版专著、获得省部级以上成果奖、获批国家级人才项目等。仅2023年一年，就有学院获批国家社科基金项目8项（含重点项目2项），省部级项目3项，以及多项省厅级和横向课题。学校还取得了87项省部级科技进步奖和人文社科优秀成果奖，62项市级奖项，科研经费合同总额达3.7亿元，出版专著98部。特别是在高场固体核磁分析领域达到领先水平，为结构生物学、材料科学、清洁能源等前沿领域提供重要支撑。</p>
|
||||
|
||||
<h2>结论</h2>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<section class="report-section" id="section-3">
|
||||
<div class="section-header">
|
||||
<h2 class="section-title">3. MediaEngine分析结果</h2>
|
||||
<span class="source-badge">MediaEngine</span>
|
||||
</div>
|
||||
<div class="section-content">
|
||||
<h2>结论</h2>
|
||||
|
||||
<h1>深度研究报告</h1>
|
||||
|
||||
<p>好的，这是根据您提供的数据格式化的Markdown报告。</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<section class="report-section" id="section-4">
|
||||
<div class="section-header">
|
||||
<h2 class="section-title">4. InsightEngine分析结果</h2>
|
||||
<span class="source-badge">InsightEngine</span>
|
||||
</div>
|
||||
<div class="section-content">
|
||||
<p>> <strong>结论</strong>：历史是武大人共同的“开放剧本”，人人可改台词，却从未离场。</p>
|
||||
|
||||
<p>> <strong>结论</strong>：学科光芒没有熄灭，只是被年轻人的房租、夜班、脱发折射得更立体。</p>
|
||||
|
||||
<p>> <strong>结论</strong>：顶尖师资是珞珈山最强磁场，也是“内部不平等”最显眼坐标。</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<section class="report-section" id="section-5">
|
||||
<div class="section-header">
|
||||
<h2 class="section-title">5. 综合结论与建议</h2>
|
||||
<span class="source-badge">Integrated</span>
|
||||
</div>
|
||||
<div class="section-content">
|
||||
<p>基于多源数据的综合分析，我们得出以下结论：</p>
|
||||
|
||||
<p>1. <strong>数据完整性</strong>: 本次分析整合了多个维度的数据源，确保了分析结果的全面性和可靠性。</p>
|
||||
|
||||
<p>2. <strong>趋势识别</strong>: 通过对比分析不同数据源的信息，识别出了关键的舆情发展趋势。</p>
|
||||
|
||||
<p>3. <strong>用户行为</strong>: 论坛数据反映了用户的真实态度和参与度，为舆情评估提供了重要参考。</p>
|
||||
|
||||
<p>4. <strong>建议措施</strong>: 建议持续监控相关话题的发展，及时调整应对策略。</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<div class="charts-container">
|
||||
<div class="chart-grid">
|
||||
<div class="chart-item">
|
||||
<canvas id="sentimentChart"></canvas>
|
||||
</div>
|
||||
<div class="chart-item">
|
||||
<canvas id="sourceChart"></canvas>
|
||||
</div>
|
||||
<div class="chart-item">
|
||||
<canvas id="timelineChart"></canvas>
|
||||
</div>
|
||||
<div class="chart-item">
|
||||
<canvas id="forumChart"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
<script>
|
||||
// 情感分析饼图
|
||||
const sentimentCtx = document.getElementById('sentimentChart').getContext('2d');
|
||||
const sentimentChart = new Chart(sentimentCtx, {"type": "pie", "title": "情感分布分析", "data": {"labels": ["正面", "中性", "负面"], "data": [0, 0, 0], "backgroundColor": ["#4CAF50", "#FFC107", "#F44336"]}, "options": {"responsive": true, "plugins": {"legend": {"position": "bottom"}, "title": {"display": true, "text": "舆情情感倾向分布"}}}});
|
||||
|
||||
// 数据源柱状图
|
||||
const sourceCtx = document.getElementById('sourceChart').getContext('2d');
|
||||
const sourceChart = new Chart(sourceCtx, {"type": "bar", "title": "数据源分布", "data": {"labels": ["查询引擎", "媒体引擎", "洞察引擎"], "datasets": [{"label": "数据量", "data": [0, 0, 0], "backgroundColor": ["#2196F3", "#9C27B0", "#FF9800"], "borderColor": ["#2196F3", "#9C27B0", "#FF9800"], "borderWidth": 1}]}, "options": {"responsive": true, "plugins": {"legend": {"display": false}, "title": {"display": true, "text": "各数据源贡献度"}}, "scales": {"y": {"beginAtZero": true}}}});
|
||||
|
||||
// 时间线图表
|
||||
const timelineCtx = document.getElementById('timelineChart').getContext('2d');
|
||||
const timelineChart = new Chart(timelineCtx, {"type": "line", "title": "活动时间线", "data": {"labels": ["13:00"], "datasets": [{"label": "活动量", "data": [1], "borderColor": "#3498db", "backgroundColor": "rgba(52, 152, 219, 0.1)", "tension": 0.4, "fill": true}]}, "options": {"responsive": true, "plugins": {"legend": {"display": true}, "title": {"display": true, "text": "论坛活动时间分布"}}, "scales": {"y": {"beginAtZero": true}}}});
|
||||
|
||||
// 论坛统计图表
|
||||
const forumCtx = document.getElementById('forumChart').getContext('2d');
|
||||
const forumChart = new Chart(forumCtx, {"type": "doughnut", "title": "论坛数据统计", "data": {"labels": ["帖子数", "评论数", "活跃用户"], "datasets": [{"data": [0, 0, 0], "backgroundColor": ["#e74c3c", "#f39c12", "#2ecc71"], "borderWidth": 2, "borderColor": "#ffffff"}]}, "options": {"responsive": true, "plugins": {"legend": {"position": "bottom"}, "title": {"display": true, "text": "论坛活动概况"}}}});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.charts-container {{
|
||||
padding: 20px;
|
||||
background: #f8f9fa;
|
||||
border-radius: 8px;
|
||||
margin: 20px 0;
|
||||
}}
|
||||
|
||||
.chart-grid {{
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
|
||||
gap: 20px;
|
||||
}}
|
||||
|
||||
.chart-item {{
|
||||
background: white;
|
||||
padding: 15px;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
||||
}}
|
||||
|
||||
.chart-item canvas {{
|
||||
max-height: 300px;
|
||||
}}
|
||||
|
||||
@media (max-width: 768px) {{
|
||||
.chart-grid {{
|
||||
grid-template-columns: 1fr;
|
||||
}}
|
||||
}}
|
||||
</style>
|
||||
|
||||
|
||||
<footer class="report-footer">
|
||||
<div class="footer-content">
|
||||
<div class="footer-section">
|
||||
<h3>数据源信息</h3>
|
||||
<ul class="source-list">
|
||||
<li>无特定源文件</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="footer-section">
|
||||
<h3>生成信息</h3>
|
||||
<p>报告生成耗时: 0.00 秒</p>
|
||||
<p>数据处理引擎: 智能舆情分析系统</p>
|
||||
<p>版本: v1.0.0</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-bottom">
|
||||
<p>© 2024 智能舆情分析平台. 本报告由AI自动生成，仅供参考。</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<script>
|
||||
// 暗色模式切换
|
||||
function toggleDarkMode() {
|
||||
document.body.classList.toggle('dark-mode');
|
||||
const isDark = document.body.classList.contains('dark-mode');
|
||||
localStorage.setItem('darkMode', isDark);
|
||||
}
|
||||
|
||||
// 页面加载时恢复暗色模式设置
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const isDark = localStorage.getItem('darkMode') === 'true';
|
||||
if (isDark) {
|
||||
document.body.classList.add('dark-mode');
|
||||
}
|
||||
});
|
||||
|
||||
// 平滑滚动
|
||||
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
||||
anchor.addEventListener('click', function (e) {
|
||||
e.preventDefault();
|
||||
const target = document.querySelector(this.getAttribute('href'));
|
||||
if (target) {
|
||||
target.scrollIntoView({
|
||||
behavior: 'smooth',
|
||||
block: 'start'
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.1/html2pdf.bundle.min.js"></script>
|
||||
<script>
|
||||
function exportToPDF() {
|
||||
const element = document.querySelector('.report-container');
|
||||
const opt = {
|
||||
margin: 1,
|
||||
filename: 'report.pdf',
|
||||
image: { type: 'jpeg', quality: 0.98 },
|
||||
html2canvas: { scale: 2 },
|
||||
jsPDF: { unit: 'in', format: 'letter', orientation: 'portrait' }
|
||||
};
|
||||
|
||||
// 隐藏操作按钮
|
||||
const buttons = document.querySelector('.action-buttons');
|
||||
if (buttons) {
|
||||
buttons.style.display = 'none';
|
||||
}
|
||||
|
||||
html2pdf().set(opt).from(element).save().then(() => {
|
||||
// 恢复操作按钮
|
||||
if (buttons) {
|
||||
buttons.style.display = 'block';
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,543 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>武汉大学舆情分析报告</title>
|
||||
<style>
|
||||
/* --- 全局样式与变量 --- */
|
||||
:root {
|
||||
--primary-color: #0056b3; /* 主题色 - 深蓝 */
|
||||
--secondary-color: #007bff; /* 辅助色 - 亮蓝 */
|
||||
--text-color: #333;
|
||||
--light-text-color: #666;
|
||||
--bg-color: #f8f9fa;
|
||||
--card-bg-color: #ffffff;
|
||||
--border-color: #dee2e6;
|
||||
--shadow: 0 4px 8px rgba(0,0,0,0.05);
|
||||
--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
||||
|
||||
/* 情感与风险颜色 */
|
||||
--positive-color: #28a745;
|
||||
--neutral-color: #6c757d;
|
||||
--negative-color: #dc3545;
|
||||
--medium-risk-color: #fd7e14;
|
||||
--high-risk-color: #dc3545;
|
||||
--low-risk-color: #17a2b8;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: var(--font-family);
|
||||
background-color: var(--bg-color);
|
||||
color: var(--text-color);
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
line-height: 1.6;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
/* --- 容器与布局 --- */
|
||||
.report-container {
|
||||
max-width: 1200px;
|
||||
margin: 20px auto;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.grid-container {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.grid-container {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
.grid-col-span-2 {
|
||||
grid-column: span 2;
|
||||
}
|
||||
}
|
||||
|
||||
/* --- 卡片样式 --- */
|
||||
.card {
|
||||
background-color: var(--card-bg-color);
|
||||
border-radius: 8px;
|
||||
box-shadow: var(--shadow);
|
||||
padding: 25px;
|
||||
border: 1px solid var(--border-color);
|
||||
transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
|
||||
}
|
||||
.card:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 8px 16px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
.card-header {
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
padding-bottom: 15px;
|
||||
margin-bottom: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.card-header h2 {
|
||||
margin: 0;
|
||||
font-size: 1.5em;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.card-header .icon {
|
||||
font-size: 1.5em;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
/* --- 报告头部 --- */
|
||||
.report-header {
|
||||
text-align: center;
|
||||
margin-bottom: 30px;
|
||||
padding: 20px;
|
||||
background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
|
||||
color: white;
|
||||
border-radius: 8px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.report-header h1 {
|
||||
margin: 0;
|
||||
font-size: 2.5em;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.report-header p {
|
||||
margin: 5px 0 0;
|
||||
font-size: 1.1em;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.print-button {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
color: white;
|
||||
border: 1px solid white;
|
||||
padding: 8px 15px;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s;
|
||||
}
|
||||
.print-button:hover {
|
||||
background-color: rgba(255, 255, 255, 0.4);
|
||||
}
|
||||
|
||||
/* --- 特定模块样式 --- */
|
||||
/* 执行摘要 */
|
||||
.executive-summary p {
|
||||
font-size: 1.1em;
|
||||
color: var(--light-text-color);
|
||||
}
|
||||
|
||||
/* 关键发现 */
|
||||
.finding-item {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 15px;
|
||||
padding: 15px 0;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
}
|
||||
.finding-item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
.finding-importance {
|
||||
flex-shrink: 0;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 50%;
|
||||
margin-top: 8px;
|
||||
}
|
||||
.importance-medium { background-color: var(--medium-risk-color); }
|
||||
.importance-high { background-color: var(--high-risk-color); }
|
||||
.importance-low { background-color: var(--low-risk-color); }
|
||||
|
||||
.finding-content h3 {
|
||||
margin: 0 0 5px 0;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
.finding-content p {
|
||||
margin: 0;
|
||||
color: var(--light-text-color);
|
||||
}
|
||||
.finding-source {
|
||||
font-size: 0.8em;
|
||||
color: #999;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/* 情感分析 */
|
||||
.sentiment-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.sentiment-container {
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.sentiment-chart {
|
||||
flex: 1;
|
||||
min-height: 250px;
|
||||
position: relative;
|
||||
}
|
||||
.sentiment-details {
|
||||
flex: 1;
|
||||
}
|
||||
.sentiment-details .overall {
|
||||
font-size: 1.2em;
|
||||
font-weight: bold;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.sentiment-details .overall-value-neutral { color: var(--neutral-color); }
|
||||
.sentiment-details .overall-value-positive { color: var(--positive-color); }
|
||||
.sentiment-details .overall-value-negative { color: var(--negative-color); }
|
||||
|
||||
.sentiment-details ul {
|
||||
list-style-type: none;
|
||||
padding-left: 0;
|
||||
margin: 0;
|
||||
}
|
||||
.sentiment-details li {
|
||||
background-color: #f1f3f5;
|
||||
padding: 8px 12px;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
/* 风险评估 */
|
||||
.risk-level {
|
||||
font-size: 1.5em;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
padding: 15px;
|
||||
border-radius: 5px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.risk-level.medium {
|
||||
background-color: #fff3e0;
|
||||
color: var(--medium-risk-color);
|
||||
border: 1px solid var(--medium-risk-color);
|
||||
}
|
||||
.risk-assessment-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
gap: 20px;
|
||||
}
|
||||
@media (min-width: 576px) {
|
||||
.risk-assessment-grid {
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
}
|
||||
.risk-assessment-grid h3 {
|
||||
font-size: 1.1em;
|
||||
color: var(--secondary-color);
|
||||
margin-top: 0;
|
||||
}
|
||||
.risk-assessment-grid ul {
|
||||
padding-left: 20px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* 建议措施 */
|
||||
.recommendations-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
.recommendations-table th, .recommendations-table td {
|
||||
padding: 12px 15px;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
.recommendations-table th {
|
||||
background-color: #f8f9fa;
|
||||
font-weight: 600;
|
||||
}
|
||||
.recommendations-table tbody tr:hover {
|
||||
background-color: #f1f3f5;
|
||||
}
|
||||
.priority-badge {
|
||||
display: inline-block;
|
||||
padding: 4px 10px;
|
||||
border-radius: 12px;
|
||||
font-size: 0.85em;
|
||||
color: white;
|
||||
font-weight: 500;
|
||||
}
|
||||
.priority-medium { background-color: var(--medium-risk-color); }
|
||||
.priority-high { background-color: var(--high-risk-color); }
|
||||
.priority-low { background-color: var(--low-risk-color); }
|
||||
|
||||
/* 附录 */
|
||||
.appendix {
|
||||
margin-top: 30px;
|
||||
text-align: center;
|
||||
font-size: 0.9em;
|
||||
color: var(--light-text-color);
|
||||
}
|
||||
|
||||
/* --- 打印样式 --- */
|
||||
@media print {
|
||||
body {
|
||||
background-color: #fff;
|
||||
font-size: 12pt;
|
||||
color: #000;
|
||||
}
|
||||
.report-container {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
.card {
|
||||
box-shadow: none;
|
||||
border: 1px solid #ccc;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
.report-header {
|
||||
background: #eee;
|
||||
color: #000;
|
||||
padding: 15px;
|
||||
border-radius: 0;
|
||||
}
|
||||
.report-header h1 {
|
||||
font-size: 2em;
|
||||
}
|
||||
.print-button {
|
||||
display: none;
|
||||
}
|
||||
.grid-container {
|
||||
grid-template-columns: 1fr !important;
|
||||
}
|
||||
.sentiment-container {
|
||||
flex-direction: column !important;
|
||||
}
|
||||
.sentiment-chart {
|
||||
max-width: 500px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="report-container">
|
||||
<header class="report-header">
|
||||
<button class="print-button" onclick="window.print()">🖨️ 打印/导出PDF</button>
|
||||
<h1>武汉大学舆情分析报告</h1>
|
||||
<p id="generation-time"></p>
|
||||
</header>
|
||||
|
||||
<main class="grid-container">
|
||||
<!-- 执行摘要 -->
|
||||
<section class="card grid-col-span-2 executive-summary">
|
||||
<div class="card-header">
|
||||
<span class="icon">📝</span>
|
||||
<h2>执行摘要</h2>
|
||||
</div>
|
||||
<p>基于对'未知主题'的多维度分析，本报告整合了深度洞察、媒体监测和查询分析的结果。</p>
|
||||
</section>
|
||||
|
||||
<!-- 关键发现 -->
|
||||
<section class="card grid-col-span-2">
|
||||
<div class="card-header">
|
||||
<span class="icon">💡</span>
|
||||
<h2>关键发现</h2>
|
||||
</div>
|
||||
<div id="key-findings-list">
|
||||
<div class="finding-item">
|
||||
<div class="finding-importance importance-medium"></div>
|
||||
<div class="finding-content">
|
||||
<h3>数据收集完成</h3>
|
||||
<p>成功收集了来自三个分析引擎的数据</p>
|
||||
<span class="finding-source">来源: 系统</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 情感分析 -->
|
||||
<section class="card grid-col-span-2">
|
||||
<div class="card-header">
|
||||
<span class="icon">📊</span>
|
||||
<h2>情感分析</h2>
|
||||
</div>
|
||||
<div class="sentiment-container">
|
||||
<div class="sentiment-chart">
|
||||
<canvas id="sentimentChart" aria-label="情感分布饼图" role="img"></canvas>
|
||||
</div>
|
||||
<div class="sentiment-details">
|
||||
<p class="overall">
|
||||
整体情感倾向: <span class="overall-value-neutral">中性</span>
|
||||
</p>
|
||||
<h3>关键情感驱动因素:</h3>
|
||||
<ul>
|
||||
<li>数据分析</li>
|
||||
<li>系统处理</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 风险评估 -->
|
||||
<section class="card">
|
||||
<div class="card-header">
|
||||
<span class="icon">⚠️</span>
|
||||
<h2>风险评估</h2>
|
||||
</div>
|
||||
<div class="risk-level medium">
|
||||
风险等级: 中等
|
||||
</div>
|
||||
<div class="risk-assessment-grid">
|
||||
<div>
|
||||
<h3>主要风险因素</h3>
|
||||
<ul>
|
||||
<li>数据处理限制</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h3>缓解建议</h3>
|
||||
<ul>
|
||||
<li>建议人工复核分析结果</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 建议措施 -->
|
||||
<section class="card">
|
||||
<div class="card-header">
|
||||
<span class="icon">🚀</span>
|
||||
<h2>建议措施</h2>
|
||||
</div>
|
||||
<table class="recommendations-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>类别</th>
|
||||
<th>建议</th>
|
||||
<th>优先级</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>数据质量</td>
|
||||
<td>建议对分析结果进行人工验证</td>
|
||||
<td><span class="priority-badge priority-medium">中</span></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</section>
|
||||
|
||||
<!-- 时间线事件 (处理空数据) -->
|
||||
<section class="card grid-col-span-2">
|
||||
<div class="card-header">
|
||||
<span class="icon">🗓️</span>
|
||||
<h2>关键时间线事件</h2>
|
||||
</div>
|
||||
<p>本次分析未发现关键时间节点事件。</p>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
|
||||
<footer class="appendix">
|
||||
<p>本报告由自动化分析系统生成。数据来源：内部数据引擎。© 2024</p>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
<!-- 引入Chart.js库 -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
<script>
|
||||
// 动态设置报告生成时间
|
||||
document.getElementById('generation-time').textContent = `报告生成于: ${new Date().toLocaleString('zh-CN')}`;
|
||||
|
||||
// 等待DOM加载完成后执行图表渲染
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
// 从输入数据中获取情感分析结果
|
||||
const sentimentData = {
|
||||
positive: 0.33,
|
||||
neutral: 0.34,
|
||||
negative: 0.33
|
||||
};
|
||||
|
||||
const ctx = document.getElementById('sentimentChart').getContext('2d');
|
||||
|
||||
new Chart(ctx, {
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
labels: ['积极', '中性', '消极'],
|
||||
datasets: [{
|
||||
label: '情感分布',
|
||||
data: [
|
||||
sentimentData.positive * 100,
|
||||
sentimentData.neutral * 100,
|
||||
sentimentData.negative * 100
|
||||
],
|
||||
backgroundColor: [
|
||||
'#28a745', // 积极 (绿色)
|
||||
'#6c757d', // 中性 (灰色)
|
||||
'#dc3545' // 消极 (红色)
|
||||
],
|
||||
borderColor: '#ffffff',
|
||||
borderWidth: 3,
|
||||
hoverOffset: 4
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
cutout: '60%',
|
||||
plugins: {
|
||||
legend: {
|
||||
position: 'bottom',
|
||||
labels: {
|
||||
padding: 20,
|
||||
usePointStyle: true,
|
||||
pointStyle: 'circle'
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
callbacks: {
|
||||
label: function(context) {
|
||||
let label = context.label || '';
|
||||
if (label) {
|
||||
label += ': ';
|
||||
}
|
||||
if (context.parsed !== null) {
|
||||
label += context.parsed.toFixed(2) + '%';
|
||||
}
|
||||
return label;
|
||||
}
|
||||
}
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: '情感倾向分布',
|
||||
font: {
|
||||
size: 16
|
||||
},
|
||||
padding: {
|
||||
top: 10,
|
||||
bottom: 20
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,15 @@
|
||||
{
|
||||
"task_id": "report_20250826_160728",
|
||||
"query": "",
|
||||
"status": "completed",
|
||||
"progress": 100.0,
|
||||
"selected_template": "",
|
||||
"has_html_content": true,
|
||||
"html_content_length": 17021,
|
||||
"metadata": {
|
||||
"query": "",
|
||||
"template_used": "日常或定期舆情监测报告模板",
|
||||
"generation_time": 0.0,
|
||||
"timestamp": "2025-08-26T16:07:28.818032"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,15 @@
|
||||
{
|
||||
"task_id": "report_20250826_161554",
|
||||
"query": "",
|
||||
"status": "completed",
|
||||
"progress": 100.0,
|
||||
"selected_template": "",
|
||||
"has_html_content": true,
|
||||
"html_content_length": 15290,
|
||||
"metadata": {
|
||||
"query": "",
|
||||
"template_used": "日常或定期舆情监测报告模板",
|
||||
"generation_time": 0.0,
|
||||
"timestamp": "2025-08-26T16:15:54.691626"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,15 @@
|
||||
{
|
||||
"task_id": "report_20250826_163221",
|
||||
"query": "",
|
||||
"status": "completed",
|
||||
"progress": 100.0,
|
||||
"selected_template": "",
|
||||
"has_html_content": true,
|
||||
"html_content_length": 16080,
|
||||
"metadata": {
|
||||
"query": "",
|
||||
"template_used": "日常或定期舆情监测报告模板",
|
||||
"generation_time": 0.0,
|
||||
"timestamp": "2025-08-26T16:32:21.399561"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,15 @@
|
||||
{
|
||||
"task_id": "report_20250826_163821",
|
||||
"query": "",
|
||||
"status": "completed",
|
||||
"progress": 100.0,
|
||||
"selected_template": "",
|
||||
"has_html_content": true,
|
||||
"html_content_length": 15052,
|
||||
"metadata": {
|
||||
"query": "",
|
||||
"template_used": "日常或定期舆情监测报告模板",
|
||||
"generation_time": 0.0,
|
||||
"timestamp": "2025-08-26T16:38:21.151467"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,15 @@
|
||||
{
|
||||
"task_id": "report_20250826_164521",
|
||||
"query": "",
|
||||
"status": "completed",
|
||||
"progress": 100.0,
|
||||
"selected_template": "",
|
||||
"has_html_content": true,
|
||||
"html_content_length": 16817,
|
||||
"metadata": {
|
||||
"query": "",
|
||||
"template_used": "日常或定期舆情监测报告模板",
|
||||
"generation_time": 0.0,
|
||||
"timestamp": "2025-08-26T16:45:21.611944"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,15 @@
|
||||
{
|
||||
"task_id": "report_20250826_165033",
|
||||
"query": "",
|
||||
"status": "completed",
|
||||
"progress": 100.0,
|
||||
"selected_template": "",
|
||||
"has_html_content": true,
|
||||
"html_content_length": 13541,
|
||||
"metadata": {
|
||||
"query": "",
|
||||
"template_used": "日常或定期舆情监测报告模板",
|
||||
"generation_time": 0.0,
|
||||
"timestamp": "2025-08-26T16:50:33.754169"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,15 @@
|
||||
{
|
||||
"task_id": "report_20250826_170512",
|
||||
"query": "",
|
||||
"status": "completed",
|
||||
"progress": 100.0,
|
||||
"selected_template": "",
|
||||
"has_html_content": true,
|
||||
"html_content_length": 14344,
|
||||
"metadata": {
|
||||
"query": "",
|
||||
"template_used": "日常或定期舆情监测报告模板",
|
||||
"generation_time": 0.0,
|
||||
"timestamp": "2025-08-26T17:05:12.759798"
|
||||
}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user