1

How do I get the labels on the x-axis to rotate?

I need to fit them into the chart, and they are vertical I would like them to be horizontal.

This is the link to the example that is nearly identical to my own code:

[https://vega.github.io/vega-lite/docs/bar.html#grouped-bar-chart-multiple-measure-with-repeat]

I have tried "encoding":{ "x": {"axis": {"labelAngle": -30}}}, both in mark encoding and in encoding section.

I have also tried "encoding": {"x":{"header": {"labelAngle": -30}}}}.

I have also looked and there is no X-axis edit for deneb on the right under visualizations.

I have tried the vega code from the heatmap question that comes up as related. That also did not work.

I have added x-axis encoding as above in all of the sections of Mark encoding, encoding, and config, but the default axis label still is present.

No matter what I could not get the x-axis labels to rotate under the bars.

The only difference in my actual code and the example below is that I have two marks with an independent Y variable.

Vertical x-Axis Example

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "data": {"url": "data/movies.json"},
  "repeat": {"layer": ["Worldwide Gross", "US Gross"]},
  "spec": {
    "mark": "bar",
    "encoding": {
      "x": {"field": "Major Genre", "type": "nominal"},
      "y": {
        "aggregate": "sum",
        "field": {"repeat": "layer"},
        "type": "quantitative",
        "title": "Total Gross"
      },
      "color": {"datum": {"repeat": "layer"}, "title": "Gross"},
      "xOffset": {"datum": {"repeat": "layer"}}
    }
  },
  "config": {"mark": {"invalid": null}}
}
Ben Ure
  • 21
  • 2

1 Answers1

1

I just answered my own question. I left out "labelAlign"

"axis": {
    "labelAngle": -30,
    "labelAlign": "right"}
Ben Ure
  • 21
  • 2