diff --git a/src/components/legend/draw.js b/src/components/legend/draw.js index 6c1baf89ce5..c507906a083 100644 --- a/src/components/legend/draw.js +++ b/src/components/legend/draw.js @@ -585,48 +585,6 @@ function computeLegendDimensions(gd, groups, traces) { extraWidth = 40; } - else if(isGrouped) { - var groupXOffsets = [opts._width]; - var groupData = groups.data(); - - for(var i = 0, n = groupData.length; i < n; i++) { - var textWidths = groupData[i].map(function(legendItemArray) { - return legendItemArray[0].width; - }); - - var groupWidth = 40 + Math.max.apply(null, textWidths); - - opts._width += opts.tracegroupgap + groupWidth; - - groupXOffsets.push(opts._width); - } - - groups.each(function(d, i) { - Drawing.setTranslate(this, groupXOffsets[i], 0); - }); - - groups.each(function() { - var group = d3.select(this); - var groupTraces = group.selectAll('g.traces'); - var groupHeight = 0; - - groupTraces.each(function(d) { - var legendItem = d[0]; - var textHeight = legendItem.height; - - Drawing.setTranslate(this, - 0, - (5 + borderwidth + groupHeight + textHeight / 2)); - - groupHeight += textHeight; - }); - - opts._height = Math.max(opts._height, groupHeight); - }); - - opts._height += 10 + borderwidth * 2; - opts._width += borderwidth * 2; - } else { var rowHeight = 0; var maxTraceHeight = 0; diff --git a/test/image/baselines/legend_horizontal_groups.png b/test/image/baselines/legend_horizontal_groups.png index 29536dc9b0f..371bd3a11e0 100644 Binary files a/test/image/baselines/legend_horizontal_groups.png and b/test/image/baselines/legend_horizontal_groups.png differ diff --git a/test/image/baselines/legendgroup_horizontal_wrapping.png b/test/image/baselines/legendgroup_horizontal_wrapping.png new file mode 100644 index 00000000000..3872345297f Binary files /dev/null and b/test/image/baselines/legendgroup_horizontal_wrapping.png differ diff --git a/test/image/mocks/legendgroup_horizontal_wrapping.json b/test/image/mocks/legendgroup_horizontal_wrapping.json new file mode 100644 index 00000000000..ccc88a3eb9d --- /dev/null +++ b/test/image/mocks/legendgroup_horizontal_wrapping.json @@ -0,0 +1,51 @@ +{ + "data": [{ + "x": [1, 2, 3, 4], + "y": [63.69, 62.55, 61.64, 61.39], + "legendgroup": 1 + }, { + "x": [1, 2, 3, 4], + "y": [58.24, 54.93, 42.11, 50.75], + "legendgroup": 1 + }, { + "x": [1, 2, 3, 4], + "y": [51.49, 49.59, 37.12, 31.45] + }, { + "x": [1, 2, 3, 4], + "y": [49.09, 58.54, 53.91, 43.12] + }, { + "x": [1, 2, 3, 4], + "y": [70.53, 72.51, 72.28, 78.65] + }, { + "x": [1, 2, 3, 4], + "y": [62.69, 59.09, 63.82, 62] + }, { + "x": [1, 2, 3, 4], + "y": [76.27, 71.43, 59.83, 64.34] + }, { + "x": [1, 2, 3, 4], + "y": [71.15, 81.82, 88.46, 74.29] + }, { + "x": [1, 2, 3, 4], + "y": [57.89, 57.38, 52.08, 63.83] + }, { + "x": [1, 2, 3, 4], + "y": [65.4, 63.27, 65.78, 64.03] + }], + "layout": { + "width": 600, + "legend": { + "orientation": "h" + }, + "xaxis": { + "type": "linear", + "range": [0.7840236686390533, 4.215976331360947], + "autorange": true + }, + "yaxis": { + "type": "linear", + "range": [27.274108280254776, 92.63589171974522], + "autorange": true + } + } +}