0

我在 jupyter 笔记本上使用 altair，我试图将 pandas 数据帧转换为 json 文件，然后再将其传递给 Altair 图表。我想将最终图表保存为 html 文件。

import altair as alt
alt.renderers.enable('notebook')
alt.data_transformers.enable('json')
from vega_datasets import data

url = 'data.json'
cars = data.cars()
cars.to_json(url, orient='records')

charts1=alt.Chart(url).mark_circle(size=60).encode(
x='Horsepower:Q',
y='Miles_per_Gallon:Q',
color='Cylinders:O',
tooltip=['Name:Q', 'Origin:N', 'Horsepower:Q', 'Miles_per_Gallon:Q']
).interactive()

charts1.save('cars1.html')


charts2=alt.Chart(cars).mark_circle(size=60).encode(
x='Horsepower:Q',
y='Miles_per_Gallon:Q',
color='Cylinders:O',
tooltip=['Name:Q', 'Origin:N', 'Horsepower:Q', 'Miles_per_Gallon:Q']
).interactive()

charts2.save('cars2.html')

charts1 | charts2

chart1 和 charts2 在 jupyter notebook 中都正确显示，但是当我在浏览器中打开它时，只有 car2.html 正确显示。cars1.html 只是一个空的白框。我的语法错了吗？我在 python3.6，Altair 版本：'2.2.2'，Jupyter：'4.3.0'。

4

1 回答 1

3

对于chart1，数据存在于一个单独的文件 ( data.json) 中，并且该文件必须可供浏览器访问，以便浏览器在图表中呈现数据。如果无法访问数据文件（因为它位于错误的 URL，或者由于跨域问题），则结果将是一个空白图表。

要确定问题所在，请打开浏览器的 javascript 控制台并检查错误所在。

例如，如果您从file://URL 查看图表，如果您的浏览器具有严格的跨域策略，则可能无法访问数据。尝试通过本地网络服务器查看文件（您可以使用python -m http.server）。

于 2018-10-20T05:40:23.083 回答