离线使用Pyecharts制作可视化图表——方法2：将 js 代码写入 html 中

在一些场景中，不方便单独启动一个本地服务去挂载 pyecharts 的所有静态资源，此时就无法更改全局 hosts 去直接指向本地静态资源文件地址。此时我们可以重写库文件中的 Javascript.load_javascript_contents 方法将所需要的 js 代码全部写入到 html 文件中，但是这样会导致 html 文件的臃肿。
具体步骤如下：
一、下载离线 js 文件
GitHub 下载地址：https://github.com/pyecharts/pyecharts-assets
将这个地方的文件下载成为一个 zip 文件，保存至本地的一个指定路径。这个里面包含了大多数示例中所用到的 js 文件。

二、重写库文件方法

from pathlib import Path
from pyecharts.render.display import Javascript


# 定义新的load_javascript_contents函数
def new_js(self):
    for lib in self.lib:
        work_path = str(Path.cwd()) + "/pyecharts-assets-master/assets/v5/"
        new_lib = lib.replace("https://assets.pyecharts.org/assets/v5/", f"{work_path}")
        with open(new_lib, "r", encoding="utf-8") as f:
            self.javascript_contents[lib] = f.read()
            f.close()
        continue
    return self


Javascript.load_javascript_contents = new_js

Tips：
1、在进行 work_path 的获取和拼接的时候，需要注意你的离线 js 文件所存放的路径，这里是将父文件夹 pyecharts-assets-master 与代码文件放在了同一级目录中。
2、**在使用较新版本的 pyecharts 的时候，需要再创建图表对象的时候，有一个渲染配置项 RenderOpts ，其含义为是否在渲染HTML时嵌入JS文件，默认False不嵌入，在这里需要给他赋值为 True **

---

---

完整代码：

import json
import os
from pathlib import Path
# 导入 Line 功能对象构建折线图对象
from pyecharts.charts import Line
# 标题选项所有的可配置的选项所在包
from pyecharts.options import *
# 重写库文件中的Javascript.load_javascript_contents方法，将js文件内容内嵌入html文件中
from pyecharts.render.display import Javascript

file_name = r"C:\Users\Admin\Desktop\fsdownload\curName.json"


# 定义新的load_javascript_contents函数
def new_js(self):
    for libpath in self.lib:
        work_path = str(Path.cwd()) + "/pyecharts-assets-master/assets/v5/"
        new_lib = libpath.replace("https://assets.pyecharts.org/assets/v5/", f"{work_path}")
        with open(new_lib, "r", encoding="utf-8") as f:
            self.javascript_contents[libpath] = f.read()
            f.close()
        continue
    return self


def readJsonDate(filename):
    # 读取json文件
    json_data = open(filename, "r", encoding="UTF-8")
    number = json_data.read()
    json_data.close()

    return number


def lineChart():
    number = readJsonDate(file_name)
    # 使用 json.loads()  方法，将 json 数据转换为 Python 中的列表 list
    pydata = json.loads(number)
    rate = []  # 存放汇率
    country = []  # 存放国家信息
    for data in pydata:
        for t in range(len(data)):
            rate.append(data[t]["rate"])
            country.append(data[t]["country"])
    # 创建折线图对象
    # 先重写获取调用 js 文件的方法
    # Javascript.load_javascript_contents = new_js
    # 创建图表对象，并设置渲染嵌入 js 代码配置项为 True
    line = Line(render_opts=RenderOpts(is_embed_js=True))
    # 设置x轴数据
    line.add_xaxis(country[:10])
    # 设置 y 轴数据
    line.add_yaxis(series_name="汇率", y_axis=rate[:10], )
    # 设置全局配置项
    line.set_global_opts(title_opts=TitleOpts(title="跨国汇率图", pos_left="center", pos_bottom="90%"))
    # 生成图表
    line.render("rate.html")
    os.startfile("rate.html")


if __name__ == '__main__':
    Javascript.load_javascript_contents = new_js
    lineChart()

在定义新的 load_javascript_contents 函数之后，在进行绘制图表之前需要将其调用赋给 Javascript.load_javascript_contents 方法。可以在绘图方法内部调用赋值（需要在每一个方法中都做一次调用操作），也可以在 main 方法中一次性调用赋值。

注意：使用这个方法将 js 代码全部写入到 html 代码文件中时，会使得 html 文件较为臃肿，使用时需要慎重考虑。

---

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
原文链接：https://blog.csdn.net/m0_65740074/article/details/136285997