前言

之前有写过一个Pyecharts的教程,囊落了一些基本图表的使用方法,但其实对于Pyecharts来说,能做远远不止如此,配合上JS代码可玩性是相当高的;

Image Name

本次项目整理了一些稍微进阶点的配置,包括渐变配色,文本样式配置等等;

后续会慢慢补充,各位如果有什么想法或者需求也欢迎评论或者私信我~


目前已经实现的功能如下:

  • ✅组合图表
    • Timeline —— 时间多图轮播
    • Tab —— 选项卡多图
    • Page —— 顺序多图
  • ✅多Y轴图表
  • ✅百分比显示
  • ✅文本样式配置
  • ✅图元样式配置
    • 基础配置
    • 渐变配色 —— 线性渐变
    • 渐变配色 —— 径向渐变
  • ✅背景颜色
  • ✅图形组件
    • 添加Logo
    • 让Logo动起来
    • 添加水印

计划中还未完成的:

  • 🔸坐标轴配置
  • 🔸线样式配置
  • 🔸外国地图使用

广告位:

In [1]:
from pyecharts.charts import *
from pyecharts.components import Table
from pyecharts import options as opts
from pyecharts.commons.utils import JsCode
import random
import datetime

组合图表

Timeline —— 时间线多图轮播

add_schema中支持的参数如下:

def add_schema(  
    # 坐标轴类型。可选:  
    # 'value': 数值轴,适用于连续数据。  
    # 'category': 类目轴,适用于离散的类目数据,为该类型时必须通过 data 设置类目数据。  
    # 'time': 时间轴,适用于连续的时序数据,与数值轴相比时间轴带有时间的格式化,在刻度计算上也有所不同,  
    # 例如会根据跨度的范围来决定使用月,星期,日还是小时范围的刻度。  
    # 'log' 对数轴。适用于对数数据。  
    axis_type: str = "category",  

    # 时间轴的类型。可选:  
    # 'horizontal': 水平  
    # 'vertical': 垂直  
    orient: str = "horizontal",  

    # timeline 标记的图形。  
    # ECharts 提供的标记类型包括 'circle', 'rect', 'roundRect', 'triangle', 'diamond',   
    # 'pin', 'arrow', 'none'  
    # 可以通过 'image://url' 设置为图片,其中 URL 为图片的链接,或者 dataURI。  
    symbol: Optional[str] = None,  

    # timeline 标记的大小,可以设置成诸如 10 这样单一的数字,也可以用数组分开表示宽和高,  
    # 例如 [20, 10] 表示标记宽为 20,高为 10。  
    symbol_size: Optional[Numeric] = None,  

    # 表示播放的速度(跳动的间隔),单位毫秒(ms)。  
    play_interval: Optional[Numeric] = None,  

    # 表示播放按钮的位置。可选值:'left'、'right'。  
    control_position: str = "left",  

    # 是否自动播放。  
    is_auto_play: bool = False,  

    # 是否循环播放。  
    is_loop_play: bool = True,  

    # 是否反向播放。  
    is_rewind_play: bool = False,  

    # 是否显示 timeline 组件。如果设置为 false,不会显示,但是功能还存在。  
    is_timeline_show: bool = True,  

    # 是否反向放置 timeline,反向则首位颠倒过来  
    is_inverse: bool = False,  

    # Timeline 组件离容器左侧的距离。  
    # left 的值可以是像 20 这样的具体像素值,可以是像 '20%' 这样相对于容器高宽的百分比,  
    # 也可以是 'left', 'center', 'right'。  
    # 如果 left 的值为'left', 'center', 'right',组件会根据相应的位置自动对齐  
    pos_left: Optional[str] = None,  

    # timeline 组件离容器右侧的距离。  
    # right 的值可以是像 20 这样的具体像素值,可以是像 '20%' 这样相对于容器高宽的百分比。  
    pos_right: Optional[str] = None,  

    # Timeline 组件离容器上侧的距离。  
    # left 的值可以是像 20 这样的具体像素值,可以是像 '20%' 这样相对于容器高宽的百分比,  
    # 也可以是 'top', 'middle', 'bottom'。  
    # 如果 left 的值为 'top', 'middle', 'bottom',组件会根据相应的位置自动对齐  
    pos_top: Optional[str] = None,  

    # timeline 组件离容器下侧的距离。  
    # bottom 的值可以是像 20 这样的具体像素值,可以是像 '20%' 这样相对于容器高宽的百分比。  
    pos_bottom: Optional[str] = "-5px",  

    # 时间轴区域的宽度, 影响垂直的时候时间轴的轴标签和轴之间的距离  
    width: Optional[str] = None,  

    # 时间轴区域的高度  
    height: Optional[str] = None,  

    # 时间轴的坐标轴线配置,参考 `series_options.LineStyleOpts`  
    linestyle_opts: Union[opts.LineStyleOpts, dict, None] = None,  

    # 时间轴的轴标签配置,参考 `series_options.LabelOpts`  
    label_opts: Optional[opts.LabelOpts] = None,  

    # 时间轴的图形样式,参考 `series_options.ItemStyleOpts`  
    itemstyle_opts: Union[opts.ItemStyleOpts, dict, None] = None,  
)
In [2]:
# 示例数据
begin = datetime.date(2020, 4, 1)
end = datetime.date(2020, 4, 20)

