2

我一直在尝试找出如何在 vega-lite 中定义多线图的数据,但我无法让它工作。这些示例在 URL 端点 ( https://vega.github.io/vega-editor/?mode=vega-lite&spec=line_color&showEditor=1 )处显示 csv 文件的数据,但我想查看我在简单的json。

这是我对单线图的看法:

var LineSpec = {
  "description": "variation over time for",

  "data": {
     "values": 
     [
          {"date": "2012-04-23T18:25:43.511Z","price": 10},
          {"date": "2012-04-25T18:25:43.511Z","price": 7},
          {"date": "2012-04-27T18:25:43.511Z","price": 4},
          {"date": "2012-05-01T18:25:43.511Z","price": 1},
          {"date": "2012-05-03T18:25:43.511Z","price": 2},
          {"date": "2012-05-05T18:25:43.511Z","price": 6},
          {"date": "2012-05-07T18:25:43.511Z","price": 8},
          {"date": "2012-05-09T18:25:43.511Z","price": 4},
          {"date": "2012-05-11T18:25:43.511Z","price": 7}
      ]
    },
  "mark": "line",
  "encoding": {
    "x": {"field": "date", "type": "temporal"},
    "y": {"field": "price", "type": "quantitative"},
    "color": {"field": "symbol", "type": "nominal"}
  }
};

如何修改“数据”以显示多线图?(如果可能,显示符号表中未定义的更多有用信息)。这是我现在看到的: 带有未定义符号的折线图

谢谢!

4

1 回答 1

2

您必须将符号字段添加到您的数据中。我添加了符号字段以及符号 A 和 B。此数据应呈现一个多线图,其中包含图例中的两个符号:

{
  "description": "variation over time for",
  "data": {
    "values": [
      {"date": "2012-04-23T18:25:43.511Z","price": 10, "symbol": "A"},
      {"date": "2012-04-25T18:25:43.511Z","price": 7, "symbol": "B"},
      {"date": "2012-04-27T18:25:43.511Z","price": 4, "symbol": "A"},
      {"date": "2012-05-01T18:25:43.511Z","price": 1, "symbol": "B"},
      {"date": "2012-05-03T18:25:43.511Z","price": 2, "symbol": "A"},
      {"date": "2012-05-05T18:25:43.511Z","price": 6, "symbol": "B"},
      {"date": "2012-05-07T18:25:43.511Z","price": 8, "symbol": "A"},
      {"date": "2012-05-09T18:25:43.511Z","price": 4, "symbol": "B"},
      {"date": "2012-05-11T18:25:43.511Z","price": 7, "symbol": "A"}
    ]
  },
  "mark": "line",
  "encoding": {
    "x": {"field": "date", "type": "temporal"},
    "y": {"field": "price", "type": "quantitative"},
    "color": {"field": "symbol", "type": "nominal"}
  }
}
于 2016-03-23T12:43:57.287 回答