看我，在ECharts中的多图联动

Posted 2023-04-27

参考技术A 昨天一个好朋友扔过来这样一张图，让帮忙看看。虽然很忙，但是没做过图标的我很是好奇，就答应下来帮忙看下。看似一个简单的折线图，实则需求很复杂。仔细分析之后需求如下：

1.两条X轴，X1轴坐标显示，X2轴坐标隐藏
2.两个Y轴，Y轴都是从0开始，暂且称为Y1轴，Y2轴。Y1轴取值范围从0到8，以2间隔；Y2轴取值范围从0到5，以1为间隔
3.多条不同颜色的折线，折线点为实心圆
4.以X轴分段划分区域，设置不同背景色，区域中心设置文字，低风险、高风险
5.图标背景，以X轴方向的横条显示，底色为白色
6.右下角按钮 （不在画图范围内，暂时忽略）
7.X轴上按区域进行分段 蓝橙色提示😢

根据以上需求我开始选用ECharts画图，说到这里不得不提一句，ECharts真好用啊，强大的功能，清晰的API。我第一次使用就很容易，入门无门槛。😄

最终实现的效果如下：

放大招😁

需求基本上实现了，匆忙中需求7还没搞出来😭，看看哪位上神可以 帮忙实现？快来放大招吧。

Echarts在同一网页按顺序展示多图

Echarts

Page：同一网页按顺序展示多图

from pyecharts import Page

page = Page("")

page.add(pie).add(friends_map).add(words_cloud)

page.render()

使用 add() 向 page 中添加之前生成的三个图。打开 render.html 文件就可以看到三个图表直接显示在一个网页中，十分方便查看。