I’m trying to figure out what controls the height of a plotly plot when it is displayed in a browser.
I seem to be getting plots 450px tall (height) and no ability to increase that.
What is interesting, in the code below, if I comment out
"<!DOCTYPE html>"
the plot becomes full height. If I leave it in, it is displayed at 450px height.
<!DOCTYPE html>
<html>
<head><meta charset="utf-8" /></head>
<body>
<script type="text/javascript" src="plotlyjs-bundle.js"></script>
<!--<script type="text/javascript" src="figure.js"></script>-->
<div id="myDiv" style="width: 100%; height: 100%;" class="plotly-graph-div"></div>
<script type="text/javascript">
(function(){
var trace1 = {
x: [1, 2, 3, 4],
y: [10, 15, 13, 17],
type: 'scatter'
};
var trace2 = {
x: [1, 2, 3, 4],
y: [16, 5, 11, 9],
type: 'scatter'
};
var data = [trace1, trace2];
Plotly.newPlot('myDiv', data);
}());
</script>
</body>
</html>