diff --git a/src/components/legend/draw.js b/src/components/legend/draw.js index 940c6a9c721..b56ecf4f448 100644 --- a/src/components/legend/draw.js +++ b/src/components/legend/draw.js @@ -708,7 +708,7 @@ function computeLegendDimensions(gd, groups, traces, opts) { var w = textGap + d[0].width; var next = (oneRowLegend ? w : maxItemWidth) + itemGap; - if((next + bw + offsetX) > opts._maxWidth) { + if((next + bw + offsetX - itemGap) >= opts._maxWidth) { maxRowWidth = Math.max(maxRowWidth, rowWidth); offsetX = 0; offsetY += maxItemHeightInRow; diff --git a/test/image/baselines/legend_horizontal_testwrap.png b/test/image/baselines/legend_horizontal_testwrap.png new file mode 100644 index 00000000000..3098a2451c5 Binary files /dev/null and b/test/image/baselines/legend_horizontal_testwrap.png differ diff --git a/test/image/baselines/legend_small_horizontal.png b/test/image/baselines/legend_small_horizontal.png index c79795d2ac2..97445e02ebe 100644 Binary files a/test/image/baselines/legend_small_horizontal.png and b/test/image/baselines/legend_small_horizontal.png differ diff --git a/test/image/mocks/legend_horizontal_testwrap.json b/test/image/mocks/legend_horizontal_testwrap.json new file mode 100644 index 00000000000..2fab5a7585c --- /dev/null +++ b/test/image/mocks/legend_horizontal_testwrap.json @@ -0,0 +1,29 @@ +{ + "data": [ + { + "x": [0, 20, 40, 60, 80], + "y": [96.5468065879, 94.97385191686, 101.01829113346, 104.00785694962, 123.4647966861], + "type": "scatter", + "name": "test1 test test test test te" + }, + { + "x": [0, 20, 40, 60, 80], + "y": [101.463715404525, 97.993757416425, 100.77392335440001, 101.23231922917499, 106.118254309675], + "type": "scatter", + "name": "test2" + }, + { + "x": [0, 20, 40, 60, 80], + "y": [12, 9, 15, 12, 15], + "type": "scatter", + "name": "test3" + } + ], + "layout": { + "title": "Testplot", + "width": 400, + "height": 300, + "legend": {"orientation": "h"}, + "margin": {"l": 30, "r": 20} + } +}