pyecharts可视化大屏 pyecharts可视化大屏

如何优雅得搭建可视化大屏呢？
郑重说明:本文不直接提供最终代码
【pyecharts可视化大屏】白嫖怪福音,免费开源---pyechart官网
经过多年钻研,终于被我这只菜鸡整出来了！手动滑稽...
我们先上一张效果图瞧瞧:

文章图片

注:数据纯属虚构
看起来好像是那么回事？！？！
下面我们步入正题↓

实现过程:

爬取业务系统数据,存储至mysql(数据体量大推荐)或者excel内都可
利用pyecharts可视化
嵌入到前端框架内
局域网共享

需要用到的知识点:

python、javascript、html、css、mysql、pandas、pyecharts

版本不兼容解决方案:

python 版本 :3.6
pyecharts 版本:1.9.0
CMD安装命令: pip install pyecharts=1.9.0
如果已安装 pyecharts 但是不知道版本怎么办?
CMD命令: pip list内查看即可

Page示例(多图组合):

from pyecharts import options as opts from pyecharts.charts import Bar, Grid, Line, Liquid, Page, Pie from pyecharts.commons.utils import JsCode from pyecharts.components import Table from pyecharts.faker import Fakerdef bar_datazoom_slider() -> Bar: c = ( Bar() .add_xaxis(Faker.days_attrs) .add_yaxis("商家A", Faker.days_values) .set_global_opts( title_opts=opts.TitleOpts(title="Bar-DataZoom（slider-水平）"), datazoom_opts=[opts.DataZoomOpts()], ) ) return cdef line_markpoint() -> Line: c = ( Line() .add_xaxis(Faker.choose()) .add_yaxis( "商家A", Faker.values(), markpoint_opts=opts.MarkPointOpts(data=https://www.it610.com/article/[opts.MarkPointItem(type_="min")]), ) .add_yaxis( "商家B", Faker.values(), markpoint_opts=opts.MarkPointOpts(data=https://www.it610.com/article/[opts.MarkPointItem(type_="max")]), ) .set_global_opts(title_opts=opts.TitleOpts(title="Line-MarkPoint")) ) return cdef pie_rosetype() -> Pie: v = Faker.choose() c = ( Pie() .add( "", [list(z) for z in zip(v, Faker.values())], radius=["30%", "75%"], center=["25%", "50%"], rosetype="radius", label_opts=opts.LabelOpts(is_show=False), ) .add( "", [list(z) for z in zip(v, Faker.values())], radius=["30%", "75%"], center=["75%", "50%"], rosetype="area", ) .set_global_opts(title_opts=opts.TitleOpts(title="Pie-玫瑰图示例")) ) return cdef grid_mutil_yaxis() -> Grid: x_data = https://www.it610.com/article/["{}月".format(i) for i in range(1, 13)] bar = ( Bar() .add_xaxis(x_data) .add_yaxis( "蒸发量", [2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3], yaxis_index=0, color="#d14a61", ) .add_yaxis( "降水量", [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3], yaxis_index=1, color="#5793f3", ) .extend_axis( yaxis=opts.AxisOpts( name="蒸发量", type_="value", min_=0, max_=250, position="right", axisline_opts=opts.AxisLineOpts( linestyle_opts=opts.LineStyleOpts(color="#d14a61") ), axislabel_opts=opts.LabelOpts(formatter="{value} ml"), ) ) .extend_axis( yaxis=opts.AxisOpts( type_="value", name="温度", min_=0, max_=25, position="left", axisline_opts=opts.AxisLineOpts( linestyle_opts=opts.LineStyleOpts(color="#675bba") ), axislabel_opts=opts.LabelOpts(formatter="{value} °C"), splitline_opts=opts.SplitLineOpts( is_show=True, linestyle_opts=opts.LineStyleOpts(opacity=1) ), ) ) .set_global_opts( yaxis_opts=opts.AxisOpts( name="降水量", min_=0, max_=250, position="right", offset=80, axisline_opts=opts.AxisLineOpts( linestyle_opts=opts.LineStyleOpts(color="#5793f3") ), axislabel_opts=opts.LabelOpts(formatter="{value} ml"), ), title_opts=opts.TitleOpts(title="Grid-多 Y 轴示例"), tooltip_opts=opts.TooltipOpts(trigger="axis", axis_pointer_type="cross"), ) )line = ( Line() .add_xaxis(x_data) .add_yaxis( "平均温度", [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2], yaxis_index=2, color="#675bba", label_opts=opts.LabelOpts(is_show=False), ) )bar.overlap(line) return Grid().add( bar, opts.GridOpts(pos_left="5%", pos_right="20%"), is_control_axis_index=True )def liquid_data_precision() -> Liquid: c = ( Liquid() .add( "lq", [0.3254], label_opts=opts.LabelOpts( font_size=50, formatter=JsCode( """function (param) { return (Math.floor(param.value * 10000) / 100) + '%'; }""" ), position="inside", ), ) .set_global_opts(title_opts=opts.TitleOpts(title="Liquid-数据精度")) ) return cdef table_base() -> Table: table = Table()headers = ["City name", "Area", "Population", "Annual Rainfall"] rows = [ ["Brisbane", 5905, 1857594, 1146.4], ["Adelaide", 1295, 1158259, 600.5], ["Darwin", 112, 120900, 1714.7], ["Hobart", 1357, 205556, 619.5], ["Sydney", 2058, 4336374, 1214.8], ["Melbourne", 1566, 3806092, 646.9], ["Perth", 5386, 1554769, 869.4], ] table.add(headers, rows).set_global_opts( title_opts=opts.ComponentTitleOpts(title="Table") ) return tabledef page_draggable_layout(): page = Page(layout=Page.DraggablePageLayout) page.add( bar_datazoom_slider(), line_markpoint(), pie_rosetype(), grid_mutil_yaxis(), liquid_data_precision(), table_base(), ) page.render("page_draggable_layout.html")if __name__ == "__main__": page_draggable_layout()

快捷入口: https://gallery.pyecharts.org...

布局样式设置:
如何把这些图表组合起来呢？
个人选择比较无脑的一种,
利用BeautifulSoup获取标签设置style
想让它去哪儿就去哪儿
css样式如果忘记-请点击它菜鸟CSS官网教学示例
示例:

with open("YG_view.html", "r+", encoding='utf-8') as html: html_bf = BeautifulSoup(html, 'lxml') # 样式 lables = html_bf.select('tbody') lables[0]["style"] = "text-align:center; "

提示:一般一个图表在一个div内,获取div标签循环遍历设置即可
待续...