如何隐藏 Vega 图表上的三点下拉菜单?

How to hide the three-dot dropdown menu on a Vega chart?

我的网站中嵌入了一个简单的图表。使用 vega-lite 规范 v5。这是一个例子:

带有三个点的圆圈会触发一个带有一些操作的下拉菜单,包括在在线 vega 编辑器中打开图表。我不想向最终用户公开这些操作。

如何禁用菜单?

这称为“操作”菜单,可以通过用于显示图表的 vegaEmbed 调用中的 actions 选项来控制它。

可以通过设置隐藏菜单actions: false;它看起来像这样:

<div id="vis"></div>
<script type="text/javascript">
  var spec = "https://raw.githubusercontent.com/vega/vega-lite/master/examples/specs/bar.vl.json";
  vegaEmbed('#vis', spec, {"actions": false});
</script>

有关可用选项的更多信息,请访问 https://github.com/vega/vega-embed#options

如果你使用 React,你可以添加 actions={false} 来删除它

<VegaLite spec={spec} actions={false} />