结合选择与最近的变换不能正常工作

时间:2020-08-25 14:22:00

标签: vega-lite

我正在尝试创建组合选择,以突出显示悬停的线和该特定线上最接近选择的点。但是,当线路选择未更改时,我遇到了问题。就像当鼠​​标光标进入图表时,其中一条线突出显示,并且将鼠标悬停在另一条线上时,不会删除此选择。如果有人可以帮助我找出问题所在?

这里是行为link损坏的图表的示例

{
  "$schema": "https://vega.github.io/schema/vega-lite/v4.json",
  "description": "Multi-series line chart with labels and interactive highlight on hover.  We also set the selection's initial value to provide a better screenshot",
  "data": {"url": "data/stocks.csv"},
  "encoding": {
    "x": {"field": "date", "type": "temporal", "title": "date"},
    "y": {"field": "price", "type": "quantitative", "title": "price"},
    "color": {
      "condition": {
        "selection": "hover",
        "field": "symbol",
        "type": "nominal",
        "legend": null
      },
      "value": "grey"
    },
    "opacity": {"condition": {"selection": "hover", "value": 1}, "value": 0.2}
  },
  "layer": [
    {
      "description": "transparent layer to make it easier to trigger selection",
      "selection": {
        "hover": {
          "type": "single",
          "on": "mouseover",
          "clear": "mouseout",
          "nearest": false,
          "empty": "all",
          "fields": ["symbol"]
        }
      },
      "mark": {"type": "line", "strokeWidth": 8, "stroke": "transparent"}
    },
    {
      "layer": [
        {"mark": "line"},
        {
          "transform": [{"filter": {"and": [{"selection": "hover"}]}}],
          "selection": {
            "closestPoint": {
              "type": "single",
              "on": "mouseover",
              "clear": "mouseout",
              "nearest": true,
              "empty": "none",
              "encodings": ["x"],
              "fields": ["date"]
            }
          },
          "mark": "point",
          "encoding": {
            "tooltip": {"field": "date"},
            "size": {
              "condition": {"selection": "closestPoint", "value": 40},
              "value": 0
            }
          }
        }
      ]
    }
  ],
  "config": {"view": {"stroke": null}}
}

0 个答案:

没有答案