Javascript 如何在HTML中使用onclick按钮调用plotly图表？

我在.ts文件中定义了一个绘图图表，如图所示

function basicChart() {

  var trace1 = {
    x: ['1','1.5','2','2.5','3'],
    y: [12,1,14.32,2,9.56],
    mode: 'scatter',
 };

 var data = [trace1];

 var layout = {
  title: 'Scroll and Zoom',
  showlegend: false,
  autosize: false,
  width: 1100,
  height: 500,
  xaxis: {
    rangemode: 'tozero',
    autorange: true,
    tickmode: "linear",
    tick0: 0,
    dtick: 1,
    zeroline: true,
    range:[2,5]


  },
  yaxis: {
    rangemode: 'nonnegative',
    autorange: true,

  }};
var config = {displaylogo: false,modeBarButtonsToRemove:['toImage','sendDataToCloud','autoScale2d',
'resetScale2d','hoverClosestCartesian','hoverCompareCartesian','pan2d','select2d',
'lasso2d','toggleHover','toggleSpikelines']};
document.getElementById("demo").innerHTML = Plotly.newPlot( data, layout, config);    
}

---

现在我想用HTML中的一个按钮调用这个函数。怎样才能做到呢？非常感谢您的建议。

调用此函数是否有任何问题？或者你在问一种方法。@ShabbirDhangot是的，当我用这个html代码调用它时。单击我

它不会被调用。这与您的其他问题有什么不同吗？：@sfarbota是的。实际上，我正试图用不同的方法解决放大和缩小问题。我正在更改.ts文件中布局的宽度和高度。通过更改这些参数，它将具有与放大和缩小相同的效果。现在，通过单击按钮，我尝试调用具有不同宽度和高度的图表。如果您发现这个问题，正在寻找一种以编程方式放大绘图的方法，请在此处查看答案：调用此函数有任何问题吗？或者你在问一种方法。@ShabbirDhangot是的，当我用这个html代码调用它时。单击我

它不会被调用。这与您的其他问题有什么不同吗？：@sfarbota是的。实际上，我正试图用不同的方法解决放大和缩小问题。我正在更改.ts文件中布局的宽度和高度。通过更改这些参数，它将具有与放大和缩小相同的效果。现在，通过单击按钮，我尝试调用具有不同宽度和高度的图表。如果您发现这个问题正在寻找以编程方式放大绘图的方法，请在此处查看答案：