pyecharts-gallery (на основе pyecharts 1.0.0+)

Python

Рекламная площадь

  • адрес проекта pyecharts: поверните направо на склад, чтобы увидеть -->pyecharts 1.0.0
  • адрес проекта pyecharts-gallery: поверните направо на склад, чтобы увидеть -->pyecharts-gallery

Разговор о диаграммах 🎉

  • pyechartsВ настоящее время делится на0.5.Xи1.0.0+, после длительного периода рефакторинга метод написания сильно отличается от прежнего.
  • Новая версия документа будет по-прежнему использоватьсяДокументация с 1.0.0
  • Устаревшая документация перенесена вДокументация до 0.5.X
  • В настоящее время1.0.0Версия выпущена, добро пожаловать в использование0.5.XПредыдущие версии и еще не использованныеpyechartsПриходи и почувствуй опыт новой версии👏
  • [ключевой момент]pyecharts 1.0.0+только поддержкаPython 3.6+,еслиPythonверсия еще3.6Вы можете выбрать обновлениеPythonверсию или использовать0.5.Xнижеpyecharts
  • [стучит по доске] На этом этапеpyechartsеще не полностьюEchartsВсе конфигурации, поэтому некоторые стили или небольшие функциональные точки не были реализованы, пожалуйста, потерпите меня. 🙏
  • [Еще одно слово] Если у вас есть хорошая идея, сначала посмотритеEchartsМожно ли 😊

Сравните различия в коде между старой и новой версиями

  • Наследие (до0.5.X)
from pyecharts import Bar

attr = ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]
v1 = [5, 20, 36, 10, 75, 90]
v2 = [10, 25, 8, 60, 20, 80]
bar = Bar("柱状图数据堆叠示例")
bar.add("商家A", attr, v1, is_stack=True)
bar.add("商家B", attr, v2, is_stack=True)
bar.render()
  • новая версия (после1.0.0+)
import pyecharts.options as opts
from pyecharts.charts import Bar

attr = ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]
v1 = [5, 20, 36, 10, 75, 90]
v2 = [10, 25, 8, 60, 20, 80]

 (
    Bar()
    .add_xaxis(attr)
    .add_yaxis("商家A", v1, stack="stack1")
    .add_yaxis("商家B", v2, stack="stack1")
    .set_series_opts(label_opts=opts.LabelOpts(is_show=False))
    .set_global_opts(title_opts=opts.TitleOpts(title="柱状图数据堆叠示例"))
    .render("bar_stack.html")
)
  • инструкция:
    • Во-первых, эффект рендеринга у обоих одинаковый, но есть большие изменения в стиле кодирования.
    • Во-вторых, код верхнего уровня написан в виде цепочки, а код нижнего уровня фактически возвращаетself, а преимущество цепочки в том, что при написании кода код становится более организованным.
    • И, наконец, настоятельно рекомендуется Type Hints.Код после этого рефакторинга вынужден использовать Type Hints, что хорошо и для разработчиков, и для пользователей.Ведь существуют составные типы параметров.

Разговор о pycharts-галерее

  • Смысл проекта:EchartsимеютEcharts Community Gallery. следовательноpyechartsПосле того, как будет больше пользователей, также должен быть выделенныйpythonerмой собственныйpyecharts-gallery.
  • Ход проекта:
    • В основном используйтеpyechartsдостигнута большая частьEchartsОфициальный пример, остальное что можно реализовать на данном этапе еще дополняется~
    • Небольшие функции и схемы, которые пока не могут быть реализованы, в основномpyechartsОтсутствуют соответствующие элементы конфигурации (такие как солнечные лучи, форматированный текст и графическая легенда)

Возьмем несколько частных примеров

  • 1,EchartsГрафик отношений

#!/usr/bin/env python
# coding=utf-8
from __future__ import unicode_literals

import asyncio
from aiohttp import TCPConnector, ClientSession

import pyecharts.options as opts
from pyecharts.charts import Graph


async def get_json_data(url: str) -> dict:
    async with ClientSession(connector=TCPConnector(ssl=False)) as session:
        async with session.get(url=url) as response:
            return await response.json()


# 获取官方的数据
data = asyncio.run(
    get_json_data(
        url="https://echarts.baidu.com/examples/data/asset/data/npmdepgraph.min10.json"
    )
)
# 数据处理
nodes = [
    {
        "x": node["x"],
        "y": node["y"],
        "id": node["id"],
        "name": node["label"],
        "symbolSize": node["size"],
        "itemStyle": {"normal": {"color": node["color"]}},
    }
    for node in data["nodes"]
]
edges = [
    {"source": edge["sourceID"], "target": edge["targetID"]} for edge in data["edges"]
]

