diseño del lienzo de pyechart
Directorio de artículos
Controlar el diseño vertical de la página de lienzo
page1=(Page(page_title="造价四剑客",layout=Page.SimplePageLayout))
page1.add(bar)
page1.render("造价四剑客.html")
Prepare tres imágenes, primero colocaré una imagen en la página, este es el efecto.
Otra foto.
page1=(Page(page_title="造价四剑客",layout=Page.SimplePageLayout))
page1.add(bar,
bar2)
page1.render("造价四剑客.html")
Al ver esto, todos deben saber lo que está haciendo la página. Sigue apilando imágenes en la dirección vertical, lo que se llama "Imágenes múltiples secuenciales". ¿Entiendes?
page1=(Page(page_title="造价四剑客",layout=Page.SimplePageLayout))
page1.add(bar,
bar2,
bar3)
page1.render("造价四剑客.html")
¡Apilado 3 imágenes, como se esperaba! ! !
Gráficos múltiples paralelos
Exploremos la cuadrícula juntos. En primer lugar, hay muchos más métodos para la cuadrícula que para la página. En segundo lugar, ¡la flexibilidad también se mejora! ! !
Primero tomemos una foto, ¡probémosla primero sin prisa!
grid1 = (
Grid(init_opts=opts.InitOpts(width="1700px",height="750px"))
.add(bar,grid_opts=opts.GridOpts(is_show=True,pos_left="10%",pos_right="40%"))
#.add(bar2,grid_opts=opts.GridOpts(is_show=True,pos_left="20%",pos_right="50%"))
.render("造价四剑客.html")
)
Bien, vuelve ahora, agrega uno más.
grid1 = (Grid(init_opts=opts.InitOpts(width="1700px",height="750px")))
grid1.add(bar,grid_opts=opts.GridOpts(is_show=True,pos_right="55%"))
grid1.add(bar2,grid_opts=opts.GridOpts(is_show=True,pos_left="55%"))
grid1.render("造价四剑客.html")
Eche un vistazo a la leyenda en el medio, todo se superpone, se acabó.
No hay prisa, ajustemos juntos la configuración global. ¡Ven conmigo!
Agregue .set_global_opts a bar y bar2 respectivamente, el código detallado es el siguiente:
#bar的全部代码
bar = (
Bar()
.add_xaxis(Faker.week)
.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",
)
.set_global_opts(legend_opts=opts.LegendOpts(pos_left="25%"))
#bar2的全部代码
bar2 = (
Bar()
.add_xaxis(
[
"名字很长的X轴标签1",
"名字很长的X轴标签2",
"名字很长的X轴标签3",
"名字很长的X轴标签4",
"名字很长的X轴标签5",
"名字很长的X轴标签6",
]
)
.add_yaxis("商家A", [10, 20, 30, 40, 50, 40])
.add_yaxis("商家B", [20, 10, 40, 30, 40, 50])
.set_global_opts(
xaxis_opts=opts.AxisOpts(axislabel_opts=opts.LabelOpts(rotate=-15)),
title_opts=opts.TitleOpts(title="", subtitle=""),
legend_opts=opts.LegendOpts(pos_right="25%")
)
)
El efecto final es el siguiente: [¿Está hecho? ]
Y lo que podemos ver es que esta imagen está colocada en el mismo piso.
Aplicación integral secuencial y paralela
Ahora usémoslo de manera integral para mejorar nuestro hermoso diseño
Sugerencias: cuando cambia el código de diseño de la imagen a este
grid1 = (Grid(init_opts=opts.InitOpts(width="1700px",height="750px")))
grid1.add(bar,grid_opts=opts.GridOpts(is_show=True,pos_right="55%"))
grid1.add(bar2,grid_opts=opts.GridOpts(is_show=True,pos_left="25%"))
grid1.render("造价四剑客.html")
# 原来是这样的
grid1 = (Grid(init_opts=opts.InitOpts(width="1700px",height="750px")))
grid1.add(bar,grid_opts=opts.GridOpts(is_show=True,pos_right="55%"))
grid1.add(bar2,grid_opts=opts.GridOpts(is_show=True,pos_left="55%"))
grid1.render("造价四剑客.html")
Verá que sus imágenes se superponen entre sí. Esto es algo que no desea ver, así que espero que pueda ajustar sus parámetros pos_left y pos_right.
¡A continuación ingresamos al tema!
grid1 = (Grid(init_opts=opts.InitOpts(width="1600px")))
grid1.add(bar,grid_opts=opts.GridOpts(is_show=True,pos_right="55%"))
grid1.add(bar2,grid_opts=opts.GridOpts(is_show=True,pos_left="55%"))
page1=(Page(page_title="造价四剑客",layout=Page.SimplePageLayout))
page1.add(grid1)
page1.add(bar3)
page1.render("造价四剑客.html")
Combinado con éxito.
Por último, quiero decir que los más utilizados son generalmentecuadrícula, La página se usa menos, porque puede completar fácilmente su diseño de pantalla grande en una página, pero si desea desplazarse y mostrar los gráficos correspondientes de varias maneras, puede usar muchas páginas.
Adjunte todos los códigos:
from pyecharts.charts import Page,Bar,Grid
from pyecharts import options as opts
from pyecharts.faker import Faker
bar = (
Bar()
.add_xaxis(Faker.week)
.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",
)
.set_global_opts(legend_opts=opts.LegendOpts(pos_left="25%"))
# .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=""),
# tooltip_opts=opts.TooltipOpts(trigger="axis", axis_pointer_type="cross"),
# )
)
bar3 = (
Bar()
.add_xaxis(Faker.choose())
.add_yaxis("商家A", Faker.values(), stack="stack1")
.add_yaxis("商家B", Faker.values(), stack="stack1")
.set_series_opts(label_opts=opts.LabelOpts(is_show=False))
.set_global_opts(title_opts=opts.TitleOpts(title=""))
)
bar2 = (
Bar()
.add_xaxis(
[
"名字很长的X轴标签1",
"名字很长的X轴标签2",
"名字很长的X轴标签3",
"名字很长的X轴标签4",
"名字很长的X轴标签5",
"名字很长的X轴标签6",
]
)
.add_yaxis("商家A", [10, 20, 30, 40, 50, 40])
.add_yaxis("商家B", [20, 10, 40, 30, 40, 50])
.set_global_opts(
xaxis_opts=opts.AxisOpts(axislabel_opts=opts.LabelOpts(rotate=-15)),
title_opts=opts.TitleOpts(title="", subtitle=""),
legend_opts=opts.LegendOpts(pos_right="25%")
)
)
from pyecharts import options as opts
from pyecharts.charts import Graph
nodes = [
{
"name": "结点1", "symbolSize": 10},
{
"name": "结点2", "symbolSize": 20},
{
"name": "结点3", "symbolSize": 30},
{
"name": "结点4", "symbolSize": 40},
{
"name": "结点5", "symbolSize": 50},
{
"name": "结点6", "symbolSize": 40},
{
"name": "结点7", "symbolSize": 30},
{
"name": "结点8", "symbolSize": 20},
]
links = []
for i in nodes:
for j in nodes:
links.append({
"source": i.get("name"), "target": j.get("name")})
c = (
Graph()
.add("", nodes, links, repulsion=8000)
.set_global_opts(title_opts=opts.TitleOpts(title="Graph-基本示例"))
)
grid1 = (Grid(init_opts=opts.InitOpts(width="1600px")))
grid1.add(bar,grid_opts=opts.GridOpts(is_show=True,pos_right="55%"))
grid1.add(bar2,grid_opts=opts.GridOpts(is_show=True,pos_left="55%"))
page1=(Page(page_title="造价四剑客",layout=Page.SimplePageLayout))
page1.add(grid1)
page1.add(bar3)
page1.add(c)
page1.render("造价四剑客.html")
¡Finalmente, espero que a todos les vaya bien y puedan cumplir sus ideales! ! !