cate = ['Apple', 'Huawei', 'MI', 'Oppo', 'Vivo', 'Samsung']

# 随机生成数据的方法


def random_data(n): return [random.randint(100, 200) for i in range(n)]


# 新建一个timeline对象
tl = Timeline(
    init_opts=opts.InitOpts(
        theme='dark',
        height='600px',
        width='1000px'))
tl.add_schema(axis_type='time',
              # 是否自动播放
              is_auto_play=True,
              # 是否展示timeline组件
              is_timeline_show=True,
              # 标签显示去掉,文字有重叠
              label_opts=opts.LabelOpts(is_show=False))

for i in range((end - begin).days + 1):
    day = begin + datetime.timedelta(days=i)

    bar = Bar()
    bar.add_xaxis(cate)
    bar.add_yaxis('电商渠道', random_data(len(cate)))
    bar.add_yaxis('门店', random_data(len(cate)))
    bar.set_global_opts(
        title_opts=opts.TitleOpts(
            title="{} 手机厂商销量".format(day)))

    tl.add(bar, day)

tl.render_notebook()
Out[2]:

Tab —— 选项卡多图

In [3]:
# 示例数据
begin = datetime.date(2020, 4, 1)
end = datetime.date(2020, 4, 20)

cate = ['Apple', 'Huawei', 'MI', 'Oppo', 'Vivo', 'Samsung']

# 随机生成数据的方法


def random_data(n): return [random.randint(0, 100) for i in range(n)]


date_list = [str(begin + datetime.timedelta(days=i))
             for i in range((end - begin).days + 1)]

# 新建一个tab对象
tab = Tab()

for c in cate:
    day = begin + datetime.timedelta(days=i)

    line = Line(
        init_opts=opts.InitOpts(
            theme='dark',
            height='600px',
            width='1000px'))
    line.add_xaxis(date_list)
    line.add_yaxis('电商渠道', random_data(len(date_list)))
    line.add_yaxis('门店', random_data(len(date_list)))
    line.set_global_opts(title_opts=opts.TitleOpts(title="{} 手机销量".format(c)))

    tab.add(line, c)

tab.render_notebook()
Out[3]:

Page —— 顺序多图

In [4]:
# 示例数据
begin = datetime.date(2020, 4, 1)
end = datetime.date(2020, 4, 20)

cate = ['Apple', 'Huawei', 'MI', 'Oppo', 'Vivo', 'Samsung']

# 随机生成数据的方法


def random_data(n): return [random.randint(0, 100) for i in range(n)]