# 画图
(
    Graph(init_opts=opts.InitOpts(width="1600px", height="800px"))
    .add(
        series_name="",
        nodes=nodes,
        links=edges,
        layout="none",
        is_roam=True,
        is_focusnode=True,
        label_opts=opts.LabelOpts(is_show=False),
        linestyle_opts=opts.LineStyleOpts(width=0.5, curve=0.3, opacity=0.7),
    )
    .set_global_opts(title_opts=opts.TitleOpts(title="NPM Dependencies"))
    .render("npm_dependencies.html")
)
  • 2. Вложенные круговые диаграммы

#!/usr/bin/env python
# coding=utf-8
from __future__ import unicode_literals

import pyecharts.options as opts
from pyecharts.charts import Pie

"""
Gallery 使用 pyecharts 1.0.0
参考地址: https://echarts.baidu.com/examples/editor.html?c=pie-nest

目前无法实现的功能:

1、富文本的 label 暂时没有配置项
"""

inner_x_data = ["直达", "营销广告", "搜索引擎"]
inner_y_data = [335, 679, 1548]
inner_data_pair = [list(z) for z in zip(inner_x_data, inner_y_data)]

outer_x_data = ["直达", "营销广告", "搜索引擎", "邮件营销", "联盟广告", "视频广告", "百度", "谷歌", "必应", "其他"]
outer_y_data = [335, 310, 234, 135, 1048, 251, 147, 102]
outer_data_pair = [list(z) for z in zip(outer_x_data, outer_y_data)]

(
    Pie(init_opts=opts.InitOpts(width="1600px", height="800px"))
    .add(
        series_name="访问来源",
        data_pair=inner_data_pair,
        radius=[0, "30%"],
        label_opts=opts.LabelOpts(position="inner"),
    )
    .add(
        series_name="访问来源",
        radius=["40%", "55%"],
        data_pair=outer_data_pair,
        label_opts=opts.LabelOpts(formatter="{a} - {b} - {c} - {d}"),
    )
    .set_global_opts(legend_opts=opts.LegendOpts(pos_left="left", orient="vertical"))
    .set_series_opts(
        tooltip_opts=opts.TooltipOpts(
            trigger="item", formatter="{a} <br/>{b}: {c} ({d}%)"
        )
    )
    .render("nested_pies.html")
)
  • 3. Карта дерева

#!/usr/bin/env python
# coding=utf-8
from __future__ import unicode_literals

import asyncio
from aiohttp import TCPConnector, ClientSession

import pyecharts.options as opts
from pyecharts.charts import Tree


async def get_json_data(url: str) -> dict:
    async with ClientSession(connector=TCPConnector(ssl=False)) as session:
        async with session.get(url=url) as response:
            return await response.json()


# 获取官方的数据
data = asyncio.run(
    get_json_data(url="https://echarts.baidu.com/examples/data/asset/data/flare.json")
)

(
    Tree(init_opts=opts.InitOpts(width="1400px", height="800px"))
    .add(
        series_name="",
        data=[data],
        pos_top="18%",
        pos_bottom="14%",
        layout="radial",
        symbol="emptyCircle",
        symbol_size=7,
    )
    .set_global_opts(
        tooltip_opts=opts.TooltipOpts(trigger="item", trigger_on="mousemove")
    )
    .render("radial_tree.html")
)
  • 4. Графики с двойной осью Y или с несколькими осями Y, упомянутые в выпуске.
    • ДобавлятьoffsetЭтот параметр в настоящее время опубликован1.0.0Пока нет, текущий обновленный исходный код доступенdevна ветке

#!/usr/bin/env python
# coding=utf-8
from __future__ import unicode_literals

import pyecharts.options as opts
from pyecharts.charts import Bar, Line

"""
Gallery 使用 pyecharts 1.0.0
参考地址: https://www.echartsjs.com/examples/editor.html?c=multiple-y-axis

目前无法实现的功能:

1、yaxis_opts 需要增加 offset 参数
"""

colors = ['#5793f3', '#d14a61', '#675bba']
x_data = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
legend_list = ['蒸发量', '降水量', '平均温度']
evaporation_capacity = [2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]
rainfall_capacity = [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3]
average_temperature = [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]

bar = (
    Bar(init_opts=opts.InitOpts(width="1680px", height="800px"))
    .add_xaxis(
        xaxis_data=x_data
    )
    .add_yaxis(
        series_name="蒸发量",
        yaxis_data=evaporation_capacity,
        yaxis_index=0,
        color=colors[1]
    )
    .add_yaxis(
        series_name="降水量",
        yaxis_data=rainfall_capacity,
        yaxis_index=1,
        color=colors[0]
    )
    .extend_axis(
        yaxis=opts.AxisOpts(
            name="蒸发量",
            type_="value",
            min_=0,
            max_=250,
            position="right",
            axisline_opts=opts.AxisLineOpts(
                linestyle_opts=opts.LineStyleOpts(color=colors[1])
            ),
            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=colors[2])
            ),
            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(
            type_="value",
            name="降水量",
            min_=0,
            max_=250,
            position="right",
            offset=80,
            axisline_opts=opts.AxisLineOpts(
                linestyle_opts=opts.LineStyleOpts(color=colors[0])
            ),
            axislabel_opts=opts.LabelOpts(
                formatter="{value} ml"
            ),
        ),
        tooltip_opts=opts.TooltipOpts(
            trigger="axis",
            axis_pointer_type="cross"
        ),
    )
)

