plotly js：热图中色标的位置和长度

Question

使用 plotly.js，您可以制作热图，热图的右侧带有色标，一些 3d 图表也是如此。

这是codepen 中的一个例子。

Plotly.d3.json('https://raw.githubusercontent.com/plotly/datasets/master/custom_heatmap_colorscale.json', function(figure) {
var data = [{
    z: figure.z,
    colorscale: 'Jet',
    type: 'heatmap'
  }
];
var layout = {title: 'Jet'};
Plotly.newPlot('myDiv', data, layout);
});

我正在努力查看 api 是否允许修改色标位置和长度。plotly.js 是否允许操作这些属性，您是否有热图和/或 3d 图形的示例？

Answer 1

您可以设置位置和长度的colorbar加入下面一行到你data：

colorbar: {x: -.5, len: 0.5}

下面是一个颜色条向左推并且是常规尺寸的一半的片段。

colorbar: {x: -.5, len: 0.5}

Plotly.d3.json('https://raw.githubusercontent.com/plotly/datasets/master/custom_heatmap_colorscale.json', function(figure) {
var data = [{
    z: figure.z,
    colorscale: 'Jet',
    type: 'heatmap',
    colorbar: {x: -.5, len: 0.5}
  }
];
var layout = {title: 'Jet'};
Plotly.newPlot('myDiv', data, layout);
});