# 示例

> 用纯 HTML 页面编写的报告、仪表盘、信息图和数据故事，每一个都基于真实的公开数据。

htmlpress 中的页面是一个完整的 HTML 文档，因此浏览器能显示的任何东西它都可以是：仪表盘、可打印的报告、幻灯片、交互式探索器。下面每个示例都是一个自包含的 `.html` 文件，带有自己的 `<style>` 和 `<script>`，按编程智能体的写法围绕真实公开数据编写。它嵌入站点的布局，跟随站点的浅色和深色主题，无需构建步骤、框架或图表库。

> **Tip**
>
> 每个数字都来自公开数据集，并在所在页面底部注明出处。通过“在 GitHub 上编辑”链接打开源码：页面所需的一切都在这一个文件里。

### [世界人口](/zh/examples/world-population/)

信息图海报

醒目数字、按地区划分的堆叠面积图，以及每增长十亿人的条形时间线。

### [气候变暖](/zh/examples/climate-warming/)

数据故事

变暖条纹图、带注释的温度记录，以及 80 万年的 CO₂ 记录。

### [电力仪表盘](/zh/examples/energy-dashboard/)

仪表盘

带迷你走势图的 KPI 卡片、100% 堆叠柱状图、环形图和可排序表格。

### [CO₂ 排放](/zh/examples/co2-emissions/)

交互式对比

展示排放来源的矩形树图，以及可在总量与人均之间切换的排名。

### [北极海冰](/zh/examples/arctic-sea-ice/)

科学简报

摘要、编号的结论和三张图：趋势散点图、排名图和范围图。

### [互联网接入](/zh/examples/internet-access/)

情况简报

可打印的单页：大号数字、今昔对比象形图和华夫图。

### [全球健康报告](/zh/examples/global-health-report/)

年度报告

封面、斜率图、小多图、脚注和可直接打印的版式。

### [电动汽车销量](/zh/examples/ev-sales-deck/)

幻灯片

一个页面中的五张 16:9 幻灯片：支持滑动、按钮、方向键和全屏。

### [城市化](/zh/examples/urbanization-timeline/)

时间线

里程碑旁是一个由年份滑块驱动的 100 人点阵图。

### [太阳能电池板价格](/zh/examples/solar-pv-prices/)

探索器

对数/线性切换、年份范围滑块，以及会重新计算的关键数字。

### [预期寿命](/zh/examples/life-expectancy/)

联动仪表盘

地区筛选、可播放的年份滑块，以及跟随同一选择的气泡图、趋势线和表格。

### [汽车碳排放](/zh/examples/car-carbon/)

假设情景计算器

输入你的电网、里程和能耗，得出电动车与汽油车在每个电网上的二氧化碳排放。