line = (
    Line()
    .add_xaxis(
        xaxis_data=x_data
    )
    .add_yaxis(
        series_name="平均温度",
        y_axis=average_temperature,
        yaxis_index=2,
        color=colors[2],
    )
)

bar.overlap(line).render("multiple_y_axes.html")
  • 5. Двойная ось X
    • Нужно изменить исходный кодline.py(строка 61, изменить наdata = y_axis).
    • Если вы не хотите изменять исходный код, удалите строку 55 примера кода.xaxis_indexэтот параметр. после этогоaxisPointerОтображение данных будет несколько проблематичным. (Причиной проблемы является формат данных, т.к.Lineв исходном кодеxиyданные были объединены)

#!/usr/bin/env python
# coding=utf-8
from __future__ import unicode_literals

import pyecharts.options as opts
from pyecharts.charts import Line
from pyecharts.commons.utils import produce_js_func

"""
Gallery 使用 pyecharts 1.0.0
参考地址: https://echarts.baidu.com/examples/editor.html?c=multiple-x-axis

目前无法实现的功能:

1、暂无
"""

js_formatter = """function (params) {
        console.log(params);
        return '降水量  ' + params.value + (params.seriesData.length ? ':' + params.seriesData[0].data : '');
    }"""

(
    Line(init_opts=opts.InitOpts(width="1600px", height="800px"))
    .add_xaxis(
        xaxis_data=[
            "2016-1", "2016-2", "2016-3", "2016-4", "2016-5", "2016-6",
            "2016-7", "2016-8", "2016-9", "2016-10", "2016-11", "2016-12",
        ]
    )
    .extend_axis(
        xaxis_data=[
            "2015-1", "2015-2", "2015-3", "2015-4", "2015-5", "2015-6",
            "2015-7", "2015-8", "2015-9", "2015-10", "2015-11", "2015-12",
        ],
        xaxis=opts.AxisOpts(
            type_="category",
            axistick_opts=opts.AxisTickOpts(is_align_with_label=True),
            axisline_opts=opts.AxisLineOpts(
                is_on_zero=False, linestyle_opts=opts.LineStyleOpts(color="#6e9ef1")
            ),
            axispointer_opts=opts.AxisPointerOpts(
                is_show=True,
                label=opts.LabelOpts(
                    formatter=produce_js_func(js_formatter)
                ),
            ),
        ),
    )
    .add_yaxis(
        series_name="2015 降水量",
        is_smooth=True,
        symbol="emptyCircle",
        is_symbol_show=False,
        xaxis_index=1,
        color="#d14a61",
        y_axis=[2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3],
        label_opts=opts.LabelOpts(is_show=False),
        linestyle_opts=opts.LineStyleOpts(width=2),
    )
    .add_yaxis(
        series_name="2016 降水量",
        is_smooth=True,
        symbol="emptyCircle",
        is_symbol_show=False,
        color="#6e9ef1",
        y_axis=[3.9, 5.9, 11.1, 18.7, 48.3, 69.2, 231.6, 46.6, 55.4, 18.4, 10.3, 0.7],
        label_opts=opts.LabelOpts(is_show=False),
        linestyle_opts=opts.LineStyleOpts(width=2),
    )
    .set_global_opts(
        legend_opts=opts.LegendOpts(
        ),
        tooltip_opts=opts.TooltipOpts(trigger="none", axis_pointer_type="cross"),
        xaxis_opts=opts.AxisOpts(
            type_="category",
            axistick_opts=opts.AxisTickOpts(is_align_with_label=True),
            axisline_opts=opts.AxisLineOpts(
                is_on_zero=False, linestyle_opts=opts.LineStyleOpts(color="#d14a61")
            ),
            axispointer_opts=opts.AxisPointerOpts(
                is_show=True,
                label=opts.LabelOpts(
                    formatter=produce_js_func(js_formatter)
                ),
            ),
        ),
        yaxis_opts=opts.AxisOpts(
            type_="value",
            splitline_opts=opts.SplitLineOpts(
                is_show=True,
                linestyle_opts=opts.LineStyleOpts(opacity=1)
            )
        ),
    )
    .render("multiple_x_axes.html")
)

Два последних слова

  • В настоящее времяpyecharts-galleryОн постоянно обновляется, и вы можете поделиться своими собственными примерами и опытом. 👍
  • При этом я постоянно участвуюpyechartsоптимизация и обновления, которые, как мы надеемся, подтолкнут эту библиотеку к тому, чтобы она сталаPythonОдна из лучших библиотек визуализации данных. 💪
  • Наконец, разработчики могут присоединитьсяpyechartsВ процессе разработки вы можете предоставить больше PR и вопросов. 👏