使用Pyecharts和BeautifulSoup创建和定制图表

一.使用Pyecharts和BeautifulSoup创建和定制图表

在这篇博文中以六个图像为例，我们将学习如何使用pyecharts库来创建图表，并使用BeautifulSoup库来定制图表的样式和布局。

• 图形简示

图形🙃	图形😂	图形😊
图形🙌	图形👌	图形❤️

二.创建图表

首先，我们需要创建一些图表。在这个示例中，我们将创建六个个不同的图表，我们将使用pyecharts库来创建这些图表。

• 导入模块

from pyecharts import options as opts
from pyecharts.charts import Bar, Page, Line, Pie
from pyecharts.faker import Faker

• 创建六个图形，每个图形都有自己的x轴和y轴的数据，以及全局的选项。

bar = (
    Bar()
    .add_xaxis(Faker.choose())
    .add_yaxis("商家A", Faker.values())
    .add_yaxis("商家B", Faker.values())
    .set_global_opts(title_opts=opts.TitleOpts(title="Bar-基本示例", subtitle="我是副标题"))
)
# 以下是创建其他三个图形的代码，与上面的类似
line = (
    Line()
    .add_xaxis(Faker.choose())
    .add_yaxis("商家A", Faker.values())
    .add_yaxis("商家B", Faker.values())
    .set_global_opts(title_opts=opts.TitleOpts(title="Line-基本示例", subtitle="我是副标题"))
)

pie = (
    Pie()
    .add("", [list(z) for z in zip(Faker.choose(), Faker.values())])
    .set_global_opts(title_opts=opts.TitleOpts(title="Pie-基本示例"))
    .set_series_opts(label_opts=opts.LabelOpts(formatter="{b}: {c}"))
)

bar2 = (
    Bar()
    .add_xaxis(Faker.choose())
    .add_yaxis("商家A", Faker.values())
    .add_yaxis("商家B", Faker.values())
    .set_global_opts(title_opts=opts.TitleOpts(title="Bar2-基本示例", subtitle="我是副标题"))
)
bar3 = (
    Bar()
    .add_xaxis(Faker.choose())
    .add_xaxis(["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"])
    .add_yaxis("商家A", [5, 20, 36, 10, 75, 90])
    .set_global_opts(title_opts=opts.TitleOpts(title="主标题", subtitle="副标题"))
)
liquid = (
    Liquid()
    .add("lq", [0.3, 0.7], is_outline_show=False, shape=SymbolType.DIAMOND)
    .set_global_opts(title_opts=opts.TitleOpts(title="Liquid-Shape-Diamond"))
)

在这个代码中，我们使用了Faker库来生成假数据。你可以根据你的需求替换这些数据。

• 将图表添加到页面中

page = Page()
page.add(bar, line, pie, bar2,bar3,liquid)

• 渲染页面并保存为HTML文件

page.render("page.html")

• 之后将显示
  
  这就说明将图像保存到html文件中了

三.使用BeautifulSoup定制图表

最后，将使用BeautifulSoup库来定制图表的样式和布局。

• 使用BeautifulSoup库来解析和修改HTML文件

from bs4 import BeautifulSoup

with open("page.html", "r+", encoding='utf-8') as html:
    html_bf = BeautifulSoup(html, 'lxml') # 解析HTML文件
    divs = html_bf.select('.chart-container') # 根据css定位标签，选中图像的父节点标签
     # 修改每个元素的样式，包括宽度、高度、位置和边框
    divs[0]["style"] = "width:420px;height:274px;position:absolute;top:100px;left:5%;border-style:solid;border-color:#444444;border-width:2px;"
    divs[1]["style"] = "width:420px;height:274px;position:absolute;top:100px;left:35%;border-style:solid;border-color:#444444;border-width:2px;"
    divs[2]["style"] = "width:420px;height:274px;position:absolute;top:100px;left:65%;border-style:solid;border-color:#444444;border-width:2px;"
    divs[3]["style"] = "width:420px;height:274px;position:absolute;top:400px;left:5%;border-style:solid;border-color:#444444;border-width:2px;"
    divs[4]["style"] = "width:420px;height:274px;position:absolute;top:400px;left:35%;border-style:solid;border-color:#444444;border-width:2px;"
    divs[5]["style"] = "width:420px;height:274px;position:absolute;top:400px;left:65%;border-style:solid;border-color:#444444;border-width:2px;"
    body = html_bf.find("body") # 根据标签名称定位到body标签
    body["style"] = "background-color:white;" # 修改背景颜色
    html_new = str(html_bf) # 将BeautifulSoup对象转换为字符
    html.seek(0, 0) # 光标移动至
    html.truncate() # 删除光标后的所有字符内容
    html.write(html_new) # 将由BeautifulSoup对象转换得到的字符重新写入html文件
    html.close()

这段代码将每个图表元素的宽度和高度都设置为420px和274px，位置设置为绝对位置，边框设置为2px宽的#444444颜色的实线。这样，我们就可以在页面上看到一个2*3的图表布局。

四.图像展示

希望这篇博文能帮助你更好地理解如何使用pyecharts和BeautifulSoup来创建和定制图表。如果你有任何问题或者需要进一步的帮助，欢迎随时向我提问。😊

五.分享学习资源

Echarts是一个由百度开源的基于js语言的数据可视化框架，凭借着良好的交互性，精巧的图表设计，得到了众多开发者的认可。
相较于matplotlib而言，pyecharts库绘制的图形种类更多，样式更精美、丰富。
Pyecharts官网有Pyecharts的使用文档，社区包含各种图形的项目案例代码和演示。
Beautiful Soup是一个可以从HTML或XML文件中提取数据的Python库.
它能够通过你喜欢的转换器实现惯用的文档导航,查找,修改文档的方式.
Beautiful Soup会帮你节省数小时甚至数天的工作时间.

此外，如你基础比较薄弱，又对编程这方面感兴趣，您可以前往菜鸟教程学习相关知识！😊