The following graph works in Vega Editor but not on Wiki. Specifically - when you hover mouse over line, it should switch width from 2px to 5px and label should pop up in the top. But the line is 1px wide always and no text appears. It works correclty in Vega editor.
It looks like there's an issue with the "test" part in the update clause (a guess but based on some trial and error).
{
"version": 2,
"width": 1000,
"height": 500,
"signals": [
{
"name": "tooltip",
"init": {},
"streams": [
{"type": "line:mouseover", "expr": "datum"},
{"type": "line:mouseout", "expr": "{}"}
]
}
],
"data": [
{
"name": "stocks",
"values": [
{"date": "2008-09-20T00:00:00","points": 1984.733, "symbol": "Dino"},
{"date": "2009-04-04T00:00:00","points": 2001.437, "symbol": "Dino"},
{"date": "2009-05-01T00:00:00","points": 1984.988, "symbol": "Dino"},
{"date": "2009-06-20T00:00:00","points": 1969.684, "symbol": "Dino"},
{"date": "2009-06-28T00:00:00","points": 1955.428, "symbol": "Dino"},
{"date": "2009-08-08T00:00:00","points": 1957.466, "symbol": "Dino"},
{"date": "2009-08-16T00:00:00","points": 1984.000, "symbol": "Fide"},
{"date": "2009-09-19T00:00:00","points": 1976.940, "symbol": "Fide"},
{"date": "2009-09-27T00:00:00","points": 1954.666, "symbol": "Dino"},
{"date": "2010-07-17T00:00:00","points": 1964.047, "symbol": "Fide"},
{"date": "2010-08-21T00:00:00","points": 1948.917, "symbol": "Fide"},
{"date": "2010-09-04T00:00:00","points": 1951.207, "symbol": "Fide"},
{"date": "2010-10-09T00:00:00","points": 1949.366, "symbol": "Fide"},
{"date": "2011-04-17T00:00:00","points": 1946.346, "symbol": "Fide"},
{"date": "2012-01-14T00:00:00","points": 1938.398, "symbol": "Fide"}
],
"format": {"parse": {"points":"number", "date":"date"}}
}
],
"scales": [
{
"name": "x",
"type": "time",
"range": "width",
"domain": {"data": "stocks", "field": "date"}
},
{
"name": "y",
"type": "linear",
"range": "height",
"nice": true,
"zero": false,
"domain": {"data": "stocks", "field": "points"}
},
{
"name": "color",
"type": "ordinal",
"domain": {"data": "stocks", "field": "symbol"},
"range": "category10"
}
],
"axes": [
{"type": "x", "scale": "x", "tickSizeEnd": 0},
{"type": "y", "scale": "y"}
],
"marks": [
{
"type": "group",
"from": {
"data": "stocks",
"transform": [{"type": "facet", "groupby": ["symbol"]}]
},
"marks": [
{
"type": "line",
"properties": {
"enter":
{
"x": {"scale": "x", "field": "date"},
"y": {"scale": "y", "field": "points"},
"stroke": {"scale": "color", "field": "symbol"}
},
"update":
{
"strokeWidth": [
{
"test": "datum._id == tooltip._id",
"value": 5
},
{
"value": 2
}
]
}
}
},
{
"type": "text",
"properties": {
"enter": {
"x": {"value": 500},
"y": {"scale": "y", "field": "price"},
"align": {"value": "center"},
"fontSize": {"value": 24},
"fill": {"scale": "color", "field": "symbol"},
"baseline": {"value": "middle"}
},
"update": {
"text": [
{
"field": "symbol",
"test": "datum._id == tooltip._id"
},
{"value": ""}
]
}
}
}
]
}
]
}