我们可以将事件侦听器添加到“Vega-Lite”规范吗?

2023-12-31

我是 Vega 和 Vega-Lite 的新手。我正在使用 Vega-Lite 创建一个简单的条形图,但我无法添加任何事件侦听器,例如“徘徊”。

我想将鼠标悬停在一个栏上并更改该栏的颜色。


如果您正在使用Vega嵌入 https://github.com/vega/vega-embed,它返回一个带有对视图的引用的承诺,该视图允许您使用addEventListener - 在此处的文档中进行了解释 https://github.com/vega/vega-view#event-handling.

这是一个例子:

const width = 600
const color = blue
embed(element, {
    $schema: 'https://vega.github.io/schema/vega-lite/3.0.0-rc6.json',
    data: { 'values': data },
    mark: {
        type: 'line',
        color,
        point: {
            color,
        }
    },
    width,
    height: width / 2,
    encoding: {
        'x': {
            field: 'label',
            type: 'temporal',
        },
        'y': {
            field: 'value',
            type: 'quantitative',
        },
    }
}).then(({spec, view}) => {
    view.addEventListener('mouseover', function (event, item) {
        console.log(item.datum)
    })
})
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

我们可以将事件侦听器添加到“Vega-Lite”规范吗? 的相关文章

  • 将自定义误差线添加到 seaborn regplot 和 residplot

    有没有一种方法可以将自定义错误栏添加到seaborn regplot和residplot中 就像使用yerr对matplotlib错误栏所做的那样 例子在这里 如果我只是添加 yrr 参数就会发生错误 import seaborn as s
  • 使用 CSS Grid,从任何地方滚动 div(不使用 jQuery 插件)

    div 怎样才能 scroll content https jsfiddle net blehmanade x1k3rhj7 33 可以从页面上的任何位置滚动吗 现在 scroll content仅当鼠标位于其上方时才可滚动 但是 当鼠标位
  • 如何按升序或降序对 Seaborn 条形图进行排序 [重复]

    这个问题在这里已经有答案了 EXCEL 文件包含有关 7000 个 Apple App store 的信息 如下所示 这是我的代码 gt import seaborn as sns import matplotlib pyplot as p
  • GeoJson 世界数据库 [关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我正在开发一个项目 需要使用 d3 js 显示国家和城市的地图 实际上 D3支持GeoJson格式 通常
  • 根据边界动态设置初始 d3 缩放 - V4

    我要在页面上显示大量节点 大多数情况下 由于节点放置 圆圈会超出屏幕的可见区域 有没有办法根据节点的整个边界框动态设置初始缩放级别 以便所有节点都适合屏幕的可见区域 Updated 我为此添加了一个小提琴https jsfiddle net
  • 当以编程方式触发 d3.behavior.zoom 事件时,如何设置平移和缩放的初始值?

    下面示例中的方块是具有初始平移和比例设置的 SVG 组的一部分 单击正方形会启动缩放过渡 但过渡设置的初始值与我的默认值不同 这一点从过渡开始时的不和谐就可以明显看出 如何在以编程方式启动的缩放过渡上设置平移和缩放的初始值 var svg
  • 增加 D3 图中边缘的可点击区域

    我有一个由 d3 制作的图 dagre d3 位于其顶部用于绘制有向图 这给出了我对渲染图表的期望 要编辑构建图表的数据 每个元素都是可单击的 这对于使用标签渲染边缘的情况来说很好 但它们并不总是有标签 导致未标记的边缘很难单击进行编辑 分
  • 如何在“object”标签内选择 SVG?

    HTML 页面的内容如下所示 方法如下script js looks var tooltip d3 select body append div style position absolute sty
  • 平移/缩放顺序尺度?

    我正在使用 d3 渲染简化的甘特图 并使用 d3 behavior zoom 进行平移和缩放 x 刻度是一个时间刻度 稍微修改为列中的中心日历日等 并且工作得很好 但是我在决定如何缩放 平移 y 刻度时遇到问题 其域是通常会出现的任务列表图
  • iOS 上有像 JUNG 这样的可视化框架吗?

    有没有类似的可视化框架JUNG http jung sourceforge net applet index html对于iOS 我想实现类似的东西this http prefuse org gallery graphview iOS 上最
  • 获取现有 SVG 元素的属性并使用 d3.js 绑定为数据

    我有一个现有的 svg 元素 例如
  • 根据子节点数量动态调整 d3 树布局的大小

    从这个例子来看http mbostock github com d3 talk 20111018 tree html http mbostock github com d3 talk 20111018 tree html我已经建立了一个d3
  • 单个 Vegalite 图中可以有面和层吗?

    我很难理解为什么层规范如下所示 layer encoding facet field FEATURE VALUE x field DATE type temporal y field VALUE type quantitative mark
  • 如何精确缩放已翻译的d3地图

    我有一张已翻译的地图 以使其正确适合画布 我正在尝试实现一种缩放它的方法 它确实有效 但是当您放大时它会远离中心 而不是以鼠标甚至画布为中心 这是我的代码 function map data total views var xy d3 ge
  • 如何处理 d3 中 Beeswarm 图中的碰撞?

    我一直在玩这个例子here https gf neocities org co2bs co2bee html一会儿 我想做的是突出显示图中的单个节点 圆圈 通过使用边框使其变大 稍后我也想在其中添加文本或字母 目前 我已经圈了Bhutan图
  • 多个链接 dc.js 图表的 d3-tooltips

    我正在寻找修改 dc js 的开箱即用工具提示 似乎有一个解决方案使用d3 js 工具提示 https github com Caged d3 tip as in 这个问题 https stackoverflow com questions
  • 如何为分层线图创建图例

    基本上我拥有的是一个由多个折线图分层的折线图 由于每个图表只有一条线 因此不会自动生成图例 那么获取图表图例的最佳方法是什么 我一直在考虑尝试转换我的数据集 这是 2019 年至 2020 年 6 月期间 CDC 的每周死亡总数 csv 的
  • D3 删除千位的逗号分隔符

    我有一个包含 3 列的 json 其中一列是 年份 该列仅包含年份 没有日期 当我在 x 轴上绘制它时 年份会以逗号分隔符表示数千 所以在 json 中 日期的格式是 Year 1990 在 x 轴上 结果是 1 990 我一直在试图弄清楚
  • 如何在 d3.js 中填充 svg 圆圈内的图像

    这是我在 svg 中填充圆圈的代码 var svgContainer d3 select body append svg attr width 1000 attr height 1000 var circles svgContainer s
  • 动画 D3 地球仪 (d3.geo.azimuthal)

    我对 d3 javascript 库有疑问 我想使用方位角 http mbostock github com d3 talk 20111018 azimuthal html地球 我想从地球上的经度和纬度坐标插入点 并使地球动画化 而无需使用

随机推荐

  • 如何在自动布局中使用约束标识符以及如何使用标识符更改约束? [迅速]

    当我在 Xcode 7 中编辑约束时 我发现标识符Interface Builder 中的字段 约束的标识符是什么 如何使用它 使用标识符我可以以编程方式访问约束并更改常量吗 我的问题是该标识符为什么有帮助以及有何帮助 有没有办法通过在子视
  • 如何使用带有空格键的 Bootstrap Tags 输入插件提交标签?

    我正在构建一个带有字段的表单 该字段使用Bootstrap标签输入插件 http timschlechter github io bootstrap tagsinput examples 一旦用户单击该插件 该插件就会输入一个标签Enter
  • 获取列表中函数的名称

    我希望实现什么 所以我想在函数列表中获取函数的名称 这是一个例子 foo list foo1 sum foo2 mean 我想从中提取什么foo is list sum mean 我希望它是一个函数 意思是 gt foo list foo1
  • 使用反射从dll调用方法后获取返回值

    我正在使用反射加载 dll 并尝试调用返回List
  • TPL DataFlow处理异常的正确方法

    我在使用 TPL DataFlow 管理队列 数据库 并将工作重定向到网格计算服务的 Windows 服务中遇到问题 在某一时刻 BufferBlock 停止释放任务 我不知道为什么 我认为这是因为在执行某些任务期间发生了一些异常 但它们被
  • Laravel 基本 HTTP 身份验证检查返回 False

    我使用 Laravel 中提供的基本 HTTP 身份验证来登录我的网站 然而 当我打电话时Auth Check 我总是得到false即使我已登录 也会得到响应 Does Auth Check 不适用于基本身份验证模型 如果不能 是否有任何方
  • 函数返回 Ajax 响应 - 值未定义? jQuery Ajax [重复]

    这个问题在这里已经有答案了 当我警告 jsonServerResponse 函数返回的值时 它的值是未定义的 尽管 JSON 是从 process php 页面返回的 function jsonServerResponse operatio
  • nginx:access.log 和 error.log 文件为空

    我刚刚使用命令在 Ubuntu 14 04 上安装了 nginx sudo apt get install nginx 现在 当我打开浏览器并输入地址时localhost然后我正确地显示了 欢迎来到 nginx 页面 另外 我检查了位于的配
  • Firebase 数据库未找到类错误 (NoClassDefFoundError)

    我有一个使用多个子模块的大型项目 我已将 firebase 数据库依赖项添加到我的项目中包含的模块之一 当本地测试模块作为开放项目包含时 一切正常 当使用封闭模块构建时 我的模块是aar文件 我收到以下错误 java lang NoClas
  • 如何重命名 WordPress 管理仪表板上的 WooCommerce 选项卡下的菜单选项卡

    我需要帮助重命名 WordPress 管理上 woocommerce 选项卡下的选项卡菜单项 我们安装了一个插件 该插件显示为 woocommerce 选项卡上的子菜单 有人可以帮我解决这个问题吗 我发现下面的代码可以重命名选项卡菜单 但我
  • 属性不应返回数组

    是的 我知道这个问题之前已经讨论过很多次了 我阅读了有关这个问题的所有帖子和评论 但似乎仍然无法理解一些东西 MSDN 提供的解决此违规问题的选项之一是返回收藏 or an 界面这是由一个实现的收藏 在访问该属性时 无论它多么明显并不能解决
  • Flex 默认规则

    如何自定义 Flex 的默认操作 我发现类似 的内容 但当我运行它时 它显示 柔性扫描仪卡住 还有 规则仅添加一条规则 因此它也不起作用 我想要的是 comment comment return 1 default return 0 lt
  • &'a T 是否意味着 T: 'a?

    从我自己的理解和实验来看 这似乎是正确的 但我还没有找到记录它的权威来源 Rust by Example 有一个bounds https doc rust lang org rust by example scope lifetime li
  • Google Play 中不允许使用 com.example 包名称

    我是 Android 应用程序开发新手 我正在创建简单的 Android 应用程序 导出 android 应用程序并将包名称指定为AndroidManifestfile包名为 com example zingyminds apk 现在我得到
  • 使用 FFT 进行高斯图像滤波

    对于图像分割 我使用 OpenCV 的高斯特征差异GaussianBlur 范围从 0 8 到 8 43 指数步长为 1 4 我的图像尺寸为 4096 x 2160 因此这需要相当长的时间 在一个核心上需要 8 秒 这在处理视频时相当长 您
  • 如何更改活动/选定选项卡的颜色?

    我希望当未选择选项卡时颜色为默认灰色 但作为我的颜色tabBarColor选择选项卡时的颜色 我找不到更改标签栏中标题颜色的方法 我怎样才能做到这一点 这是我的代码 Home screen TabNavigator Home screen
  • lub(T1,...Tn) 是什么意思?

    以下引用来自 JLS 14 20 http docs oracle com javase specs jls se8 html jls 14 html jls 14 20 异常参数的声明类型 将其类型表示为 与替代方案 D1 的结合D2 D
  • OpenCV 霍​​夫圆

    我使用 Xcode 和 c 我已经从以下位置复制了 HoughCircles 代码OpenCV 文档 http opencv willowgarage com documentation cpp feature detection html
  • 在 SageMath 中运行时使用 Dask 会抛出 ImportError

    最近 我一直在尝试使用 Dask 并行化一些 Sage 运行 OSX 11 2 3 的 MacBook Pro 上的 Sage 9 4 代码 我遇到的问题是 虽然我可以在 Sage 中运行 Dask 但每当我包含任何非 纯 python 代
  • 我们可以将事件侦听器添加到“Vega-Lite”规范吗?

    我是 Vega 和 Vega Lite 的新手 我正在使用 Vega Lite 创建一个简单的条形图 但我无法添加任何事件侦听器 例如 徘徊 我想将鼠标悬停在一个栏上并更改该栏的颜色 如果您正在使用Vega嵌入 https github c