Plotly热力图同时实现自由矩形框选缩放与方形像素保持的方案问询

大家好，我在使用Plotly.js的热力图时碰到了一个棘手的需求矛盾，想请教社区有没有解决办法。目前Plotly.js的热力图有两种缩放行为，但都没法同时满足我的需求：

• 任意矩形框选，但像素非方形
  这种模式下可以通过点击拖拽绘制任意形状的矩形来缩放，但缩放后的热力图像素不再保持方形，宽高比被改变，这对一些有严格像素比例要求的场景来说并不适用。对应的实现代码如下：

  const z = Array.from({length: 500}, () => Array.from({length: 100}, () => Math.floor(Math.random() * 255)));
  
  Plotly.newPlot('plot', [{type: 'heatmap', z: z}], {});
  
  <script src="https://cdn.plot.ly/plotly-2.16.2.min.js"></script>
  <div id="plot"></div>
  

• 保持方形像素，但缩放框选受比例限制
  要是通过配置{'yaxis': {'scaleanchor': 'x'}}来强制让像素保持方形，此时框选缩放就只能按照固定的宽高比来进行，这在不少场景下会限制用户的操作自由度，影响体验。对应的实现代码如下：

  const z = Array.from({length: 500}, () => Array.from({length: 100}, () => Math.floor(Math.random() * 255)));
  
  Plotly.newPlot('plot', [{type: 'heatmap', z: z}], {'yaxis': {'scaleanchor': 'x'}});
  
  <script src="https://cdn.plot.ly/plotly-2.16.2.min.js"></script>
  <div id="plot"></div>
  

我的核心需求是：既能用任意形状的矩形进行框选缩放，又能在缩放后始终保持热力图的像素为方形，同时让缩放后的内容居中显示（必要时可以保留水平或垂直方向的空白区域）。请问有没有办法实现这样的效果呢？

备注：内容来源于stack exchange，提问作者Basj