Vega 可視化 - 如何在使用 vega 視圖時啟用操作

Question

我在我的 django 項目中使用 vega 圖表。 到目前為止，我一直使用 vegaEmbed 在 web 頁面上顯示圖表，但現在我想切換到 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 中定義的。

以下是 vega-embed 如何創建操作菜單。

如果你想避免使用 Vega-Embed 並且你仍然想要一個類似於 Vega-Embed 實現的操作菜單，你將不得不在你的 vega 視圖腳本中編寫類似的代碼。