0
点赞
收藏
分享

微信扫一扫

pyecharts Bar 柱状图 刷新界面动画效果AnimationOpts() 详解


目录

​​1、动画效果实现​​

​​2、效果预览​​

​​3、AnimationOpts() 详解​​

1、动画效果实现

"""
* @Author: xiaofang
* @Email: 983770299@qq.com
* @Description:
学习中遇到问题没人解答?小编创建了一个Python学习交流QQ群:732481539
寻找有志同道合的小伙伴,互帮互助,群里还有不错的视频学习教程和PDF电子书!
"""
from pyecharts import options as opts
from pyecharts.charts import Bar
from pyecharts.faker import Faker

c = (
Bar(
init_opts=opts.InitOpts(
animation_opts=opts.AnimationOpts(
animation_delay=1000, animation_easing="elasticOut"
)
)
)
.add_xaxis(Faker.choose())
.add_yaxis("A", Faker.values())
.add_yaxis("B", Faker.values())
.set_global_opts(title_opts=opts.TitleOpts(title="Bar-动画配置", subtitle="AnimationOpts"))
.render("12_bar_animation.html")
)

主要是在Bar()中新增如下代码,实现动画效果,刷新即可实现果冻般Q弹的感觉

init_opts=opts.InitOpts(
animation_opts=opts.AnimationOpts(
animation_delay=1000, animation_easing="elasticOut"
)
)



2、效果预览

pyecharts Bar 柱状图 刷新界面动画效果AnimationOpts() 详解_缓动

3、AnimationOpts() 详解


AnimationOpts() 可以设置如下参数:


animation: bool = True,
animation_threshold: Numeric = 2000,
animation_duration: Union[Numeric, JSFunc] = 1000,
animation_easing: Union[str] = "cubicOut",
animation_delay: Union[Numeric, JSFunc] = 0,
animation_duration_update: Union[Numeric, JSFunc] = 300,
animation_easing_update: Union[Numeric] = "cubicOut",
animation_delay_update: Union[Numeric, JSFunc] = 0,


各参数详解:

​# 是否开启动画,默认为 True 开启。​

​animation: bool = True,​

​# 是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画。默认 2000。​

​animation_threshold: Numeric = 2000,​

​# 初始动画的时长,默认值为 1000。​

​# 支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果:​

​animation_duration: Union[Numeric, JSFunc] = 1000,​

​# 初始动画的缓动效果。​

​# 不同的缓动效果可以参考,缓动示例 (https://www.echartsjs.com/gallery/editor.html?c=line-easing)。​

​animation_easing: Union[str] = "cubicOut",​

​# 初始动画的延迟,默认值为 0。​

​# 支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。​

​animation_delay: Union[Numeric, JSFunc] = 0,​

​# 数据更新动画的时长,默认值为 300。​

​# 支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果:​

​animation_duration_update: Union[Numeric, JSFunc] = 300,​

​# 数据更新动画的缓动效果。​

​# 不同的缓动效果可以参考,缓动示例 (https://www.echartsjs.com/gallery/editor.html?c=line-easing)。​

​animation_easing_update: Union[Numeric] = "cubicOut",​

​# 数据更新动画的延迟,默认值为 0。​

​# 支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。​

​animation_delay_update: Union[Numeric, JSFunc] = 0,​

举报

相关推荐

0 条评论