8000 [Bugfix] Fix Container Height by samhinshaw · Pull Request #7313 · plotly/plotly.js · GitHub
[go: up one dir, main page]
Skip to content

[Bugfix] Fix Container Height #7313

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Dec 16, 2024
Merged

[Bugfix] Fix Container Height #7313

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
207fa05
set the plotly-container div to full width & height
samhinshaw Dec 14, 2024
2db7deb
expand on comment
samhinshaw Dec 14, 2024
ea32632
add changelog entry
samhinshaw Dec 14, 2024
b79d5d0
also add v2.35.3 to changelog which was released on the v2 branch
archmoj Dec 16, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Next Next commit
set the plotly-container div to full width & height
  • Loading branch information
@samhinshaw
samhinshaw committed Dec 14, 2024
commit 207fa05f682bfda9bc6685d45bfd5101058e99fc
10 changes: 9 additions & 1 deletion src/plot_api/plot_api.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3671,7 +3671,15 @@ function makePlotFramework(gd) {
fullLayout._container.enter()
.insert('div', ':first-child')
.classed('plot-container', true)
.classed('plotly', true);
.classed('plotly', true)
// The plot container should always take the full with the height of its
// parent (the graph div). This ensures that for responsive plots
// without a height or width set, the paper div will take up the full
// height & width of the graph div.
.style({
width: "100%",
height: "100%"
});

// Make the svg container
fullLayout._paperdiv = fullLayout._container.selectAll('.svg-container').data([0]);
Expand Down
8 changes: 8 additions & 0 deletions src/plot_api/subroutines.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,6 +52,14 @@ function lsInner(gd) {
var axList = Axes.list(gd, '', true);
var i, subplot, plotinfo, ax, xa, ya;

// Set the width and height of the paper div ('.svg-container') in
// accordance with the users configuration and layout.
// If the plot is responsive and the user has not set a width/height, then
// the width/height of the paper div is set to 100% to fill the parent
// container.
// We can't leave the height or width unset because all of the contents of
// the paper div are positioned absolutely (and will therefore not take up
// any space).
fullLayout._paperdiv.style({
width: (gd._context.responsive && fullLayout.autosize && !gd._context._hasZeroWidth && !gd.layout.width) ? '100%' : fullLayout.width + 'px',
height: (gd._context.responsive && fullLayout.autosize && !gd._context._hasZeroHeight && !gd.layout.height) ? '100%' : fullLayout.height + 'px'
Expand Down
0