如何更改 Vega-lite 条形图中条形的颜色？答案

【问题标题】：How do I change color of a bar in Vega-lite Bar Chart?如何更改 Vega-lite 条形图中条形的颜色？
【发布时间】：2016-05-18 15:59:40
【问题描述】：

我想更改 Vega-Lite 条形图中条形的默认蓝色。我该怎么做？我在下面发布 json 规范：

{
 "data": {
 "values": [
  {"a":"A", "b":28}, {"a":"B", "b":55}, {"a":"C", "b":43},
  {"a":"D", "b":91}, {"a":"E", "b":81}, {"a":"F", "b":53},
  {"a":"G", "b":19}, {"a":"H", "b":87}, {"a":"I", "b":52}
 ]
 },
 "mark": "bar",
 "encoding": {
 "x": {bin:false, "type": "ordinal","field": "a"},
 "y": {"type": "quantitative","field": "b"}
 }
}

提前致谢。

【问题讨论】：

标签： d3.js bar-chart data-visualization vega vega-lite

【解决方案1】：

我找到了自己问题的答案。 :) 我应该在编码块中添加一个 color 键。请参阅下面的更新代码：

{
 "data": {
 "values": [
  {"a":"A", "b":28}, {"a":"B", "b":55}, {"a":"C", "b":43},
  {"a":"D", "b":91}, {"a":"E", "b":81}, {"a":"F", "b":53},
  {"a":"G", "b":19}, {"a":"H", "b":87}, {"a":"I", "b":52}
 ]
},
 "mark": "bar",
 "encoding": {
 "x": {"type": "ordinal","field": "a"},
 "y": {"type": "quantitative","field": "b"},
 "color": {"value": "#ff9900"}
}
}

【讨论】：