data1 = random_data(len(cate))
data2 = random_data(len(cate))

# 饼图
pie = Pie(
    init_opts=opts.InitOpts(
        theme='dark',
        height='400px',
        width='1000px'))
pie.add('', [list(z) for z in zip(cate, data1)],
        radius=["30%", "75%"],
        rosetype="radius")
pie.set_global_opts(
    title_opts=opts.TitleOpts(
        title="Pie-基本示例",
        subtitle="我是副标题"))
pie.set_series_opts(label_opts=opts.LabelOpts(formatter="{b}: {d}%"))


# 折线图
line = Line(
    init_opts=opts.InitOpts(
        theme='macarons',
        height='600px',
        width='1000px'))
line.add_xaxis(cate)
line.add_yaxis('电商渠道', data1,
               # 标记线,这里取平均值
               markline_opts=opts.MarkLineOpts(data=[opts.MarkLineItem(type_="average")]))
line.add_yaxis('门店', data2,
               # 平滑曲线
               is_smooth=True,
               # 标记点
               markpoint_opts=opts.MarkPointOpts(data=[opts.MarkPointItem(name="自定义标记点",
                                                                          coord=[cate[2], data2[2]], value=data2[2])]))
line.set_global_opts(
    title_opts=opts.TitleOpts(
        title="Line-基本示例",
        subtitle="我是副标题"))

# 水球图
liquid = Liquid(init_opts=opts.InitOpts(
    theme='essos',
    height='600px',
    width='600px'))
liquid.add(
    "lq",
    [0.5588],
    label_opts=opts.LabelOpts(
        font_size=50,
        formatter=JsCode(
            """function (param) {
                        return (Math.floor(param.value * 10000) / 100) + '%';
                    }"""
        ),
        position="inside",
    ),
)
liquid.set_global_opts(title_opts=opts.TitleOpts(title="Liquid-基本示例"))

gauge = Gauge(init_opts=opts.InitOpts(theme='chalk',width="400px", height="400px"))
gauge.add(series_name="业务指标", data_pair=[["完成率", 55.5]])
gauge.set_global_opts(
        title_opts=opts.TitleOpts(title="Gauge-基本示例"),
        legend_opts=opts.LegendOpts(is_show=False),
        tooltip_opts=opts.TooltipOpts(is_show=True, formatter="{a} <br/>{b} : {c}%"),)


page = Page(layout=Page.DraggablePageLayout)
page.add(pie, line, liquid, gauge)
page.render_notebook()
Out[4]:

多Y轴图表

多Y轴图表在日常工作中是一个很常见的需求,具体实现方式如下:

其实需要注意的一点是在add_yaxisz_level这个参数,在下图这个例子中,我们需要将line图中的z_level设置为大于0的值,不然折线会被置于直方图下发,无法被选中。

In [5]:
# 月份
month = ["{}月".format(i) for i in range(1, 13)]


def random_data(n): return [random.randint(0, 100) for i in range(n)]


bar = Bar(init_opts=opts.InitOpts(
    theme='dark',
    height='600px',
    width='1000'))
bar.add_xaxis(month)
bar.add_yaxis('', random_data(len(month)),
              # 指定Y轴,默认的是0
              yaxis_index=0)
# 加一个Y轴
bar.extend_axis(
    yaxis=opts.AxisOpts(
        type_="value",
        position="right"
    )
)
bar.set_global_opts(
    title_opts=opts.TitleOpts(
        title="多Y轴示例"))


line = Line()
line.add_xaxis(month)
line.add_yaxis('', random_data(len(month)),
               # 指定Y轴
               yaxis_index=1,
               # 将折线图置于直方图之上,否则无法选中
               z_level=1)

overlap = bar.overlap(line)
overlap.render_notebook()
Out[5]:

百分比显示

在饼图,漏斗图,仪表盘中我们可以通过formater = {d}将数值转为百分比形式,但在其他图表中就无法直接实现了。

In [6]:
month = ["{}月".format(i) for i in range(1, 13)]


def random_data(n): return [random.random() for i in range(n)]


# 将浮点数转为百分比的JavaScript代码,用于标签和提示
per_js = """function (param) {return Math.floor(param.value[1] * 100)+'%';}"""

# 将浮点数转为百分比的JavaScript代码,用于坐标轴
ax_per_js = """function (value) {return Number(value *100)+'%';}"""


line = Line(init_opts=opts.InitOpts(
    theme='dark',
    height='600px',
    width='1000'))

line.add_xaxis(month)

line.add_yaxis('百分比', random_data(len(month)),
               label_opts=opts.LabelOpts(
    # 通过执行JavaScript代码将标签转为百分比
    formatter=JsCode(per_js)))

# 为方便对比,添加一条不做处理的折线
line.add_yaxis('默认显示', random_data(len(month)))

# 全局配置
line.set_global_opts(
    yaxis_opts=opts.AxisOpts(
        # 坐标轴也显示百分比
        axislabel_opts=opts.LabelOpts(formatter=JsCode(ax_per_js)),),
    title_opts=opts.TitleOpts(
        title="显示百分比"),
    tooltip_opts=opts.TooltipOpts(
        # 通过执行JavaScript代码将提示转为百分比
        is_show=True, formatter=JsCode(per_js)))

line.render_notebook()
Out[6]:

文本样式配置

此次会以标题的设置为例,对于标签,坐标轴刻度,选定提示等等,只要是包含文本的都可以通过如下方式来实现;

In [7]:
cate = ['Apple', 'Huawei', 'MI', 'Oppo', 'Vivo', 'Samsung']

# 随机生成数据的方法


def random_data(n): return [random.randint(0, 100) for i in range(n)]


bar = Bar()
bar.add_xaxis(cate)
bar.add_yaxis('电商渠道', random_data(len(cate)))
bar.add_yaxis('门店', random_data(len(cate)))

# 以调整标题样式为例
bar.set_global_opts(
    title_opts=opts.TitleOpts(
        title="各大手机厂商销量对比",
        title_textstyle_opts=opts.TextStyleOpts(
            # 文本颜色
            color='red',
            # 字体风格
            font_style='oblique',
            # 字体粗细
            font_weight='bold',
            # 字体设置
            font_family='Microsoft YaHei',
            # 字体大小
            font_size=30)))

bar.render_notebook()
Out[7]:

图元样式配置

基础配置

In [8]:
cate = ['Apple', 'Huawei', 'MI', 'Oppo', 'Vivo', 'Samsung']

# 随机生成数据的方法


def random_data(n): return [random.randint(0, 100) for i in range(n)]


bar = Bar(init_opts=opts.InitOpts(
    theme='dark',
    height='600px',
    width='1000'))
bar.add_xaxis(cate)
bar.add_yaxis('电商渠道', random_data(len(cate)),
              itemstyle_opts=opts.ItemStyleOpts(
    border_color='rgb(220,220,220)',
    color='rgb(255,215,0)'))
bar.add_yaxis('门店', random_data(len(cate)),
              itemstyle_opts=opts.ItemStyleOpts(
    # 描边线颜色
    border_color='white',
    # 颜色
    color='blue',
    # 透明度,范围0-1,1表示不透明
    opacity=0.5))

# 以调整标题样式为例
bar.set_global_opts(
    title_opts=opts.TitleOpts(
        title="各大手机厂商销量对比"))

bar.render_notebook()
Out[8]:

渐变配色 —— 线性

从0到1实现线性渐变,示例Js代码:

new echarts.graphic.LinearGradient(  
    0,  //x0  
    1,  //y0  
    0,  //x1  
    0,  //y1  
    [{offset: 0, color: '#008B8B'},  //起始颜色  
        {offset: 1, color: '#FF6347'} //终止颜色  
        ],  
    false  
    )
