JSFiddle - React, Tailwind, and code Playground
HTML
<div id="plotly-div1"></div>
<div id="plotly-div2"></div>
<script src='https://cdn.plot.ly/plotly-latest.min.js'></script>
JavaScript
function gaussianRand() {
var rand = 0
for (var i=0; i < 3; ++i) {
rand += Math.random()
}
return (rand / 3) - 0.5
}
function plot(y, divnum){
trace1 = {
type: "scattergl",
y: y,
}
layout = {
height: 250,
margin: {l: 40, r: 10, b: 30, t: 10}
}
Plotly.plot('plotly-div'+divnum, {
data: [trace1],
layout: layout,
})
}
Y
= []
for (var i=0; i < 1000000; i++) {
Y.push(gaussianRand())
}
plot(Y, 1)
Y[800000] = 100. // adding an outlier slows down zoom
plot(Y, 2)
delete Y