pyscript+py-env实现python+html效果

stay_foolish12

已于 2023-04-14 11:44:08 修改

阅读量534

点赞数

分类专栏： python 文章标签： python matplotlib 机器学习

于 2022-06-23 15:11:10 首次发布

本文链接：https://blog.csdn.net/stay_foolish12/article/details/125427476

版权

python 专栏收录该内容

319 篇文章 29 订阅

订阅专栏

参考链接：https://developer.aliyun.com/article/976083?spm=a2c6h.12873581.group.dArticle976083.3a8057c73DINVs
今天我们要介绍的东西，叫做PyScript，使用它，不需要安装任何软件。只要有一个记事本，就能写一段HTML+Python的代码。写完以后，双击这个HTML文件，用浏览器打开，就能直接看到Python代码的运行结果。
假设我现在要写一段代码，使用高效的算法计算斐波那契数列前10项的值。现在我已经把代码写好了，想验证一下它是否正确：

def fib(n):
    if n in [1, 2]:
        return 1
    a = 1
    b = 1
    for _ in range(2, n):
        a, b = b, a + b
    return b

我的电脑上没有Python，我也不知道任何在线的Python解释器。怎么办呢？这个时候，你只需要在这个Python代码的前后再添加一些HTML代码，把它保存成一个.html文件就可以了：

<html>
  <head>
    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
  </head>
  <body>
    <py-script>
def fib(n):
    if n in [1, 2]:
        return 1
    a = 1
    b = 1
    for _ in range(2, n):
        a, b = b, a + b
    return b
for i in range(1, 11):
    print(f'第{i}项的结果是：{fib(i)}')
    </py-script>
  </body>
</html>

在这里插入图片描述

到目前为止，似乎跟那些在线的Python运行环境没什么区别。但PyScript更厉害的是，它自带了一些常见的第三方库，例如numpy或者Matplot，甚至它还可以手动安装第三方库。
对于它自带的numpy和matplotlib，可以直接使用标签声明：

<html>
    <head>
    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
      <py-env>
        - numpy
        - matplotlib
      </py-env>
    </head>
  <body>
    <h1>Let's plot random numbers</h1>
    <div id="plot"></div>
    <py-script output="plot">
import matplotlib.pyplot as plt
import numpy as np
x = np.random.randn(1000)
y = np.random.randn(1000)
fig, ax = plt.subplots()
ax.scatter(x, y)
fig
    </py-script>
  </body>
</html>

在这里插入图片描述

stay_foolish12

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
pyscript+py-env实现python+html效果

今天我们要介绍的东西，叫做PyScript，使用它，不需要安装任何软件。只要有一个记事本，就能写一段HTML+Python的代码。写完以后，双击这个HTML文件，用浏览器打开，就能直接看到Python代码的运行结果。假设我现在要写一段代码，使用高效的算法计算斐波那契数列前10项的值。现在我已经把代码写...
复制链接

扫一扫