Black Lives Matter. Please consider donating to Black Girls Code today.

How draw a graph with height and width given as a %

I have a div already defined with "style:"width: 75%; margin-left: 2.5%; height:75%; margin-top: 10px; margin-bottom: 10px;"
I do Plotly.newPlot( xxxxxxxx,xxxxx,xxxx).

the gragh nicely comes in full width.

after some interactions in the page when i visit the graoh it has suddendly drawn in a area where height = 75 & width = 75…
This is the same value i have given to the style as a “%”… ( when i change … it changes the size…)

How can we ask the svg container to take the size as a %… ? Im worried how its drawn in the first time but not in the second…

thanks…

Could you be more precise about:

plotly.js is compatible with <div> elements specified in %.

See https://plot.ly/javascript/responsive-fluid-layout/ for more details

we have two pages on the app… the graph is in the 1st page… and when we create the 2nd page it redraw the 1st page and 2nd page both…

the result is the graph is plotted in a 75px * 75px area…

Could you share a code snippet, ideally on codepen or jsFiddle?