内联值有什么问题？

Question

"line chart" demo works fine, and is expressed in javascript, as in getting_started.html.

... 但是 当我将 "data" 字段从 URL 替换为内联值 时，它只显示轴，没有图表。

有效："data":{"url":"https://vega.github.io/vega-lite/examples/data/stocks.csv"},

它不有效：

var vlSpec = {
  "$schema": "https://vega.github.io/schema/vega-lite/v4.json",
  "description": "Google's stock price over time.",
  "data":  {"values": [
      {"symbol":"MSFT","date":"Jan 1 2000","price":39.81},
      {"symbol":"MSFT","date":"Feb 1 2000","price":36.35},
      {"symbol":"MSFT","date":"Mar 1 2000","price":43.22},
      {"symbol":"MSFT","date":"Apr 1 2000","price":28.37},
      {"symbol":"MSFT","date":"May 1 2000","price":25.45}
  ]},
  "transform": [{"filter": "datum.symbol==='GOOG'"}],
  "mark": "line",
  "encoding": {
    "x": {"field": "date", "type": "temporal"},
    "y": {"field": "price", "type": "quantitative"}
  }
};

控制台出现错误，没有意义：

WARN 字段 "date" 的无限范围：[Infinity，-Infinity]

Answer 1

根据 Date 类型的 Vega docs，日期需要是有效的 Javascript 日期对象或时间戳。

A valid JavaScript Date object or timestamp. As JSON does not support date values natively, within a Vega specification a date-time value can be expressed either as a numeric timestamp (the number of milliseconds since the UNIX epoch, as produced by the Date.getTime() method) or using a signal expression (such as {"signal": "datetime(2001, 2, 3)"})

Answer 2

只需要评论"magic line"

// "transform": [{"filter": "datum.symbol==='GOOG'"}],

求解释！这是维基答案

Answer 3

您的规范仅包含带有 symbol="MSFT" 的行。它还包含一个过滤器转换 {"filter": "datum.symbol==='GOOG'"}，它会删除除具有 symbol="GOOG" 的行之外的所有行。结果是没有数据可以绘制。

您看到的警告是因为轴范围是由数据确定的，当没有数据时，范围留在[-Infinity, Infinity]。

如果删除或修改此过滤语句，图表将正常工作。例如：

vlSpec = {
  "$schema": "https://vega.github.io/schema/vega-lite/v4.json",
  "description": "Google's stock price over time.",
  "data":  {"values": [
      {"symbol":"MSFT","date":"Jan 1 2000","price":39.81},
      {"symbol":"MSFT","date":"Feb 1 2000","price":36.35},
      {"symbol":"MSFT","date":"Mar 1 2000","price":43.22},
      {"symbol":"MSFT","date":"Apr 1 2000","price":28.37},
      {"symbol":"MSFT","date":"May 1 2000","price":25.45}
  ]},
  "transform": [{"filter": "datum.symbol==='MSFT'"}],
  "mark": "line",
  "encoding": {
    "x": {"field": "date", "type": "temporal"},
    "y": {"field": "price", "type": "quantitative"}
  }
};

结果如下所示 (Open the Chart in the Vega Editor):

内联值有什么问题？

What is wrong on inline values?

vega-lite