2

I have defined a plotly chart in .ts file as shown.

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);    
}

Now I wants to call this function using a button in HTML. How can it be done? Any suggestions are appreciated.

Vikram
  • 83
  • 1
  • 6
  • is there any issue calling this function? or are you asking an approach. – Shabbir Dhangot Jan 20 '20 at 06:20
  • @ShabbirDhangot yes when I am calling this using this html code.

    its not being called.     – Vikram Jan 20 '20 at 07:13
  • Is this any different than your other question?: https://stackoverflow.com/q/59817118/170309 – sfarbota Jan 20 '20 at 07:33
  • @sfarbota yes. Actually I am trying to tackle zoom in and out problem with different approach. I am changing the width and height of the layout in .ts file. By changing these parameters , It will have same effect as zoom in and zoom out. Now here, by on clicking the buttons i am trying to call the charts with different widths and heights. – Vikram Jan 20 '20 at 07:39
  • If you found this question looking for a way to programmatically zoom in plotly check out the answer here: https://stackoverflow.com/a/62077060/2217801 – Jesse Reza Khorasanee Nov 30 '20 at 21:36

0 Answers0