In [9]:
cate = ['Apple', 'Huawei', 'MI', 'Oppo', 'Vivo', 'Samsung']

# 随机生成数据的方法


def random_data(n): return [random.randint(0, 100) for i in range(n)]


# 渐变配色JS代码
color_js_1 = """new echarts.graphic.LinearGradient(0, 1, 0, 0,
    [{offset: 0, color: '#008B8B'}, {offset: 1, color: '#FF6347'}], false)"""

# 渐变配色JS代码, 包含三种颜色的渐变
color_js_2 = """new echarts.graphic.LinearGradient(0, 1, 0, 0,
    [{offset: 0, color: '#008B8B'}, {offset: 0.5, color: '#FFA500'}, {offset: 1, color: '#FF6347'}], false)"""

bar = Bar(init_opts=opts.InitOpts(
    theme='dark',
    height='600px',
    width='1000'))
bar.add_xaxis(cate)
bar.add_yaxis('两种颜色', random_data(len(cate)),
              itemstyle_opts=opts.ItemStyleOpts(
    border_color='rgb(220,220,220)',
    # 渐变配色
    color=JsCode(color_js_1)))
bar.add_yaxis('三种颜色', random_data(len(cate)),
              itemstyle_opts=opts.ItemStyleOpts(
    # 描边线颜色
    border_color='white',
    # 渐变配色
    color=JsCode(color_js_2),
    # 透明度,范围0-1,1表示不透明
    opacity=1))

# 以调整标题样式为例
bar.set_global_opts(
    title_opts=opts.TitleOpts(
        title="线性渐变"))

bar.render_notebook()
Out[9]:

渐变配色 —— 径向渐变

径向渐变,从圆心向四周渐变,示例Js代码:

new echarts.graphic.RadialGradient(  
                    0.4,  //圆心X  
                    0.3,  //圆心Y  
                    0.5, // 半径  
                    [{offset: 0,  //圆心颜色  
                      color: 'rgb(251, 118, 123)'},  
                     {offset: 1,  //圆周颜色  
                      color: 'rgb(204, 46, 72)'}  
                      ])
In [10]:
def random_data(n): return [random.random() for i in range(n)]


color_js = """new echarts.graphic.RadialGradient(
                    0.4, 0.3, 0.5,
                    [{offset: 0,
                      color: 'rgb(251, 118, 123)'},
                     {offset: 1,
                      color: 'rgb(204, 46, 72)'}
                      ])"""

scatter = Scatter(init_opts=opts.InitOpts(
    theme='dark',
    height='600px',
    width='1000'))
scatter.add_xaxis(random_data(50))

scatter.add_yaxis("", [(x, y) for x, y in zip(random_data(50), random_data(50))],
                  itemstyle_opts=opts.ItemStyleOpts(
    # 渐变配色
    color=JsCode(color_js),
    # 透明度,范围0-1,1表示不透明
    opacity=0.7))

scatter.set_global_opts(
    title_opts=opts.TitleOpts("径向渐变"),
    visualmap_opts=opts.VisualMapOpts(
        is_show=False, type_='size', range_size=[
            5, 50], min_=0, max_=1),
    xaxis_opts=opts.AxisOpts(
        # 设置坐标轴为数值类型
        type_="value", ))
scatter.set_series_opts(label_opts=opts.LabelOpts(is_show=False))

scatter.render_notebook()
Out[10]:

背景颜色

默认的纯色背景不好看?那就换个渐变配色吧~

In [11]:
month = ["{}月".format(i) for i in range(1, 13)]

# 随机生成数据的方法


def random_data(n): return [random.randint(50, 100) for i in range(n)]


# 背景渐变配色JS代码
bg_color_js = """new echarts.graphic.LinearGradient(0, 0, 1, 1,
    [{offset: 0, color: '#008B8B'}, {offset: 1, color: '#FF6347'}], false)"""

# 图元颜色JS代码
item_color_js = """new echarts.graphic.LinearGradient(0, 1, 0, 0,
    [{offset: 0, color: '#008B8B'}, {offset: 1, color: '#FFA500'}], false)"""

