-
-
Notifications
You must be signed in to change notification settings - Fork 1.8k
Commit
Fix wrapped horizontal legends height computations
- Loading branch information
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -630,7 +630,6 @@ function computeLegendDimensions(gd, groups, traces) { | |
var offsetX = 0; | ||
var fullTracesWidth = 0; | ||
var traceGap = opts.tracegroupgap || 5; | ||
var oneRowLegend; | ||
|
||
// calculate largest width for traces and use for width of all legend items | ||
traces.each(function(d) { | ||
|
@@ -639,15 +638,16 @@ function computeLegendDimensions(gd, groups, traces) { | |
}); | ||
|
||
// check if legend fits in one row | ||
oneRowLegend = fullLayout._size.w > borderwidth + fullTracesWidth - traceGap; | ||
var oneRowLegend = fullLayout._size.w > borderwidth + fullTracesWidth - traceGap; | ||
This comment has been minimized.
Sorry, something went wrong.
This comment has been minimized.
Sorry, something went wrong.
Braintelligence
|
||
|
||
traces.each(function(d) { | ||
var legendItem = d[0]; | ||
var traceWidth = oneRowLegend ? 40 + d[0].width : maxTraceWidth; | ||
|
||
if((borderwidth + offsetX + traceGap + traceWidth) > fullLayout._size.w) { | ||
offsetX = 0; | ||
rowHeight = rowHeight + maxTraceHeight; | ||
opts._height = opts._height + maxTraceHeight; | ||
rowHeight += maxTraceHeight; | ||
opts._height += maxTraceHeight; | ||
// reset for next row | ||
maxTraceHeight = 0; | ||
} | ||
|
@@ -657,16 +657,20 @@ function computeLegendDimensions(gd, groups, traces) { | |
(5 + borderwidth + legendItem.height / 2) + rowHeight); | ||
|
||
opts._width += traceGap + traceWidth; | ||
opts._height = Math.max(opts._height, legendItem.height); | ||
|
||
// keep track of tallest trace in group | ||
offsetX += traceGap + traceWidth; | ||
maxTraceHeight = Math.max(legendItem.height, maxTraceHeight); | ||
}); | ||
|
||
if(oneRowLegend) { | ||
opts._height = maxTraceHeight; | ||
} else { | ||
opts._height += maxTraceHeight; | ||
} | ||
|
||
opts._width += borderwidth * 2; | ||
opts._height += 10 + borderwidth * 2; | ||
|
||
} | ||
|
||
// make sure we're only getting full pixels | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,58 @@ | ||
{ | ||
"data": [ | ||
{ | ||
"x": [ 1, 2, 3, 4 ], | ||
"y": [ 3, 5, 1, 7 ], | ||
"name": "Break this and last<br>trace will display properly" | ||
}, | ||
{ | ||
"x": [ 1, 2, 3, 4 ], | ||
"y": [ 3, 5, 1, 7 ], | ||
"name": "You need to break this trace twice if first one has no break" | ||
}, | ||
{ | ||
"x": [ 1, 2, 3, 4 ], | ||
"y": [ 3, 5, 1, 7 ], | ||
"name": "You need to break this trace twice if first one has no break" | ||
}, | ||
{ | ||
"x": [ 1, 2, 3, 4 ], | ||
"y": [ 3, 5, 1, 7 ], | ||
"name": "You need to break this trace twice if first one has no break" | ||
}, | ||
{ | ||
"x": [ 1, 2, 3, 4 ], | ||
"y": [ 3, 5, 1, 7 ], | ||
"name": "You need to break this trace twice if first one has no break" | ||
}, | ||
{ | ||
"x": [ 1, 2, 3, 4 ], | ||
"y": [ 3, 5, 1, 7 ], | ||
"name": "You need to break this trace twice if first one has no break" | ||
}, | ||
{ | ||
"x": [ 1, 2, 3, 4 ], | ||
"y": [ 3, 5, 1, 7 ], | ||
"name": "This<br> contains<br>a break" | ||
} | ||
], | ||
"layout": { | ||
"legend": { | ||
"orientation": "h", | ||
"xanchor": "center", | ||
"yanchor": "top", | ||
"x": 0.5, | ||
"y": -0.1, | ||
"traceorder": "normal" | ||
}, | ||
"paper_bgcolor": "rgba(255,0,0,0.5)", | ||
"margin": { | ||
"l": 20, | ||
"r": 20, | ||
"t": 20, | ||
"b": 20 | ||
}, | ||
"width": 360, | ||
"height": 600 | ||
} | ||
} |
Could this be related to #3175 (comment) ? Does the detection if we're looking at one row fail in Firefox mobile developer view?