ipython笔记本水平排列图

时间:2014-02-13 13:00:18

标签: python matplotlib ipython-notebook

目前,在ipython笔记本中创建两个连续图时,它们会一个在另一个下面显示:

enter image description here

我想知道是否有任何方法让它们按行显示,直到窗口中的空间用完为止。因此对于前两个图,输出将如下所示:

enter image description here

我意识到我可以通过在网格中排列子图来做类似的事情,但我想知道是否可以自动执行此操作以便在空间用完时将图形包裹到下一个“线”上?

5 个答案:

答案 0 :(得分:5)

这适用于Python 3.5,Jupyter 4.4.0。

情节"流动"当您调整浏览器窗口大小时,填充水平空间。

情节也可以是不同的尺寸(尝试替换import matplotlib.pyplot as plt import numpy as np from IPython.display import HTML import io import base64 class FlowLayout(object): ''' A class / object to display plots in a horizontal / flow layout below a cell ''' def __init__(self): # string buffer for the HTML: initially some CSS; images to be appended self.sHtml = """ <style> .floating-box { display: inline-block; margin: 10px; border: 3px solid #888888; } </style> """ def add_plot(self, oAxes): ''' Saves a PNG representation of a Matplotlib Axes object ''' Bio=io.BytesIO() # bytes buffer for the plot fig = oAxes.get_figure() fig.canvas.print_png(Bio) # make a png of the plot in the buffer # encode the bytes as string using base 64 sB64Img = base64.b64encode(Bio.getvalue()).decode() self.sHtml+= ( '<div class="floating-box">'+ '<img src="data:image/png;base64,{}\n">'.format(sB64Img)+ '</div>') def PassHtmlToCell(self): ''' Final step - display the accumulated HTML ''' display(HTML(self.sHtml)) oPlot = FlowLayout() # create an empty FlowLayout # Some fairly regular plotting from Matplotlib gX = np.linspace(-5,5,100) # just used in the plot example for i in range(10): # plot 10 charts fig, ax = plt.subplots(1, 1, figsize=(3,2)) # same size plots # figsize=(3+i/3,2+i/4)) # different size plots ax.plot(gX, np.sin(gX*i)) # make your plot here oPlot.add_plot(ax) # pass it to the FlowLayout to save as an image plt.close() # this gets rid of the plot so it doesn't appear in the cell oPlot.PassHtmlToCell() - 请参阅下面的第二张图片)

(刚刚意识到这个问题有多久了;我定期查看同样的事情。我承认代码是从其他网络示例拼凑而成的,但我现在已经丢失了参考资料)

{{1}}

Charts in Flow Layout

Plots of varying size

答案 1 :(得分:3)

是的,你可以这样做:

In [3]: import numpy as np
   ...: xs = np.linspace(0,100,100)
   ...: fig, axs = plt.subplots(nrows=1, ncols=2)
   ...: axs[0].plot(xs, xs * xs)
   ...: axs[1].plot(xs, np.sqrt(xs))
   ...: 

输出:

enter image description here

答案 2 :(得分:1)

由于这个问题是在很久以前提出的,所以我将为那些通过搜索引擎找到该问题的人提出一个更新的解决方案。

由于Jupyter已在很大程度上取代了IPython笔记本并且Jupyter Lab已计划取代Jupyter,因此我的解决方案已在Jupyter Lab 0.35.4中实现。

在这种环境下,我发现评估读取以下内容的单元格非常有用:

%%html

<style>
    .jp-OutputArea-child {
        display: inline-block;
    }
</style>

通过允许输出区域(尤其是地块)并排浮动,可以更好地利用垂直空间。我希望这是默认行为。

浏览器当前不支持CSS父选择器,但是根据selectors level 4 working draft,如果浏览器开始支持CSS父选择器,则最好使用以下内容:

%%html

<style>
    .jp-OutputArea-child:has(> .jp-RenderedImage) {
        display: inline-block;
    }
</style>

答案 3 :(得分:1)

现在这适用于 ipywidgets

# Select ipywidget output for matplotlib
%matplotlib widget

import matplotlib.pyplot as plt
import ipywidgets
import numpy as np

xs = np.linspace(0, 100, 100)

# Capture each plot in an Output object instead of displaying outright
output1 = ipywidgets.Output()
with output1:
    # Restrict the size, otherwise the full horizontal space will be taken
    fig, axes = plt.subplots(constrained_layout=True, figsize=(4, 3))
    fig.canvas.toolbar_position = 'bottom'
    axes.plot(xs, xs * xs)
    
output2 = ipywidgets.Output()
with output2:
    fig, axes = plt.subplots(constrained_layout=True, figsize=(4, 3))
    fig.canvas.toolbar_position = 'bottom'
    axes.plot(xs, np.sqrt(xs))

output3 = ipywidgets.Output()
with output3:
    fig, axes = plt.subplots(constrained_layout=True, figsize=(4, 3))
    fig.canvas.toolbar_position = 'bottom'
    axes.plot(xs, xs)

现在您可以使用带有环绕布局的 HBox 并排显示图形:

Using HBox to display figures side by side

有关使用 matplotlib 和 https://kapernikov.com/ipywidgets-with-matplotlib/ 的更多示例,请参阅 https://stackoverflow.com/a/60174258/450068

答案 4 :(得分:0)

非常确定没有子图或网格图方法就没有这样做。对于地图尺寸,您可以使用ax[0].axes([.65, .6, .2, .2])plt.subplots(1, 2, figuresize=(12,4))指定尺寸。不幸的是,这就是matplotlib的设置方式。如果使用解释器,则可以调整GUI的大小。