जुपिटर नोटबुक में दो पांडा टेबल साइड की तरफ प्रदर्शित होते हैं


94

मेरे पास दो पांडा डेटाफ्रेम हैं और मैं उन्हें ज्यूपिटर नोटबुक में प्रदर्शित करना चाहूंगा।

कुछ ऐसा करना:

display(df1)
display(df2)

उन्हें एक दूसरे से नीचे दिखाता है:

यहां छवि विवरण दर्ज करें

मैं पहले के दाईं ओर एक दूसरा डेटाफ्रेम रखना चाहूंगा। नहीं है एक ऐसी ही सवाल , लेकिन ऐसा लगता है कि वहाँ की तरह एक व्यक्ति उन्हें उनके बीच के अंतर दिखाने का एक dataframe में विलय के साथ या तो संतुष्ट हो जाता है।

यह मेरे लिए काम नहीं करेगा। मेरे मामले में डेटाफ्रेम पूरी तरह से अलग (गैर-तुलनीय तत्वों) का प्रतिनिधित्व कर सकते हैं और उनमें से आकार भिन्न हो सकते हैं। इस प्रकार मेरा मुख्य लक्ष्य अंतरिक्ष को बचाना है।


मैंने जेक वेंडरपलास का समाधान पोस्ट किया। अच्छा साफ कोड।
प्राइवेट

जवाबों:


85

आप आउटपुट कोड के CSS को ओवरराइड कर सकते हैं। यह flex-direction: columnडिफ़ॉल्ट रूप से उपयोग करता है। इसे बदलने की कोशिश करें row। यहाँ एक उदाहरण है:

import pandas as pd
import numpy as np
from IPython.display import display, HTML

CSS = """
.output {
    flex-direction: row;
}
"""

HTML('<style>{}</style>'.format(CSS))

वृहद छवि

आप निश्चित रूप से, सीएसएस को अपनी इच्छानुसार अनुकूलित कर सकते हैं।

यदि आप केवल एक सेल के आउटपुट को लक्षित करना चाहते हैं, तो :nth-child()चयनकर्ता का उपयोग करने का प्रयास करें । उदाहरण के लिए, यह कोड नोटबुक में केवल 5 वीं सेल के आउटपुट के सीएसएस को संशोधित करेगा:

CSS = """
div.cell:nth-child(5) .output {
    flex-direction: row;
}
"""

5
यह समाधान सभी कोशिकाओं को प्रभावित करता है, मैं इसे केवल एक सेल के लिए कैसे कर सकता हूं?
jrovegno

2
@jrovegno मैंने आपके द्वारा अनुरोधित जानकारी को शामिल करने के लिए अपना उत्तर अपडेट किया।
ज़ारक

1
@ntg आपको यह सुनिश्चित करने की आवश्यकता है कि HTML('<style>{}</style>'.format(CSS))सेल में अंतिम पंक्ति है (और nth-child selector का उपयोग करना न भूलें)। हालाँकि, यह स्वरूपण के साथ समस्याएँ पैदा कर सकता है, इसलिए आपका समाधान बेहतर है। (+1)
झारक

1
@zarak Thanx तरह के शब्दों के लिए :) आपके समाधान में, आप HTML ('<style> {} </ HTML) के बजाय प्रदर्शन (HTML (' <style> {} </ style> ') स्वरूप (CSS) कर सकते हैं। शैली> '। स्वरूप (सीएसएस))। फिर यह किसी भी स्थान पर हो सकता है। मैं अभी भी nth सेल के साथ समस्या थी (हालांकि, अगर मैं कॉपी पेस्ट करता हूँ, n बदल सकता है)
ntg

4
HTML('<style>.output {flex-direction: row;}</style>')सादगी के लिए
थॉमस मैथ्यू

114

मैंने एक फ़ंक्शन लिखना समाप्त कर दिया है जो यह कर सकता है:

from IPython.display import display_html
def display_side_by_side(*args):
    html_str=''
    for df in args:
        html_str+=df.to_html()
    display_html(html_str.replace('table','table style="display:inline"'),raw=True)

उदाहरण का उपयोग:

df1 = pd.DataFrame(np.arange(12).reshape((3,4)),columns=['A','B','C','D',])
df2 = pd.DataFrame(np.arange(16).reshape((4,4)),columns=['A','B','C','D',])
display_side_by_side(df1,df2,df1)

यहां छवि विवरण दर्ज करें


