干貨分享 | 用Pyecharts制作炫酷的可視化大屏
首先介紹Pyecharts模塊當(dāng)中的Grid組件，使用Grid組件可以很好地將多張圖無論是上下組合還是左右組合，都能夠很好地拼接起來，我們先來看第一個例子
bar = (Bar().add_xaxis(Faker.choose()).add_yaxis("商家1", Faker.values()).add_yaxis("商家2", Faker.values()).set_global_opts(title_opts=opts.TitleOpts(title="直方圖")))line = (Line().add_xaxis(Faker.choose()).add_yaxis("商家1", Faker.values()).add_yaxis("商家2", Faker.values()).set_global_opts(title_opts=opts.TitleOpts(title="折線圖", pos_top="48%"),legend_opts=opts.LegendOpts(pos_top="48%"),))grid = (Grid().add(bar, grid_opts=opts.GridOpts(pos_bottom="60%")).add(line, grid_opts=opts.GridOpts(pos_top="50%")).render("水平組合圖_test.html"))
我們可以看到兩張圖表被以上下組合的方式拼接起來，當(dāng)然除了上下的拼接以外，我們還可以左右來拼接，代碼如下
bar = (Bar().add_xaxis(Faker.choose()).add_yaxis("商家1", Faker.values()).add_yaxis("商家2", Faker.values()).set_global_opts(title_opts=opts.TitleOpts(title="直方圖"),legend_opts=opts.LegendOpts(pos_left="20%"),))line = (Line().add_xaxis(Faker.choose()).add_yaxis("商家1", Faker.values()).add_yaxis("商家2", Faker.values()).set_global_opts(title_opts=opts.TitleOpts(title="折線圖", pos_right="5%"),legend_opts=opts.LegendOpts(pos_right="20%"),))grid = (Grid().add(bar, grid_opts=opts.GridOpts(pos_left="60%")).add(line, grid_opts=opts.GridOpts(pos_right="50%")).render("垂直組合圖_test.html"))
可以看到我們無論是想上下拼接還是左右拼接，都可以通過調(diào)整參數(shù)“pos_left”、“pos_right”、“pos_top”以及“pos_bottom”這幾個參數(shù)來實現(xiàn)，我們再來看一下下面這個例子，我們也可以將地圖和直方圖兩者拼接起來
bar = (Bar().add_xaxis(Faker.choose()).add_yaxis("商家1", Faker.values()).add_yaxis("商家2", Faker.values()).set_global_opts(legend_opts=opts.LegendOpts(pos_left="20%")))map = (Map().add("商家1", [list(z) for z in zip(Faker.provinces, Faker.values())], "china").set_global_opts(title_opts=opts.TitleOpts(title="地圖-基本示例")))grid = (Grid().add(bar, grid_opts=opts.GridOpts(pos_top="50%", pos_right="75%")).add(map, grid_opts=opts.GridOpts(pos_left="60%")).render("地圖+直方圖.html"))
英文單詞“overlap”的意思是重疊，那么放在這里，也就指的是可以將多張圖合并成一張，那么該怎么結(jié)合才好呢？我們來看一下下面這個例子，我們將直方圖和折線圖通過overlap組件組合到一起
v1 = Faker.values()v2 = Faker.values()v3 = Faker.values()bar = (Bar().add_xaxis(Faker.provinces).add_yaxis("商家A", v1).add_yaxis("商家B", v2).extend_axis(yaxis=opts.AxisOpts(axislabel_opts=opts.LabelOpts(formatter="{value} 個"), interval=20)).set_series_opts(label_opts=opts.LabelOpts(is_show=False)).set_global_opts(title_opts=opts.TitleOpts(title="Overlap-bar+line"),yaxis_opts=opts.AxisOpts(axislabel_opts=opts.LabelOpts(formatter="{value} 個")),))line = Line().add_xaxis(Faker.provinces).add_yaxis("商家C", v3, yaxis_index=1)bar.overlap(line)bar.render("直方圖+折線圖Overlap.html")
除此之外，我們也可以將散點圖和折線圖合并在一張圖上面，在代碼上就只要將直方圖的代碼替換成散點圖的就行，這邊也就具體不做演示
Bar().add_xaxis(x_data).add_yaxis(????????"A",[],yaxis_index=0,color="#d14a61",).add_yaxis("B",????????[],yaxis_index=1,color="#5793f3",)????.直方圖的全局配置代碼....????line = (Line().add_xaxis(x_data).add_yaxis(????????"C",????????[],yaxis_index=2,color="#675bba",label_opts=opts.LabelOpts(is_show=False),))bar.overlap(line)grid = Grid()grid.add(bar, opts.GridOpts(pos_left="5%", pos_right="20%"), is_control_axis_index=True)grid.render("test.html")
我們在用Pyecharts繪制了多張圖表之后，可以直接Tab組件將多張圖表連起來，一頁放一張圖表，具體看下面的例子和代碼，
def 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=[opts.MarkPointItem(type_="min")]),).set_global_opts(title_opts=opts.TitleOpts(title="折線圖")))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),).set_global_opts(title_opts=opts.TitleOpts(title="餅圖-玫瑰圖示例")))return ctab = Tab()tab.add(bar_datazoom_slider(), "直方圖")tab.add(line_markpoint(), "折線圖")tab.add(pie_rosetype(), "餅圖")tab.render("tab_base.html")?
和上面Tab組件不一樣的是，Tab組件是一頁放一張圖表，有幾張圖表就分成幾頁，而Page組件則是將繪制完成的多張圖表統(tǒng)統(tǒng)放在一張頁面里面，代碼的改動上面也十分的簡單，只要將上面代碼的Tab部分改成Page()即可，如下
def 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=[opts.MarkPointItem(type_="min")]),).set_global_opts(title_opts=opts.TitleOpts(title="折線圖")))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),).set_global_opts(title_opts=opts.TitleOpts(title="餅圖-玫瑰圖示例")))return cpage = Page(layout=Page.SimplePageLayout)page.add(bar_datazoom_slider(),line_markpoint(),pie_rosetype(),)page.render("page_simple_layout.html")
上圖所示的圖表在頁面當(dāng)中是不能被挪動的，在Page()組件當(dāng)中我們還能夠使得圖表按照我們所想的那樣隨意的挪動
##?上面的代碼都一樣，page = Page(layout=Page.DraggablePageLayout)page.add(bar_datazoom_slider(),line_markpoint(),pie_rosetype(),)page.render("page_draggable_layout.html")
評論
圖片
表情