使用PyScript在Web上运行Python可视化
PyScript 是一个开源框架,可让您直接在 Web 浏览器中运行 Python 代码,从而可以使用 Python 为后端和前端创建交互式 Web 应用程序。该框架弥合了 Python 和 JavaScript 之间的差距,使开发人员能够在 Web 环境中利用 Python 的数据分析、机器学习和可视化库的强大功能
利用 Python 对数据分析和可视化的一流支持来美化您的网页。Python 广泛用于数据分析、机器学习、网页抓取等。但您是否知道,您也可以在 HTML 中运行 Python 代码来构建 Web 应用程序?PyScript 使这成为可能,它允许您在浏览器中运行 Python 代码。本文晓得博客为你解释使用PyScript在Web上运行Python可视化借助几个 PyScript-HTML 示例,了解如何将 matplotlib 可视化添加到网页。
PyScript 是什么?
PyScript 是一个开源 Web 框架, 可让您在 Web 浏览器中运行 Python。它集成了 HTML 界面以及 Pyodide、WASM 和现代 Web 技术的强大功能。PyScript 目前处于开发阶段,但它已经具有一些令人兴奋的功能。它有可能成为创建强大 Web 应用程序的工具。
该项目使用的代码可在 GitHub 存储库中找到 ,并可在 MIT 许可下免费使用。如果您想查看该项目的实时版本,可以查看 线图 和 条形图 演示。
设置 HTML 样板
在使用 PyScript 之前,您需要进行设置。创建一个新的 HTML 文件并设置 HTML 样板。大多数 现代 IDE 都提供自动创建样板的功能。您只需输入 doc 或 html 并按回车键即可。您也可以使用以下模板开始:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
</body>
</html>
将 PyScript 添加到 HTML:“Hello, World!” 使用 PyScript
您可以在 HTML 文件中使用 PyScript,方法是下载它或在 HTML 头中链接其 CDN。在HTML 文件的<head>部分中添加以下内容 :
<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>
这就是设置 PyScript 所需要做的全部工作。
要验证 PyScript 是否已成功集成,请在<body>部分添加以下代码行 :
<body>
<py-script>print("Hello, World!")</py-script>
</body>
在任何网络浏览器中打开 HTML 文件,您将看到 上面打印的“Hello, World!” 。
推荐:
加载 Matplotlib 库
您需要使用 <py-env> </py-env> 标签来导入 Python 模块。 使用以下代码片段在 HTML 文件的<head>部分 中 加载matplotlib模块:
<py-env>
- matplotlib
</py-env>
使用 PyScript 在浏览器中显示线图
创建一个 带有 id的<div>。您需要 id来将其与<py-script>标签 的 输出属性 一起使用 。
<div id="matplotlib-lineplot"> </div>
您需要在 <py-script> 标签中编写 Python 代码。将上述 id分配 给 <py-script>标签 的 output属性 。
<py-script output="matplotlib-lineplot">
# Python Code
</py-script>
现在您可以编写 Python 代码来创建线图了:
<body>
<div id="matplotlib-lineplot"></div>
<py-script output="matplotlib-lineplot">
# Python Code
# importing the matplotlib library
import matplotlib.pyplot as plt
fig, ax = plt.subplots()
# x axis
x = ["Python", "C++", "JavaScript", "Golang"]
# y axis
y = [10, 5, 9, 7]
plt.plot(x, y, marker='o', linestyle='-', color='b')
# Naming the x-label
plt.xlabel('Language')
# Naming the y-label
plt.ylabel('Score')
# Naming the title of the plot
plt.title('Language vs Score')
fig
</py-script>
</body>
当您在 Web 浏览器中打开 HTML 文件时,您将看到下图所示的内容:
使用PyScript在浏览器中显示条形图
您可以使用以下 Python 代码片段在浏览器中创建条形图:
<body>
<div id="matplotlib-bar"></div>
<py-script output="matplotlib-bar">
# Python Code
# importing the matplotlib library
import matplotlib.pyplot as plt
fig, ax = plt.subplots()
# x axis
x = ["Python", "C++", "JavaScript", "Golang"]
# y axis
y = [10, 5, 9, 7]
plt.bar(x, y)
# Naming the x-label
plt.xlabel('Language')
# Naming the y-label
plt.ylabel('Score')
# Naming the title of the plot
plt.title('Language vs Score')
fig
</py-script>
</body>
此代码产生以下输出:
总结
以上是晓得博客为你介绍的使用PyScript在Web上运行Python可视化您可以使用 PyScript 和 Python 库(如 Matplotlib、Bokeh、Seaborn 等)在 HTML 中构建功能强大的仪表板和图表。但是,您可能应该暂缓在生产中使用它,因为它正在大力开发中。该软件目前存在多个问题,包括加载时间和可用性。将来,PyScript 可能会打开大门,让 Python 操作在 Web 上更顺畅地运行和执行。
Claude、Netflix、Midjourney、ChatGPT Plus、PS、Disney、Youtube、Office 365、多邻国Plus账号购买,ChatGPT API购买,优惠码XDBK,用户购买的时候输入优惠码可以打95折