如何添加垂直规则作为新层和相同的 x 轴？

Question

当将条带添加为新层时（在 2 层图表中），停止工作：没有可视化和 "WARN Cannot project a selection on encoding channel "y"，它没有字段" 。

下面的前两层定义在只有两行时工作正常。

vglSpec.push(['#vis2a',{
    $schema: vglVers,
    data: {"url":"MyDataset1"},
    // old "encoding": { x: {"field": "instant", "type": "temporal"} }
    width:680,
    layer: [
        {
            "mark": {"stroke": "#68C", "type": "line", "point": true},
            "encoding": { x: {"field": "instant", "type": "temporal"}, "y": {
                "field": "n_count", 
                "type": "quantitative"
            }},
            "selection": {"grid": {"type":"interval", "bind":"scales"}}   //zoom
        },
        {
            "mark": {"stroke": "red", "type": "line", "strokeOpacity": 0.4},
            "encoding": { x: {"field": "instant", "type": "temporal"}, "y": {
                "field": "instant_totmin", 
                "type": "quantitative"
            }}
        },
        {
            "mark": "rule",
            "data": {"url":"MyDataset2"}, // little subset of instant of Dataset1
            "encoding": {
              "x": { "field": "instant", "type": "temporal"},
              "color": {"value": "yellow"},
              "size": {"value": 5}
            },
            //resolve:? x is same axis and the only visualization field
        }
    ],
    resolve: {"scale": {"y": "independent"}}
}]);

PS: 只去掉名字和头衔，全是真字

用虚拟数据模拟：工作正常！

请点击 rule guide 的第 3 个示例...并为这个 VEGA-lite 脚本替换或改编它：

{
  "$schema": "https://vega.github.io/schema/vega-lite/v4.json",
  "data": {"url": "data/movies.json"},
  "layer": [
    { 
      "mark": "bar",
      "encoding": {
        "x": {"bin": true, "field": "IMDB_Rating", "type": "quantitative"},
        "y": {"aggregate": "count", "type": "quantitative"}
      }
    },
    {
      "mark": "rule",
      "data": {"values": [{"IMDB_Rating":3.5},{"IMDB_Rating":7.8}]},
      "encoding": {
        "x": { "field": "IMDB_Rating","type": "quantitative" },
        "color": {"value": "yellow"},
        "size": {"value": 4}
      }
    }
  ]
}

Answer 1

您使用的是独立的 y 尺度，没有 y 编码的规则标记的 y 尺度定义不明确。解决这个问题的最好方法可能是将规则标记与其他层之一结合起来，这样它就可以使用那个 y 比例：

vglSpec.push(['#vis2a',{
    $schema: vglVers,
    data: {"url":"MyDataset1"},
    // old "encoding": { x: {"field": "instant", "type": "temporal"} }
    width:680,
    layer: [
        {
            "mark": {"stroke": "#68C", "type": "line", "point": true},
            "encoding": { x: {"field": "instant", "type": "temporal"}, "y": {
                "field": "n_count", 
                "type": "quantitative"
            }},
            "selection": {"grid": {"type":"interval", "bind":"scales"}}   //zoom
        },
        {
          layer: [
            {
                "mark": {"stroke": "red", "type": "line", "strokeOpacity": 0.4},
                "encoding": { x: {"field": "instant", "type": "temporal"}, "y": {
                    "field": "instant_totmin", 
                    "type": "quantitative"
                }}
            },
            {
                "mark": "rule",
                "data": {"url":"MyDataset2"}, // little subset of instant of Dataset1
                "encoding": {
                  "x": { "field": "instant", "type": "temporal"},
                  "color": {"value": "yellow"},
                  "size": {"value": 5}
                },
            //resolve:? x is same axis and the only visualization field
            }
          ]
        }
    ],
    resolve: {"scale": {"y": "independent"}}
}]);

（注意，我实际上并没有尝试过这个解决方案，因为你没有在你的问题中包含数据，但这种方法应该有效）。

如何添加垂直规则作为新层和相同的 x 轴？

How to add vertical rules as new layer and same x-axis?

data-visualization

vega-lite

用虚拟数据模拟：工作正常！