我正在尝试在Vega编辑器上使用Vega创建一个简单的条形图。
要重新创建我的问题,请导航至this bar chart example on vega site,然后尝试如下更改文本标记的text属性:
原文:"text": {"signal": "tooltip.amount"},
修改为:"text": {"signal": "tooltip.amount + ' + ' + tooltip.category"},
当没有悬停事件发生时,这会导致undefined + undefined
显示在图表的左上角。如何解决此问题以确保其不显示? (问题如下所示)
我认为这与刻度和文本标记的工作方式有关,但是我无法找出解决方案。尝试通过将category设置为null并在配置标记不透明度时对其进行测试,从而在鼠标悬停事件中添加默认值,但这没有用。为此的代码(仅在网站上指定对原始示例的更新):
"signals": [
{
"name": "tooltip",
"value": {"category":null},
"on": [
{"events": "rect:mouseover", "update": "datum"},
{"events": "rect:mouseout", "update": "{'category':null}"}
]
}
],
...
"marks": [
...
{
"type": "text",
"encode": {
...
"update": {
"text": {"signal": "tooltip.amount + ' + ' tooltip.category"},
"fillOpacity": [
{"test": "datum === tooltip && tooltip.category!=null", "value": 0},
{"value": 1}
]
}
}
}
答案 0 :(得分:0)
感谢朋友帮助我解答问题
"text": [
{
"signal": "tooltip.amount + ' + ' + tooltip.category",
"test": "tooltip.amount"
},
{"value": ""}
],
问题是当您将鼠标悬停在工具提示对象上时没有值 因为我们将值与'+'字符串连接在一起。未定义的对象被强制为'undefined'字符串。
需要再次将字符串值更新为空字符串。