यह वास्तव में बहुत अच्छा है, धन्यवाद। आपको लगता है कि प्रत्येक आउटपुट के ऊपर डेटा फ़्रेम नाम जोड़ना कितना आसान या अन्यथा होगा?
रिकी मैकमास्टर

1
दो समस्याएं होंगी: 1. डेटाफ्रेम के नामों की जानकारी स्कोप imho stackoverflow.com/questions/2749796/… से बाहर है, लेकिन stackoverflow.com/questions/218616/… , या उन्हें पारित करने के लिए कर सकते हैं ) 2. आप अतिरिक्त एचटीएमएल और की आवश्यकता होगी अपनी खुली समाप्त हो गया / ऊपर आप क्या करना है ... यहाँ कैसे इस हिस्से दिखाई दे सकता है के आधार उदाहरण है: i.stack.imgur.com/mIVsD.png
NTG

आपके उत्तर के लिए धन्यवाद, मैंने हेडर को इस तरह जोड़ा है जैसा आपने अपनी पिछली टिप्पणी में वर्णित किया है।
एंटनी हैचकिंस

अद्भुत जवाब। यह वही है जिसकी मुझे तलाश है। मैं अभी भी इसके चारों ओर अपना रास्ता सीख रहा हूं, इसलिए मैं जानना चाहता हूं: 1) आपने *argsसिर्फ इसके बजाय क्यों इस्तेमाल किया df? क्या यह इसलिए है क्योंकि आपके पास कई इनपुट हो सकते हैं *args? 2) आपके फ़ंक्शन का कौन सा भाग 2 और बाद के df को नीचे के बजाय पहले वाले के दाईं ओर जोड़ता है? क्या यह 'table style="display:inline"'हिस्सा है? फिर से धन्यवाद
बोवेन लियू

1
आपके महान समाधान के लिए धन्यवाद! यदि आप उन्हें प्रदर्शित करने से पहले अपने डेटाफ़्रेम को स्टाइल करना चाहते हैं, तो इनपुट एस होगा Styler, DataFrameएस नहीं । इस मामले में, के html_str+=df.render()बजाय का उपयोग करें html_str+=df.to_html()
मार्टिन बेकर 19

35

pandas 0.17.1DataFrames के विज़ुअलाइज़ेशन से शुरू करके पंडों की स्टाइलिंग विधियों के साथ सीधे संशोधित किया जा सकता है

दो DataFrames को साथ-साथ प्रदर्शित करने के लिए आपको ntg उत्तर में सुझाए set_table_attributesगए तर्क के साथ उपयोग करना चाहिए । यह दो वस्तुओं को लौटाएगा । गठबंधन किए गए डेटाफ्रेम को प्रदर्शित करने के लिए बस आईपीथॉन से विधि के माध्यम से उनके सम्मिलित एचटीएमएल प्रतिनिधित्व को पास करें ।"style='display:inline'"Stylerdisplay_html

इस विधि के साथ अन्य स्टाइल विकल्पों को जोड़ना भी आसान है। कैप्शन जोड़ने का तरीका यहां बताया गया है :

import numpy as np
import pandas as pd   
from IPython.display import display_html 

df1 = pd.DataFrame(np.arange(12).reshape((3,4)),columns=['A','B','C','D',])
df2 = pd.DataFrame(np.arange(16).reshape((4,4)),columns=['A','B','C','D',])

df1_styler = df1.style.set_table_attributes("style='display:inline'").set_caption('Caption table 1')
df2_styler = df2.style.set_table_attributes("style='display:inline'").set_caption('Caption table 2')

display_html(df1_styler._repr_html_()+df2_styler._repr_html_(), raw=True)

संरेखित डेटाफ्रेम पंडों स्टाइलर कैप्शन के साथ


15

गिबोन के दृष्टिकोण (स्टाइल और कैप्शन सेट करने के लिए) और स्टेवी (स्पेस को जोड़ते हुए) के संयोजन से मैंने अपने फंक्शन का संस्करण बनाया, जो पांडा डेटाफ्रेम को टेबल साइड-बाय-साइड के रूप में आउटपुट करता है:

from IPython.core.display import display, HTML

def display_side_by_side(dfs:list, captions:list):
    """Display tables side by side to save vertical space
    Input:
        dfs: list of pandas.DataFrame
        captions: list of table captions
    """
    output = ""
    combined = dict(zip(captions, dfs))
    for caption, df in combined.items():
        output += df.style.set_table_attributes("style='display:inline'").set_caption(caption)._repr_html_()
        output += "\xa0\xa0\xa0"
    display(HTML(output))

