[英]Can we add event listeners to “Vega-Lite” specification?
I am new to Vega and Vega-Lite. 我是Vega和Vega-Lite的新手。 I am creating a simple bar chart using Vega-Lite but I am not able to add any event listeners eg "hover".
我正在使用Vega-Lite创建一个简单的条形图,但我无法添加任何事件监听器,例如“悬停”。
I want to hover a bar and change the color of the bar. 我想悬停一个栏并改变栏的颜色。
If you're using Vega-Embed , it returns a promise with a reference to the view which allows you to use addEventListener
- explained in the docs here . 如果你正在使用Vega-Embed ,它会返回一个带有对视图的引用的promise,它允许你使用
addEventListener
- 在这里的文档中有解释 。
Here is an example: 这是一个例子:
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)
})
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.