web-dev-qa-db-ja.com

HTMLをiPython出力に埋め込む方法は？

レンダリングされたHTML出力をiPython出力に埋め込むことは可能ですか？

一つの方法は

from IPython.core.display import HTML
HTML('<a href="http://example.com">link</a>')

または（IPython複数行セルエイリアス）

%%html
<a href="http://example.com">link</a>

フォーマットされたリンクを返しますが、

  1. このリンクでは、Webページ自体がコンソールであるブラウザーは開きません。ただし、IPythonノートブックは正直なレンダリングをサポートしています。
  2. たとえば、リストやpandas印刷テーブル内でHTML()オブジェクトをレンダリングする方法については知りません。 df.to_html()を実行できますが、セル内にリンクを作成する必要はありません。
  3. この出力は、PyCharm Pythonコンソールではインタラクティブではありません（QTではないため）。

どうすればこれらの欠点を克服し、iPython出力をもう少しインタラクティブにすることができますか？

pythonhtmlipythonjupyter-notebook
108
Anton Tarasenko

これは私のために働くようです：

from IPython.core.display import display, HTML
display(HTML('<h1>Hello, world!</h1>'))

秘Theは、「ディスプレイ」にもラップすることです。

ソース： http://python.6.x6.nabble.com/Printing-HTML-within-IPython-Notebook-IPython-specific-prettyprint-tp5016624p5016631.html

165
Harmon

少し前に、Jupyter NotebooksがHTMLコンテンツ[ ＃3118 ]からJavaScriptの除去を開始しました。次の2つのソリューションがあります。

ローカルHTMLの提供

JavaScriptを含むHTMLページをすぐにページに埋め込む場合、最も簡単な方法は、HTMLファイルをノートブックのディレクトリに保存し、次のようにHTMLをロードすることです。

from IPython.display import IFrame

IFrame(src='./Nice.html', width=700, height=600)

リモートHTMLの提供

ホスト型ソリューションを希望する場合は、S3のAmazon Webサービス「バケット」にHTMLページをアップロードできます。 そのバケットの設定を変更します バケットを静的Webサイトにホストしてから、ノートブックのIframeコンポーネント：

from IPython.display import IFrame

IFrame(src='https://s3.amazonaws.com/duhaime/blog/visualizations/isolation-forests.html', width=700, height=600)

これにより、他のWebページと同様に、HTMLコンテンツとJavaScriptがiframeにレンダリングされます。

<iframe src='https://s3.amazonaws.com/duhaime/blog/visualizations/isolation-forests.html', width=700, height=600></iframe>
11
duhaime

関連：クラスの構築中に、def _reper_html_(self): ...を使用して、そのインスタンスのカスタムHTML表現を作成できます。

class Foo:
    def _repr_html_(self):
        return "Hello <b>World</b>!"

o = Foo()
o

次のようにレンダリングされます：

こんにちはWorld！

詳細については、 IPythonのドキュメント を参照してください。

高度な例：

from html import escape # Python 3 only :-)

class Todo:
    def __init__(self):
        self.items = []

    def add(self, text, completed):
        self.items.append({'text': text, 'completed': completed})

    def _repr_html_(self):
        return "<ol>{}</ol>".format("".join("<li>{} {}</li>".format(
            "☑" if item['completed'] else "☐",
            escape(item['text'])
        ) for item in self.items))

my_todo = Todo()
my_todo.add("Buy milk", False)
my_todo.add("Do homework", False)
my_todo.add("Play video games", True)

my_todo

レンダリングします：

  1. milk牛乳を買う
  2. home宿題をする
  3. videoビデオゲームをプレイする
9
Udi

上記の@Harmonを展開すると、必要に応じてdisplayステートメントとprintステートメントを組み合わせることができます...または、HTML全体を1つの文字列としてフォーマットし、表示を使用する方が簡単かもしれません。いずれにせよ、ニース機能。

display(HTML('<h1>Hello, world!</h1>'))
print("Here's a link:")
display(HTML("<a href='http://www.google.com' target='_blank'>www.google.com</a>"))
print("some more printed text ...")
display(HTML('<p>Paragraph text here ...</p>'))

このようなものを出力します：

こんにちは世界！

リンクは次のとおりです。

www.google.com

さらに印刷されたテキスト...

ここに段落テキスト...

7
Joseph True