JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<div id='myDiv' style="resize:both; overflow: auto; border: 1px solid; height:250px">
<!-- Plotly chart will be drawn inside this DIV -->
</div>
JavaScript
let observer = new MutationObserver(function(mutations) {
window.dispatchEvent(new Event('resize'));
});
let child = document.getElementById('myDiv');
observer.observe(child, {
attributes: true
})
var trace1 = {
type: 'bar',
x: [1, 2, 3, 4],
y: [5, 10, 2, 8],
};
var data = [trace1]
var layout = {
margin: {
l: 20,
r: 10,
b: 20,
t: 10
}
}
var config = {
responsive: true
}
Plotly.newPlot('myDiv', data, layout, config);