bar = Bar(init_opts=opts.InitOpts(
    # 背景颜色配置
    bg_color=JsCode(bg_color_js),
    height='600px',
    width='1000'))

bar.add_xaxis(month)

bar.add_yaxis('', random_data(len(month)),
              itemstyle_opts=opts.ItemStyleOpts(
    # 描边线颜色
    border_color='white',
    # 渐变配色
    color=JsCode(item_color_js),
    # 透明度,范围0-1,1表示不透明
    opacity=1))

# 以调整标题样式为例
bar.set_global_opts(
    title_opts=opts.TitleOpts(
        title="背景颜色配置"))

bar.render_notebook()
Out[11]:

图形组件

给图表加上一个Kesci的Logo, 记住用png格式的图片,jpg格式的是无法有透明效果的~

Image Name

In [23]:
years = ["{}年".format(i) for i in range(2003, 2019)]

# 随机生成数据的方法


def random_data(n): return [random.randint(10, 30) for i in range(n)]



# 图元颜色JS代码
item_color_js = """new echarts.graphic.LinearGradient(0, 1, 0, 0,
    [{offset: 0, color: '#008B8B'}, {offset: 1, color: '#FFA500'}], false)"""

bar = Bar(init_opts=opts.InitOpts(
    # 背景颜色配置
    theme='dark',
    height='600px',
    width='1000'))

bar.add_xaxis(years)

bar.add_yaxis('', random_data(len(years)),
              itemstyle_opts=opts.ItemStyleOpts(
    # 描边线颜色
    border_color='white',
    # 渐变配色
    color=JsCode(item_color_js),
    # 透明度,范围0-1,1表示不透明
    opacity=1))

# 以调整标题样式为例
bar.set_global_opts(
    title_opts=opts.TitleOpts(
        title="加一个Logo~"),
    graphic_opts=[
            opts.GraphicImage(
                graphic_item=opts.GraphicItem(
                    id_="logo", 
                    # 距离右边界距离
                    right='10%', 
                    # 距离上边界距离
                    top='10%', 
                    # 负数则显示在图表下层
                    z_level=-1
                ),
                graphic_imagestyle_opts=opts.GraphicImageStyleOpts(
                    # 指定图片地址,最好选用png
                    image="https://cdn.kesci.com/upload/image/q9nujmdmps.png",
                    # 长款设置
                    width=484,
                    height=60,
                    opacity=1,),
            )
        ],)

bar.render_notebook()
Out[23]:

让Logo动起来

小鲸鱼Logo~

Image Name


右上角Logo实际是可以转动的,但是在notebook中渲染不出效果,可以通过.render()保存到本地通过浏览器打开查看效果~

In [14]:
years = ["{}年".format(i) for i in range(2003, 2019)]

# 随机生成数据的方法


def random_data(n): return [random.randint(10, 30) for i in range(n)]



# 图元颜色JS代码
item_color_js = """new echarts.graphic.LinearGradient(0, 1, 0, 0,
    [{offset: 0, color: '#008B8B'}, {offset: 1, color: '#FFA500'}], false)"""

bar = Bar(init_opts=opts.InitOpts(
    chart_id="1234",
    # 背景颜色配置
    theme='light',
    height='600px',
    width='1000'))

bar.add_xaxis(years)

bar.add_yaxis('', random_data(len(years)),
              itemstyle_opts=opts.ItemStyleOpts(
    # 描边线颜色
    border_color='white',
    # 渐变配色
    color=JsCode(item_color_js),
    # 透明度,范围0-1,1表示不透明
    opacity=1))

