Python се използва широко за анализ на данни, машинно обучение, уеб скрапинг и много други. Но знаете ли, че можете също да изпълнявате код на Python в HTML, за да създавате уеб приложения?

PyScript прави това възможно, като ви позволява да изпълнявате код на Python в браузър. Научете как да добавяте визуализации на matplotlib към уеб страница с помощта на няколко PyScript-HTML примера.

Какво е PyScript?

PyScript е уеб рамка с отворен код, която ви позволява да стартирате Python в уеб браузъра. Той интегрира HTML интерфейса и силата на Pyodide, WASM и модерните уеб технологии. PyScript в момента е във фаза на разработка, но вече има някои вълнуващи функции. Потенциално може да се превърне в инструмент за създаване на мощни уеб приложения.

Кодът, използван в този проект, е наличен в a GitHub хранилище и е безплатен за използване под лиценза на MIT. Ако искате да разгледате версия на живо на този проект, можете да разгледате линия и барплот демонстрации.

Настройте HTML Boilerplate

Преди да използвате PyScript, трябва да настроите нещата. Създайте нов HTML файл и настройте HTML шаблона. Повечето

instagram viewer
модерни IDE предоставят функционалност за автоматично създаване на шаблони. Трябва само да напишете док или html и натиснете enter. Можете също да използвате следния шаблон, за да започнете:

<!DOCTYPE html>
<html>
<глава>
<мета charset="utf-8">
<мета http-equiv="X-UA-съвместим" съдържание="IE=ръб">
<заглавие></title>
<мета име="описание" съдържание="">
<мета име="прозорец за изглед" съдържание="ширина=ширина на устройството, начален мащаб=1">
</head>
<тяло>
</body>
</html>

Добавете PyScript към HTML: „Здравей, свят!“ Използване на PyScript

Можете да използвате PyScript във вашия HTML файл, като го изтеглите или свържете неговия CDN във вашата HTML глава. Добавете следното в раздел на вашия HTML файл:

<връзка rel="таблица със стилове" href="https://pyscript.net/alpha/pyscript.css" />
<скрипт defer src="https://pyscript.net/alpha/pyscript.js"></script>

Това е всичко, което трябва да направите, за да настроите PyScript.

За да проверите дали PyScript е интегриран успешно, добавете следния ред код в раздел:

<тяло>
<py-скрипт>печат ("Здравей свят!")</py-script>
</body>

Отворете HTML файла във всеки уеб браузър и ще видите Здравей свят! отпечатани там.

Заредете Matplotlib библиотека

Трябва да използвате тагове за импортиране на Python модули. Заредете matplotlib модул в раздел на вашия HTML файл, като използвате следния фрагмент:

<py-env>
 - matplotlib
</py-env>

Показване на линейна графика в браузъра с помощта на PyScript

Създавам с ан документ за самоличност. Ще имате нужда от документ за самоличност да го използвате с изход атрибут на етикет.

<div id="matplotlib-lineplot"></div>

Трябва да напишете кода на Python в етикет. Задайте горното документ за самоличност към изход атрибут на етикет.

<py-script output="matplotlib-lineplot">
# Код на Python
</py-script>

Вече сте готови да напишете кода на Python, за да създадете линейна графика:

<тяло>
<div id="matplotlib-lineplot"></div>
<py-script output="matplotlib-lineplot">
# Код на Python
# импортиране на библиотеката matplotlib
импортиране matplotlib.pyplot като плт
 fig, ax = plt.subplots()
# ос x
 x = ["Python", "C++", "JavaScript", "Голанг"]
# ос y
 y = [10, 5, 9, 7]
 plt.plot (x, y, маркер='о', linestyle='-', цвят='b')
# Наименуване на x-етикета
 plt.xlabel('език')
# Наименуване на y-етикета
 plt.ylabel('резултат')
# Назоваване на заглавието на сюжета
 plt.title('Език срещу резултат')
 фиг
</py-script>
</body>

Ще получите изобразена следната фигура, когато отворите HTML файла в уеб браузъра:

Показване на лентова графика в браузъра с помощта на PyScript

Можете да създадете лентова графика в браузъра, като използвате следния фрагмент на Python:

<тяло>
<div id="matplotlib-bar"></div>
<py-script output="matplotlib-bar">
# Код на Python
# импортиране на библиотеката matplotlib
импортиране matplotlib.pyplot като плт
 fig, ax = plt.subplots()
# ос x
 x = ["Python", "C++", "JavaScript", "Голанг"]
# ос y
 y = [10, 5, 9, 7]
плт.bar(х, г)
# Наименуване на x-етикета
 plt.xlabel('език')
# Наименуване на y-етикета
 plt.ylabel('резултат')
# Назоваване на заглавието на сюжета
 plt.title('Език срещу резултат')
 фиг
</py-script>
</body>

Този код произвежда следния изход:

Какво бъдеще крие PyScript?

Можете да създавате мощни табла за управление и диаграми в HTML, като използвате библиотеки на PyScript и Python като Matplotlib, Bokeh, Seaborn и т.н. Вероятно обаче трябва да се въздържате от използването му в производството, тъй като е в тежка разработка. В момента софтуерът има множество проблеми, включително времето за зареждане и използваемостта. В бъдеще PyScript може да отвори врати за по-гладко изпълнение и изпълнение на операции на Python в мрежата.

Една от основните причини да разработим PyScript беше да помогнем на учените да визуализират данните в мрежата. Ако сте специалист по данни, можете да се възползвате от силата на PyScript, като го комбинирате с библиотеки за наука за данни като Pandas и NumPy.