put horizontal legend traces in columns

Author: psalmody

src/components/legend/draw.js

@@ -570,12 +570,18 @@ function computeLegendDimensions(gd, groups, traces) {
         opts.height = 0;
         var rowHeight = 0,
             maxTraceHeight = 0,
+            maxTraceWidth = 0,
             offsetX = 0;
 
+        //calculate largest width for traces and use for width of all legend items
+        traces.each(function(d) {
+          maxTraceWidth = Math.max(40 + d[0].width, maxTraceWidth);
+        });
+
         traces.each(function(d) {
 
             var legendItem = d[0],
-                traceWidth = 40 + legendItem.width,
+                traceWidth = maxTraceWidth,
                 traceGap = opts.tracegroupgap || 5;
 
             if((borderwidth + offsetX + traceGap + traceWidth) > (fullLayout.width - (fullLayout.margin.r + fullLayout.margin.l))) {