# 以调整标题样式为例
bar.set_global_opts(
    title_opts=opts.TitleOpts(
        title="加一个Logo~"),
    graphic_opts=[
            opts.GraphicImage(
                graphic_item=opts.GraphicItem(
                    id_="logo", 
                    # 距离右边界距离
                    right='10%', 
                    # 距离上边界距离
                    top='10%', 
                    # 负数则显示在图表下层
                    z=-1,
                    bounding="raw", origin=[75, 75]
                ),
                graphic_imagestyle_opts=opts.GraphicImageStyleOpts(
                    # 指定图片地址,最好选用png
                    image="https://cdn.kesci.com/upload/image/q9nvj3cvu.png?imageView2/0/w/320/h/320",
                    # 长宽设置
                    width=200,
                    height=150,
                    opacity=1,),
            )
        ],)

# 此部分代码来自http://gallery.pyecharts.org/#/Graphic/graphic_image_with_js
grid = Grid(init_opts=opts.InitOpts(chart_id="1234"))
grid.add(
        chart=bar,
        grid_opts=opts.GridOpts(pos_left="5%", pos_right="4%", pos_bottom="5%"),
    )
grid.add_js_funcs(
        """
        var rotation = 0;
        setInterval(function () {
            chart_1234.setOption({
                graphic: {
                    id: 'logo',
                    rotation: (rotation += Math.PI / 360) % (Math.PI * 2)
                }
            });
        }, 30);
    """
    )

grid.render_notebook()
Out[14]:

添加水印

当然用作水印只是我想出来的一个用途,你也可以用来标注一些图表上忽略掉的事件~

In [21]:
years = ["{}年".format(i) for i in range(2003, 2019)]

# 随机生成数据的方法


def random_data(n): return [random.randint(10, 30) for i in range(n)]



# 图元颜色JS代码
item_color_js = """new echarts.graphic.LinearGradient(0, 1, 0, 0,
    [{offset: 0, color: '#008B8B'}, {offset: 1, color: '#FFA500'}], false)"""

bar = Bar(init_opts=opts.InitOpts(
    # 背景颜色配置
    theme='dark',
    height='600px',
    width='1000'))

bar.add_xaxis(years)

bar.add_yaxis('', random_data(len(years)),
              itemstyle_opts=opts.ItemStyleOpts(
    # 描边线颜色
    border_color='white',
    # 渐变配色
    color=JsCode(item_color_js),
    # 透明度,范围0-1,1表示不透明
    opacity=1))


bar.set_global_opts(
    title_opts=opts.TitleOpts(
        title="加个水印~"),
    graphic_opts=[opts.GraphicGroup(graphic_item=opts.GraphicItem(
                                                   # 将组件进行旋转
                                                   rotation=JsCode("Math.PI / 4"),
                                                   bounding="raw",
                                                   right=110,
                                                   bottom=110,
                                                   z=100),
                                               # 文字显示区域配置
                                               children=[
                                                   # 文字框
                                                   opts.GraphicRect(
                                                       graphic_item=opts.GraphicItem(
                                                           left="center", top="center", z=100
                                                       ),
                                                       graphic_shape_opts=opts.GraphicShapeOpts(
                                                           width=400, height=50
                                                       ),
                                                       graphic_basicstyle_opts=opts.GraphicBasicStyleOpts(
                                                           # 颜色配置,这里设置为黑色,透明度为0.5
                                                           fill="rgba(0,0,0,0.5)"
                                                       ),
                                                   ),
                                                   # 文本设置
                                                   opts.GraphicText(
                                                       graphic_item=opts.GraphicItem(
                                                           left="center", top="center", z=100
                                                       ),
                                                       graphic_textstyle_opts=opts.GraphicTextStyleOpts(
                                                           # 要显示的文本
                                                           text='AwesomeTang',
                                                           font="bold 26px Microsoft YaHei",
                                                           graphic_basicstyle_opts=opts.GraphicBasicStyleOpts(
                                                               fill="#fff"
                                                           ),
                                                       ),
                                                   ),
                                               ],
                                            )
                                    ],
    )

bar.render_notebook()
Out[21]:
来源:https://www.heywhale.com/mw/project/5e9b2f78ebb37f002c6111ca