Vega-lite bar chart space between bars

风流意气都作罢 提交于 2019-12-25 10:52:13

问题


D3 newbie. How I adjust the spacing between bars in vega-lite bar chart and override the default? binSpacing I think only works on histograms. See code below. I'll want to adjust colour of text and font family too... But am having trouble finding it in the docs.

   {
  "$schema": "https://vega.github.io/schema/vega-lite/v2.json",
  "width": 1200,
  "height": 900,
  "data": {
    "url": "data/seattle-weather.csv"
  },
  "mark": "bar",
  "encoding": {

    "x": {
      "aggregate": "count",
      "type": "quantitative"
    },

    "size": {
      "value": 40



    },
    "y": {
      "field": "date",
      "type": "temporal",
      "timeUnit": "month",
      "axis": {
        "title": "Regions"
      }
    },

    "color": {
      "field": "weather",
      "type": "nominal",
      "scale": {
        "domain": [
          "0-20 days",
          "21-27 days",
          ">28 days"
        ],
        "range": [
          "red",
          "orange",
          "green"
        ]
      },
      "legend": {
        "title": "Case Ageing"
      }
    }
  }
}

回答1:


I can understand your confusion. It seems there are three questions:

  1. How do I change bin width for histograms? This is documented here. If you have trouble with a reproducible example, I will be happy to help.
  2. How do I adjust the spacing of the bars? This is controlled by padding, paddingInner and paddingOuter all documented at the encoding level and at the config level. You might be having trouble since you are setting size manually with "size": {"value": 40}, but I am guessing this is a remnant from experimenting. Here is a working spec from this gist. You can play with paddingOuter, paddingInner, or add padding to apply to both inner and outer.
  3. How do I change font styling? See this gist.


来源:https://stackoverflow.com/questions/45326497/vega-lite-bar-chart-space-between-bars

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!