How do I center a "rect"?

Elastic Stack Kibana
1

I have this snippet rendering a circle:

        {
          "mark": {
            "type": "circle",
            "size": 200,
            "fillOpacity": 0.7,
            "stroke": "white",
            "strokeWidth": 1,
            "cornerRadius": 5
          },
          "encoding": {
            "color": {
              "field": "color",
              "type": "nominal",
              "scale": null,
              "legend": null
            }
          }
        },

The circle is rendered in the center of the viewport and correctly moves when resizing the browser.

I would like to render a centered rect rather than the circle but replacing the mark with this renders the reactangle in the top right corner:

      "mark": {
        "type": "rect",
        "width": 200,
        "height": 100,
        "fillOpacity": 0.7,
        "stroke": "white",
        "strokeWidth": 1,
        "cornerRadius": 5
      },

What am I missing? Why does the two shapes behave so differently?

edit: I see that a square centers automatically... still puzzled.:thinking:

Thanks in advance :slightly_smiling_face: