Vega Lite:实现无循环的柱状图平滑过渡动画
关于Vega-Lite实现触发式停止动画的疑问
我找到一篇讲解Vega-Lite动画可视化的优质文章,不过目前我想搞清楚:能不能在Vega-Lite里实现从0平滑过渡到目标数值后自动停止的动画?比如由筛选器变化这类操作触发的柱状图动画。有没有人知道这是否可行?
附上我尝试的示例代码:
{ "width": 400, "height": 220, "signals": [ { "name": "ceiling_value", "value": 4000 }, { "name": "increment", "value": 1, "on": [ { "events": "timer{70}", "update": "increment + 500" } ] } ], "data": [ { "name": "dataset", "transform": [ { "type": "formula", "as": "day", "expr": "datum['day']" }, { "type": "formula", "as": "value", "expr": "clamp(datum['zero_measure'] + increment, 0, ceiling_value)" } ] } ], "scales": [ { "name": "xscale", "type": "band", "domain": { "data": "dataset", "field": "day" }, "range": "width" }, { "name": "yscale", "type": "linear", "domain": [0, 6000], "range": "height" } ], "axes": [ { "orient": "left", "scale": "yscale" }, { "orient": "bottom", "scale": "xscale" } ], "marks": [ { "type": "rect", "from": {"data": "dataset"}, "encode": { "enter": { "x": { "scale": "xscale", "field": "day" }, "width": { "scale": "xscale", "band": 0.8, "offset": -1 }, "fill": { "value": "steelblue" }, "cornerRadius": {"value": 4} }, "update": { "y": { "scale": "yscale", "field": "value" }, "y2": { "scale": "yscale", "value": 0 } } } } ] }
内容的提问来源于stack exchange,提问作者tomecsek
相关产品推荐
相关产品推荐