उपयोग:

display_side_by_side([df1, df2, df3], ['caption1', 'caption2', 'caption3'])

आउटपुट:

यहां छवि विवरण दर्ज करें


11

यहां जेक वांडरप्लस का समाधान है जो मैं दूसरे दिन आया था:

import numpy as np
import pandas as pd

class display(object):
    """Display HTML representation of multiple objects"""
    template = """<div style="float: left; padding: 10px;">
    <p style='font-family:"Courier New", Courier, monospace'>{0}</p>{1}
    </div>"""

    def __init__(self, *args):
        self.args = args

    def _repr_html_(self):
        return '\n'.join(self.template.format(a, eval(a)._repr_html_())
                     for a in self.args)

    def __repr__(self):
       return '\n\n'.join(a + '\n' + repr(eval(a))
                       for a in self.args)

श्रेय: https://github.com/jakevdp/PythonDataScienceHandbook/blob/master/notebooks/03.08-Aggregation-and-Grouping.ipynb


1
क्या आप कृपया इसका उत्तर बता सकते हैं। Jake VanderPlas ने अपनी वेबसाइट पर इसकी व्याख्या नहीं की है। यह एकमात्र समाधान है जो शीर्ष पर डेटासेट नाम प्रिंट करता है।
गौरव सिंघल

तुम क्या जानना चाहते हो?
निजी

सभी कार्यों का विवरण हो सकता है / वे कैसे काम करते हैं, उन्हें कैसे कहा जाता है ... ताकि नौसिखिया अजगर प्रोग्रामर इसे ठीक से समझ सकें।
गौरव सिंघल

10

मेरा समाधान सिर्फ HTML में बिना CSS हैक्स के एक तालिका बनाता है और इसे आउटपुट करता है:

import pandas as pd
from IPython.display import display,HTML

def multi_column_df_display(list_dfs, cols=3):
    html_table = "<table style='width:100%; border:0px'>{content}</table>"
    html_row = "<tr style='border:0px'>{content}</tr>"
    html_cell = "<td style='width:{width}%;vertical-align:top;border:0px'>{{content}}</td>"
    html_cell = html_cell.format(width=100/cols)

    cells = [ html_cell.format(content=df.to_html()) for df in list_dfs ]
    cells += (cols - (len(list_dfs)%cols)) * [html_cell.format(content="")] # pad
    rows = [ html_row.format(content="".join(cells[i:i+cols])) for i in range(0,len(cells),cols)]
    display(HTML(html_table.format(content="".join(rows))))

list_dfs = []
list_dfs.append( pd.DataFrame(2*[{"x":"hello"}]) )
list_dfs.append( pd.DataFrame(2*[{"x":"world"}]) )
multi_column_df_display(2*list_dfs)

उत्पादन


9

यह @ nts के उत्तर में हेडर जोड़ता है:

from IPython.display import display_html

def mydisplay(dfs, names=[]):
    html_str = ''
    if names:
        html_str += ('<tr>' + 
                     ''.join(f'<td style="text-align:center">{name}</td>' for name in names) + 
                     '</tr>')
    html_str += ('<tr>' + 
                 ''.join(f'<td style="vertical-align:top"> {df.to_html(index=False)}</td>' 
                         for df in dfs) + 
                 '</tr>')
    html_str = f'<table>{html_str}</table>'
    html_str = html_str.replace('table','table style="display:inline"')
    display_html(html_str, raw=True)

यहां छवि विवरण दर्ज करें


यह बहुत उपयोगी लगता है, लेकिन मुझे एक समस्या देता है। के लिए mydisplay((df1,df2))केवल देता df.to_html(index=False) df.to_html(index=False)dataframe सामग्री के बजाय। इसके अलावा, अतिरिक्त '}' साइन इन f'string 'है।

कुछ असंबंधित लेकिन क्या आपके फ़ंक्शन को संशोधित करना संभव है ताकि सेल आउटपुट के लिए कोड छिपा हो?
alpenmilch411

1
@ alpenmilch411 "इनपुट छिपाएँ" एक्सटेंशन देखें
एंटनी हैचकिंस

किसी भी विचार कैसे इस के लिए एक 'max_rows' जोड़ने के लिए?
टिकॉन

