ゼロからはじめるPython 第110回 ブラウザでPythonを動かすPyScriptでグラフを描こう

ブラウザ上でPythonを動かすライブラリPyScriptがとても便利だ。Pythonの便利機能をブラウザだけで利用できるため、ちょっとしたツールを配布する際にも便利だ。NumpyやPandasなど有名なライブラリも利用できる。今回は、PyScriptとMatplotlibを利用してブラウザ上でグラフを描画してみよう。

○PyScriptとは？

PyScriptとは、HTMLの中にPythonのスクリプトを書いて実行できる実行環境だ。Anacondaが開発しており「99%の人にプログラミングを提供すること」を目標に挙げている。

PyScriptが強力なのは、JavaScriptなどにコンパイルされて実行される訳ではなく、WASMを利用してC言語で実装されたPythonそのものをブラウザ上で動かしている点にある。これは、以前、本連載でも紹介したPyodide(https://pyodide.org/)をベースにして開発されており、効率的にPythonのプログラムを実行できる。Anacondaによる解説によると、下記のような仕組みとなっている。

なお、Pythonを使うメリットには、使いやすく便利なライブラリの存在が挙げられる。それで、PyScriptでも、Numpy、Pandas、Scikit-learnなど有用で有名なライブラリが利用できるよう配慮されている。

今回は、Pythonでグラフを描画するのに便利なライブラリMatplotlibを利用して、グラフを描画してみよう。
○PyScriptを使うには？

PyScriptで開発をするのに必要なのはブラウザだけだ。HTMLに以下のようなタグを記述すると、自動的にブラウザがPyScriptの実行エンジンをダウンロードして実行してくれる。以下が画面に「Hello, World!」と表示するだけの最も簡単なプログラムだ。

上記のコードを「hello.html」という名前で保存して、Webブラウザにドラッグ＆ドロップすると、次のように画面に「Hello, World!」と表示する。

HTMLのコードを確認してみよう。(＊1)では、PyScriptを使うために必要なコードだ。この二行のコードを記述することでPyScriptが利用可能になる。

そして、(＊2)の部分にPythonのプログラムを記述する。

packages = ["matplotlib"]

上記のHTMLコードを「sine.html」という名前で保存したら、Webブラウザにドラッグ＆ドロップしてみよう。すると、次のように表示される。

.