使用 JavaScript 在图表上更改数据后，Y 轴设置为零

Question

我在grafana中使用变量、动态文本和plotly与javascript。

第一次加载时，图表显示完整

更改数据后，就像孔Y轴设置为零最大值和最小值。

重新加载页面后，它会毫无问题地显示图表

在我设置的布局配置上，Y 轴的大小将发生变化

布局：{

....

自动量程：正确，

.... }

任何可能有帮助的建议，提前致谢。

Answer 1

我能够在我拥有的布局配置上解决它：

layout = {
scrollZoom: true,
xaxis: {
  autorange: true,
  showgrid: false,
  zeroline: false,
  showline: true,
  gridcolor: '#bdbdbd',
  gridwidth: 2,
  zerolinecolor: '#969696',
  zerolinewidth: 4,
  linecolor: '#636363',
  linewidth: 1,
  automargin: true,
  title: {
    text: context.dataFrame.fields[0].name,
    standoff: 15,
    font: {
      color: "#D0D0D0" // Color for x-axis title
    }
  },
  tickfont: {
    color: "#D0D0D0" // Color for x-axis values
  }
},
yaxis: {
  //autorange: true,
  //range: [0, 100],
  showgrid: false,
  zeroline: true,
  showline: true,
  gridcolor: '#bdbdbd',
  gridwidth: 2,
  zerolinecolor: '#969696',
  zerolinewidth: 4,
  linecolor: '#636363',
  linewidth: 1,
  //automargin: true,
  title: {
    text: "%",
    standoff: 15,
    font: {
      color: "#D0D0D0" // Set the desired color for y-axis title
    }
  },
  tickfont: {
    color: "#D0D0D0" // Color for x-axis values
  }
},
showlegend: true,
legend: {
  //"orientation": "h",
  "auto": "x|y",
  font: {
    color: "#D0D0D0"
  }
}

我让它变得更简单

var layout = {
xaxis: {
  showgrid: false,
  zeroline: false,
  tickfont: {
  color: "#D0D0D0"
  },
linecolor: '#636363',
title: {
  text: context.dataFrame.fields[0].name,
  standoff: 15,
  font: {
    color: "#D0D0D0"
  }
}
},
yaxis: {
  showgrid: false,
  zeroline: false,
  tickfont: {
    color: "#D0D0D0"
   },
linecolor: '#636363',
title: {
  text: "%",
  standoff: 15,
  font: {
    color: "#D0D0D0"
  }
}
},
paper_bgcolor: 'rgba(255,255,255,0)',
plot_bgcolor: 'rgba(0,0,0,0)'
}

我不知道问题的原因是什么，但重做对我有用。