javascript - 水平和垂直条形图视图的按钮，但轴无法更改

Question

我正在使用plotly.js处理条形图，并希望创建两个按钮来在水平视图和垂直视图之间切换。

但是，我的 x 轴更改代码似乎不起作用。

以下是故障的屏幕截图和我的代码：

水平视图图像

垂直视图图像 （x 轴没有切换，y 轴不是计数而是类别）

    var data = [
    //horizontal graph
    {
      type: 'bar',
      x: xData2,
      y: yData2,
      marker: {
        color: 'rgba(255, 100, 102, 0.7)',
      },
      name:'Bar Chart',
      orientation:'h',
      xaxis: { title: 'Count' },
      yaxis: { title: xAxisAttribute },
      
    },
    //vertical graph
    {
      type: 'bar',
      y: yData,
      x: xData,
      orientation:'v',
      marker: {
        color: 'rgba(255, 100, 102, 0.7)',
      },
      name:'Bar Chart',
      visible: false
    }]
  var button_layer_2_height = 1.2;
  var updatemenus=[
      {
          buttons: [
              {
                  args: [{'visible': [true, false]}],
                  label: 'Horizontal View',
                  method: 'update'
              },
              {
                  args: [{'visible': [false, true]}],
                  label: 'Vertical View',
                  method: 'update'
              },
          ],
          direction: 'left',
          pad: {'r': 10, 't': 10},
          showactive: true,
          type: 'buttons',
          x: 0.1,
          xanchor: 'left',
          y: button_layer_2_height,
          yanchor: 'top'
      },
  ]  
  let layout = {
    title: title || 'Untitled',
    autosize: true,
    hovermode:'closest',
    updatemenus: updatemenus,
    };

  return (
    <div>
      <Plot
        data ={data}
        layout = {layout}
        config = {config}
          />
      </div>
    ) 
    }

提前致谢！

标签： javascriptplotlyaxesplotly.js