How to keep Vertical Line Constant irrespective of Zoom in or zoom out in Plotly javascript

plotly.js
,
5

What exactly is the behaviour you are looking for?

Take this example:

<!DOCTYPE html>
<html>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<body>

<div id="myPlot" style="width:100%;max-width:700px"></div>

<script>
const xArray = [50,60,70,80,90,100,110,120,130,140,150];
const yArray = [7,8,8,9,9,9,10,11,14,14,15];

// Define Data
const data = [{
  x:xArray,
  y:yArray,
  mode:"markers"
}];

// Define Layout
const layout = {
  xaxis: {range: [40, 160], title: "Square Meters"},
  yaxis: {range: [5, 16], title: "Price in Millions"},
  title: "House Prices vs. Size",
  shapes: [{
    type: 'line',
    x0: "70",
    y0: 0,
    x1: "70",
    yref: 'paper',
    y1: 1,
    line: {
      color: 'grey',
      width: 1.5,
      dash: 'dot'
    }
  }]
};

// Display using Plotly
Plotly.newPlot("myPlot", data, layout);
</script>

</body>
</html>