2

मैंने एचबीओएक्स का उपयोग करके समाप्त किया

import ipywidgets as ipyw

def get_html_table(target_df, title):
    df_style = target_df.style.set_table_attributes("style='border:2px solid;font-size:10px;margin:10px'").set_caption(title)
    return df_style._repr_html_()

df_2_html_table = get_html_table(df_2, 'Data from Google Sheet')
df_4_html_table = get_html_table(df_4, 'Data from Jira')
ipyw.HBox((ipyw.HTML(df_2_html_table),ipyw.HTML(df_4_html_table)))

2

गिबोन के जवाब ने मेरे लिए काम किया! यदि आप चाहते हैं कि तालिकाओं के बीच अतिरिक्त स्थान उसके द्वारा प्रस्तावित कोड पर जाए और "\xa0\xa0\xa0"इसे निम्नलिखित कोड लाइन में जोड़ दें ।

display_html(df1_styler._repr_html_()+"\xa0\xa0\xa0"+df2_styler._repr_html_(), raw=True)

2

मैंने यासीन के सुरुचिपूर्ण जवाब में कुछ अतिरिक्त कार्यक्षमता जोड़ने का फैसला किया, जहां कोई भी कॉल और पंक्तियों की संख्या चुन सकता है ; किसी भी अतिरिक्त dfs को तब तल पर जोड़ा जाता है। इसके अतिरिक्त, कोई भी ग्रिड को भरने के लिए चुन सकता है (केवल आवश्यकतानुसार कीवर्ड को 'कॉल' या 'पंक्तियों में बदलें')

import pandas as pd
from IPython.display import display,HTML

def grid_df_display(list_dfs, rows = 2, cols=3, fill = 'cols'):
    html_table = "<table style='width:100%; border:0px'>{content}</table>"
    html_row = "<tr style='border:0px'>{content}</tr>"
    html_cell = "<td style='width:{width}%;vertical-align:top;border:0px'>{{content}}</td>"
    html_cell = html_cell.format(width=100/cols)

    cells = [ html_cell.format(content=df.to_html()) for df in list_dfs[:rows*cols] ]
    cells += cols * [html_cell.format(content="")] # pad

    if fill == 'rows': #fill in rows first (first row: 0,1,2,... col-1)
        grid = [ html_row.format(content="".join(cells[i:i+cols])) for i in range(0,rows*cols,cols)]

    if fill == 'cols': #fill columns first (first column: 0,1,2,..., rows-1)
        grid = [ html_row.format(content="".join(cells[i:rows*cols:rows])) for i in range(0,rows)]

    display(HTML(html_table.format(content="".join(grid))))

    #add extra dfs to bottom
    [display(list_dfs[i]) for i in range(rows*cols,len(list_dfs))]

list_dfs = []
list_dfs.extend((pd.DataFrame(2*[{"x":"hello"}]), 
             pd.DataFrame(2*[{"x":"world"}]), 
             pd.DataFrame(2*[{"x":"gdbye"}])))

grid_df_display(3*list_dfs)

परीक्षण उत्पादन


0

एंटनी के उत्तर का विस्तार यदि आप पंक्ति द्वारा ब्लॉक के कुछ अंक के लिए तालिकाओं के दृश्य को सीमित करना चाहते हैं, तो अधिकतम चर का उपयोग करें।यहां छवि विवरण दर्ज करें

def mydisplay(dfs, names=[]):

    count = 0
    maxTables = 6

    if not names:
        names = [x for x in range(len(dfs))]

    html_str = ''
    html_th = ''
    html_td = ''

    for df, name in zip(dfs, names):
        if count <= (maxTables):
            html_th += (''.join(f'<th style="text-align:center">{name}</th>'))
            html_td += (''.join(f'<td style="vertical-align:top"> {df.to_html(index=False)}</td>'))
            count += 1
        else:
            html_str += f'<tr>{html_th}</tr><tr>{html_td}</tr>'
            html_th = f'<th style="text-align:center">{name}</th>'
            html_td = f'<td style="vertical-align:top"> {df.to_html(index=False)}</td>'
            count = 0


    if count != 0:
        html_str += f'<tr>{html_th}</tr><tr>{html_td}</tr>'


    html_str += f'<table>{html_str}</table>'
    html_str = html_str.replace('table','table style="display:inline"')
    display_html(html_str, raw=True)
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.