javascript - 绘图.js : Hide Heatmap Axes and Legends

Question

使用 Plotly js 制作热图，如何删除 x 轴、y 轴和图例？下面你会找到我的代码

heatmap

var data = [
{
  z: z,
  type: 'heatmap',
  colorscale : [[0, 'rgb(0,0,255)']],
  opacity: 1

}
];


Plotly.plot('myDiv', data,  {
images: [
    {
      "source": "../images/img.png",
      "xref": "x",
      "yref": "y",
      "x": -1,
      "y": 50,
      "sizex": 51,
      "sizey": 51,
      "sizing": "stretch",
      "opacity": 1,
      "layer": "above"
    }
  ]

})

Answer 1

只需前往 official plotly documentation 查找显示/隐藏元素的相应属性即可。 。以下属性是您所需要的。

• Show Legend - 隐藏/显示图例。

• X-Axis Visible - 隐藏/显示 X 轴。

• Y-Axis Visible - 隐藏/显示 Y 轴。

以下是代码，已更改布局属性以满足您的要求。

var data = [
{
  z: z,
  type: 'heatmap',
  colorscale : [[0, 'rgb(0,0,255)']],
  opacity: 1

}
];


Plotly.plot('myDiv', data,  {
showlegend: false,
xaxis: {visible: false},
yaxis: {visible: false},
images: [
    {
      "source": "../images/img.png",
      "xref": "x",
      "yref": "y",
      "x": -1,
      "y": 50,
      "sizex": 51,
      "sizey": 51,
      "sizing": "stretch",
      "opacity": 1,
      "layer": "above"
    }
  ]

})