Arc mark rotation affects container layout

[marcprux]

Take the following pie chart with an arc mark:

{
  "$schema" : "https://vega.github.io/schema/vega-lite/v4.14.0.json",
  "title" : "Rotated Pie Chart",
  "mark" : {
    "angle" : 0,
    "type" : "arc"
  },
  "data" : {
    "name" : "data"
  },
  "encoding" : {
    "color" : {
      "field" : "category",
      "type" : "nominal"
    },
    "theta" : {
      "field" : "value",
      "type" : "quantitative"
    }
  },
  "datasets" : {
    "data" : [
      {
        "category" : 1,
        "value" : 4
      },
      {
        "category" : 2,
        "value" : 6
      },
      {
        "category" : 3,
        "value" : 10
      },
      {
        "category" : 4,
        "value" : 3
      },
      {
        "category" : 5,
        "value" : 7
      },
      {
        "category" : 6,
        "value" : 8
      }
    ]
  }
}

Change the mark's "angle" property from 0 to 45, and it is rendered as:

The padding and position relative to the title and legend all changed, even through all we wanted to do was change the default rotation of the pie chart.

[marcprux]

[domoritz]

Is this a Vega-Lite or Vega issue?

[marcprux]

Sorry, it's vega. The same behavior can be reproduced with the vega spec:

{
  "$schema": "https://vega.github.io/schema/vega-lite/v4.14.0.json",
  "title": "Rotated Pie Chart",
  "mark": {"angle": 45, "type": "arc"},
  "data": {"name": "data"},
  "encoding": {
    "color": {"field": "category", "type": "nominal"},
    "theta": {"field": "value", "type": "quantitative"}
  },
  "datasets": {
    "data": [
      {"category": 1, "value": 4},
      {"category": 2, "value": 6},
      {"category": 3, "value": 10},
      {"category": 4, "value": 3},
      {"category": 5, "value": 7},
      {"category": 6, "value": 8}
    ]
  }
}

@domoritz Can you re-host this issue in the vega project?

[jheer]

Thanks @marcprux! This reveals a bug in the arc bounds calculation. Here's the same example with the bounds also rendered, illustrating the problem:

[jheer]

The crux of the issue is that the angle channel for rotating the marks uses an indirect path for bounding box calculation: the bounds are calculated directly, and then rotated to match the angle. This results in bounding boxes at arbitrary angles, so we then compute the rectified bounding box in the pixel coordinate space of the rotated bounding box. The process can enlarge the bounding box size, creating the problem here. Clearly we need to fix this.