保存 Altair 图表#
Altair 图表对象有一个 Chart.save()
方法,允许以多种格式保存图表。
JSON 格式#
Altair 输出的基本图表表示形式是 JSON 字符串格式;Altair 提供的一个核心方法是 Chart.to_json()
,它返回一个表示图表内容的 JSON 字符串。此外,您可以使用 Chart.save()
将图表保存到 JSON 文件,方法是传递带有 .json
扩展名的文件名。
例如,在这里我们将一个简单的散点图保存为 JSON
import altair as alt
from vega_datasets import data
chart = alt.Chart(data.cars.url).mark_point().encode(
x='Horsepower:Q',
y='Miles_per_Gallon:Q',
color='Origin:N'
)
chart.save('chart.json')
生成文件的内容将看起来像这样
{
"$schema": "https://vega.github.io/schema/vega-lite/v5.json",
"config": {
"view": {
"continuousHeight": 300,
"continuousWidth": 300
}
},
"data": {
"url": "https://vega.github.io/vega-datasets/data/cars.json"
},
"encoding": {
"color": {
"field": "Origin",
"type": "nominal"
},
"x": {
"field": "Horsepower",
"type": "quantitative"
},
"y": {
"field": "Miles_per_Gallon",
"type": "quantitative"
}
},
"mark": {"type": "point"}
}
然后可以使用 vegaEmbed 库将此 JSON 插入到任何网页中。
HTML 格式#
如果您希望 Altair 负责为您处理 HTML 嵌入,您可以使用以下方式将图表直接保存到 HTML 文件中
chart.save('chart.html')
这将创建一个简单的 HTML 模板页面,加载 Vega、Vega-Lite 和 vegaEmbed,以便在浏览器中打开时图表能够渲染。
例如,将上面的散点图保存为 HTML 会创建一个包含以下内容的文件,该文件可以在任何支持 javascript 的现代网页浏览器中打开和渲染
<!DOCTYPE html>
<html>
<head>
<script src="https://cdn.jsdelivr.net.cn/npm/vega@5"></script>
<script src="https://cdn.jsdelivr.net.cn/npm/vega-lite@5"></script>
<script src="https://cdn.jsdelivr.net.cn/npm/vega-embed@6"></script>
</head>
<body>
<div id="vis"></div>
<script type="text/javascript">
var spec = {
"$schema": "https://vega.github.io/schema/vega-lite/v5.json",
"config": {
"view": {
"continuousHeight": 300,
"continuousWidth": 300
}
},
"data": {
"url": "https://vega.github.io/vega-datasets/data/cars.json"
},
"encoding": {
"color": {
"field": "Origin",
"type": "nominal"
},
"x": {
"field": "Horsepower",
"type": "quantitative"
},
"y": {
"field": "Miles_per_Gallon",
"type": "quantitative"
}
},
"mark": {"type": "point"}
};
var opt = {"renderer": "canvas", "actions": false};
vegaEmbed("#vis", spec, opt);
</script>
</body>
</html>
您可以在此处查看结果:chart.html。
默认情况下,vegaEmbed 中使用 canvas
渲染可视化。要更改为 svg
渲染,请按如下方式使用 embed_options
chart.save('chart.html', embed_options={'renderer':'svg'})
注意
这与 alt.renderers.enable('svg')
不同,后者在 Jupyter notebook 中将图表渲染为静态 svg
图像。
离线 HTML 支持#
默认情况下,由 chart.save('chart.html')
生成的 HTML 文件从在线 CDN 位置加载必要的 JavaScript 依赖项。这会生成一个小的 HTML 文件,但这意味着显示图表需要活动的互联网连接。
作为替代方案,可以向 chart.save
提供 inline=True
关键字参数,以生成包含所有必要 JavaScript 依赖项的 HTML 文件。这会导致文件大小变大,但以这种方式生成的 HTML 文件无需活动的互联网连接即可显示。
chart.save('chart.html', inline=True)
注意
调用带有 inline=True
的 chart.save
需要附加依赖项。
PNG、SVG 和 PDF 格式#
要将 Altair 图表对象保存为 PNG、SVG 或 PDF 图像,可以使用
chart.save('chart.png')
chart.save('chart.svg')
chart.save('chart.pdf')
注意
将图表保存为图像需要附加依赖项,通过运行解释 Vega-Lite 规范并以图像形式输出所需的 javascript 代码来完成。
altair_saver#
注意
altair_saver 在 Altair 4 及更早版本中使用。它不再维护,已被提供卓越用户体验和性能的 vl-convert 所取代。
PNG 图形尺寸/分辨率#
使用 chart.save()
创建 PNG 图像时,生成图像的分辨率默认为每英寸 72 像素 (ppi)。要在保持相同物理尺寸的同时更改图像的分辨率,可以向 chart.save
提供 ppi
参数。例如,以每英寸 200 像素的分辨率保存图像
chart.save('chart.png', ppi=200)
要在保持分辨率的同时更改生成图像的物理尺寸,可以使用 scale_factor
参数。例如,以默认的 72 ppi 分辨率将图像保存为默认大小的两倍
chart.save('chart.png', scale_factor=2)
附加依赖项#
将图表保存为图像或离线 HTML 文件需要 vl-convert 包
conda install -c conda-forge vl-convert-python
或
pip install vl-convert-python
vl-convert 不需要任何外部依赖项。有关信息和已知的限制,请参阅 vl-convert 文档。