Label in circle and rectangle is positioned incorrectly

HTML

<script src="https://cdn.plot.ly/plotly-3.5.0.js" charset="utf-8"></script>

<div class="container">
  <div id="myDiv" style="width:600px"></div>
</dev>

JavaScript

var layout = {
  margin: { t: 92 },
  shapes: [
    {
      label: {
        text: "Circle",
        textangle: 0,
        textposition: "middle center",
        xanchor: "center",
        yanchor: "middle"
      },
      showlegend: false,
      type: "circle",
      x0: -25,
      x1: 25,
      xanchor: 1,
      xref: "x",
      xsizemode: "pixel",
      y0: 25,
      y1: 75,
      yanchor: 1,
      yref: "paper",
      ysizemode: "pixel"
    },

    {
      label: {
        text: "Rectangle",
        textangle: 0,
        textposition: "middle center",
        xanchor: "center",
        yanchor: "middle"
      },
      showlegend: false,
      type: "rectangle",
      x0: -25,
      x1: 25,
      xanchor: 2,
      xref: "x",
      xsizemode: "pixel",
      y0: 25,
      y1: 75,
      yanchor: 1,
      yref: "paper",
      ysizemode: "pixel"
    }
  ]
};
var data = [
  {
    type: "scatter",
    x: [1, 2],
    y: [1, 2]
  }
];

Plotly.newPlot("myDiv", data, layout);