分析式可视化html生成 prompt
本文详细阐述了一个面向用户输入主题的深度分析与动态可视化HTML报告生成方案(v2版),重点支持文本密集区域的优雅处理。最终产出为单一HTML文件,整合所有HTML、CSS(通过TailwindCSS CDN)、JavaScript(含Chart.js、Font Awesome及入场动画逻辑),且禁止引用本地外部文件。设计风格借鉴Apple现代美学,采用纯黑色背景,核心高亮色智能选取或备选专业蓝与亮橙,统一且克制应用于文本、图表及卡片元素,辅以严格单色渐变底色,确保视觉层次与科技感。
布局结合卡片化与文本块:主信息卡片承载核心逻辑模块,辅以迷你信息卡片网格展示结构化要点,文本密集区域则优化长段落阅读体验。AI智能判别内容性质,合理选择卡片或连续文本形式,避免拆分影响流畅性。排版强调字号、字重与颜色的层级分明,支持中英文和谐混排。图形数据通过Font Awesome与Chart.js动态展现,禁用Emoji,确保风格统一。
技术细节涵盖HTML5、TailwindCSS、ES6+、CDN引入库,利用Intersection Observer API实现主卡片及子元素的渐入动画,且全站响应式设计以适配各类设备。该方案全面兼顾结构化表达、交互效果与用户阅读体验,满足深度主题分析的可视化呈现需求。