diff --git a/plugins/wiggle/src/MultiLinearWiggleDisplay/components/WiggleDisplayComponent.tsx b/plugins/wiggle/src/MultiLinearWiggleDisplay/components/WiggleDisplayComponent.tsx index 13b5b7417f..ec4fec27a7 100644 --- a/plugins/wiggle/src/MultiLinearWiggleDisplay/components/WiggleDisplayComponent.tsx +++ b/plugins/wiggle/src/MultiLinearWiggleDisplay/components/WiggleDisplayComponent.tsx @@ -101,31 +101,41 @@ const ColorLegend = observer( const { needsCustomLegend, needsScalebar, + needsFullHeightScalebar, rowHeightTooSmallForScalebar, renderColorBoxes, sources, } = model const svgFontSize = Math.min(rowHeight, 12) const canDisplayLabel = rowHeight > 11 - + const colorBoxWidth = renderColorBoxes ? 15 : 0 + const legendWidth = labelWidth + colorBoxWidth + 5 + const extraOffset = needsScalebar && !rowHeightTooSmallForScalebar ? 50 : 0 return sources ? ( <> + {needsFullHeightScalebar ? ( + + ) : null} {sources.map((source, idx) => { - // put the subtrack labels to the right of the scalebar - const extraOffset = - needsScalebar && !rowHeightTooSmallForScalebar ? 50 : 0 - const colorBoxWidth = renderColorBoxes ? 15 : 0 - const legendWidth = labelWidth + colorBoxWidth + 5 const boxHeight = Math.min(20, rowHeight) - return ( - + {!needsFullHeightScalebar ? ( + + ) : null} {source.color ? (