Vega 可视化 - 如何在使用 Vega 视图时启用操作

Question

我在我的 Django 项目中使用维加图表。到目前为止，我一直使用 vegaEmbed 在网页上显示图表，但现在我想切换到 vega 视图，但我无法在任何地方找到如何在使用 vega 视图时启用操作。

这是我的 vegaEmbed 代码：

    `<script>
      var {{ c.ident }} = {{ c.jSon|safe }}
          var {{ c.ident }}_opt = {
                  actions: true
                }
          vegaEmbed('#{{ c.ident }}', {{ c.ident }}, {{ c.ident }}_opt);
        vegaEmbed('#{{ c.ident }}', {{ c.ident }});
    </script>`

而这段带有 vega 视图的代码：

        `<script>
            var vegaJson = {{ jSon|safe }};
            var view = new vega.View(vega.parse(vegaJson))
                    .renderer('svg')  
                    .initialize('#chartDiv') 
                    .hover()             
                    .run();

            window.onresize = function (event) {
              view.signal('width', event.target.innerWidth - 200)
                  .signal('height', event.target.innerHeight - 450)
                  .run('enter');
            }
        </script>`

知道如何在使用 vega 视图时启用操作吗？

Answer 1

操作菜单不是由 vega 视图定义的 API，它是在 vega-embed 中定义的。

Here 是 vega-embed 创建操作菜单的方式。

如果你想避免使用 Vega-Embed 并且你仍然想要一个类似于 Vega-Embed 实现的操作菜单，你必须在你的 vega 视图脚本中编写类似的代码。

Vega 可视化 - 如何在使用 Vega 视图时启用操作

Vega visualization - how to enable actions when using vega view

javascript

django

visualization

vega

vega-lite