[Python]話題のPyScirptの使い方(動作確認)

目次

PyScriptとは

HTML上にPythonのコードを記載して実行できる環境が構築できます。

初めての方は前回のリンクを参考にしてみてください。

あわせて読みたい
[Python] 話題のPyScriptの使い方(初級編) PyScriptとは PyScriptという気になるものが発表されました。 これを使うことでWEBブラウザ上でPythonを実行できるようになります。 HTMLではJavaScriptが一般的ですが...

今回は実際にライブラリなどを呼び出して、ちゃんと動作するか確認してみます。

こちらの動画がとても分かりやすいので参考にしました。

標準ライブラリを使ってみる

  • sys

まずはPythonのバージョン確認もかねてsysをインポートしてみます。

<!DOCTYPE html>
<html lang="ja">
    <head>
        <meta charset="UTF-8">
        <title>PyScript TEST</title>
        <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
        <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
    </head>
    <body>
        <py-script>
            import sys
            print(f'バージョン:{sys.version_info}')
        </py-script>
    </body>
</html>

Pythonバージョンをprintで出力すると、以下のように表示されます。

  • datetime

次にdatetimeをインポートしてみます。現在時刻を表示してみます。

<!DOCTYPE html>
<html lang="ja">
    <head>
        <meta charset="UTF-8">
        <title>PyScript TEST</title>
        <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
        <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
    </head>
    <body>
        <py-script>
            import datetime
            print(datetime.datetime.now())
        </py-script>
    </body>
</html>

実行した日時が出力されました。

外部ライブラリを使ってみる

  • グラフ描画(Pandas+altair)

グラフ描画してみました。

外部ライブラリを使う場合には、<py-env>で指定することで利用できます。

<html>
    <head>
        <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
        <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
        <py-env>
            - altair
            - pandas
        </py-env>
    </head>
    <body>
        <h1>PyScript+Pandasグラフ表示</h1>
        <div id="test"></div>
        <py-script output="test"> 
import altair as alt
import pandas as pd

source = pd.DataFrame({
    'a': ['A', 'B', 'C', 'D', 'E'],
    'b': [10, 20, 30, 20, 10]
})

alt.Chart(source).mark_bar().encode(
    x='a',
    y='b'
)
        </py-script>
</html>

まとめ

ドキュメントを参考にちょっと触ってみた程度です。

面白いツールではありますが、やはりレスポンスがどうしても遅いのがネックですね。

今後のアップデートに期待したいです。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

コメント

コメントする

CAPTCHA


目次