在缩放时重新缩放 js z 轴答案

【问题标题】：Recale plotly js z axis on zoom在缩放时重新缩放 js z 轴
【发布时间】：2016-05-04 21:46:15
【问题描述】：

plotly.js 2D 直方图和等高线图会自动生成一个 z 轴范围，以适应正在绘制的数据集中 z 值的整个范围。这很好开始，但是当我在绘图上单击并拖动以放大时，我希望 z 轴范围也可以放大以仅容纳当前显示的 z 值范围；相反，z 轴永远不会改变。这是一个代码笔（来自情节示例，感谢情节）：http://codepen.io/anon/pen/MKGyJP

(codepen 代码内联：

var x = [];
var y = [];
for (var i = 0; i < 500; i ++) {
    x[i] = Math.random();
    y[i] = Math.random() + 1;
}

var data = [
  {
    x: x,
    y: y,
    type: 'histogram2d'
  }
];
Plotly.newPlot('myDiv', data);

)

这似乎是非常传统的行为 - 我是否在某处的文档中遗漏了执行此操作的选项？

如果没有内置选项来执行此操作，可接受的替代解决方案是在缩放回调中手动设置新的 z 限制，这很容易根据此示例实现：http://codepen.io/plotly/pen/dogexw - 在这种情况下我的问题变成了，有没有一种方便的方法来获取当前显示的最小和最大 z？

提前致谢，

【问题讨论】：

标签： javascript visualization plotly

【解决方案1】：

plotly.js 目前没有特定于缩放的回调（请关注issue 以获取更新）。

另一种方法是添加一个更新色阶范围的模式栏按钮：

Plotly.newPlot('myDiv', data, {}, {
  modeBarButtonsToAdd: [{
    name: 'click here to update the colorscale range',
    click: function(graphData) {            
        var xRange = graphData.layout.xaxis.range,
            yRange = graphData.layout.yaxis.range;

        var zMin, zMax;

        // code that would compute the colorscale range
        // given xRange and yRange
        // for example given these values:
        zMin = 10;
        zMax = 20;

        Plotly.restyle('myDiv', {zmin: zMin, zmax: zMax});
    }   
  }]
});

完整示例：http://codepen.io/etpinard/pen/JGvNjV

【讨论】：