在 Jupyter Notebooks 中呈现交互式 Pygal 图表答案

【问题标题】：Interactive Pygal charts render in Jupyter Notebooks在 Jupyter Notebooks 中呈现交互式 Pygal 图表
【发布时间】：2019-04-02 14:12:03
【问题描述】：

我正在尝试在 Jupyter Notebook 中渲染交互式 Pygal 图表，但没有成功。我不是在寻找效果很好的图像静态版本解决方案，而是寻找具有交互式工具提示的解决方案。

这个问题之前已经解决了：

但不幸的是，没有人遇到我的问题：实施这些链接中提供的解决方案 Jupyter 似乎无法正确呈现图表，而是 output 是一个非常长的字符串。不会产生错误。

我错过了什么？

【问题讨论】：

嗯，这是一个令人头疼的问题。你使用的是什么版本的 pygal 和 jupyter？您使用的是 jupyter 笔记本还是实验室？
我使用的是 Python 2.7.15（来自 Jupyter 中的 sys.version）和 Jupyter 4.4.0（笔记本）。你是对的，这是一个真正令人头疼的问题，我一直在尝试不同的设置，但到目前为止没有运气......

标签： python charts jupyter-notebook render pygal

【解决方案1】：

我不会假装理解为什么，但是切换到 Unicode 字符串可以解决问题。这可能是其他人遇到此问题的原因：在 Python 3 中，默认情况下所有字符串都是 Unicode。

您需要通过在字符串前面加上 u 前缀来将您的模板声明为 Unicode 文字。然后通过将is_unicode=True 作为参数传递给render 函数来告诉pygal 在呈现图表时返回Unicode。

一个例子：

from IPython.display import HTML
import pygal

html_pygal = u"""
    <!DOCTYPE html>
    <html>
        <head>
            <script type="text/javascript" src="http://kozea.github.com/pygal.js/javascripts/svg.jquery.js"></script>
            <script type="text/javascript" src="http://kozea.github.com/pygal.js/javascripts/pygal-tooltips.js"></script>
        </head>
        <body><figure>{pygal_render}</figure></body>
    </html>
"""

line_chart = pygal.Line()
line_chart.title = "Browser usage evolution (in %)"
line_chart.x_labels = map(str, range(2002, 2013))
line_chart.add("Firefox", [None, None, 0, 16.6, 25, 31, 36.4, 45.5, 46.3, 42.8, 37.1])
line_chart.add("Chrome", [None, None, None, None, None, None, 0, 3.9, 10.8, 23.8, 35.3])
line_chart.add("IE", [85.8, 84.6, 84.7, 74.5, 66, 58.6, 54.7, 44.8, 36.2, 26.6, 20.1])
line_chart.add("Others", [14.2, 15.4, 15.3, 8.9, 9, 10.4, 8.9, 5.8, 6.7, 6.8, 7.5])
HTML(html_pygal.format(pygal_render=line_chart.render(is_unicode=True)))

【讨论】：