improve tile ID rendering within the BoundingBoxRenderer so that tile IDs are easier to read

trautmane · trautmane · commit 8e420f2f13b3 · 2026-06-07T21:42:35.000-04:00
diff --git a/render-app/src/main/java/org/janelia/alignment/BoundingBoxRenderer.java b/render-app/src/main/java/org/janelia/alignment/BoundingBoxRenderer.java
@@ -6,8 +6,10 @@
 import java.awt.FontMetrics;
 import java.awt.Graphics2D;
 import java.awt.Rectangle;
+import java.awt.RenderingHints;
 import java.awt.Stroke;
 import java.awt.image.BufferedImage;
+import java.util.ArrayList;
 import java.util.List;
 
 import org.janelia.alignment.spec.TileSpec;
@@ -18,10 +20,25 @@
  * Simple utility to render bounding boxes for tiles.
  * If there is enough area to display them, tile identifiers are also rendered inside each box.
  *
+ * <p>The font size is fixed at {@value #TILE_ID_FONT_SIZE} points regardless of render scale.
+ * For each tile the number of characters that fit on one line is computed from the actual
+ * scaled box width and the font metrics, so labels wrap correctly at any scale.  If the box
+ * is too narrow to display even one character the label is omitted entirely for that tile.</p>
+ *
  * @author Eric Trautman
  */
 public class BoundingBoxRenderer {
 
+    /** Point size of the font used to render tile identifiers. */
+    public static final int TILE_ID_FONT_SIZE = 12;
+
+    /**
+     * Fraction of each box dimension reserved as padding margin when deciding whether tile-id
+     * text fits.  A value of 1.3 means the text block must fit within ~77% of the box width
+     * and height (i.e. {@code usable = boxDimension / TILE_ID_BOX_MARGIN}).
+     */
+    public static final double TILE_ID_BOX_MARGIN = 1.3;
+
     private final RenderParameters renderParameters;
     private final double xOffset;
     private final double yOffset;
@@ -38,12 +55,10 @@ public BoundingBoxRenderer(final RenderParameters renderParameters,
     public BoundingBoxRenderer(final RenderParameters renderParameters,
                                final Color foregroundColor,
                                final float lineWidth) {
-
         this.renderParameters = renderParameters;
         this.xOffset = renderParameters.getX();
         this.yOffset = renderParameters.getY();
         this.scale = renderParameters.getScale();
-
         this.foregroundColor = foregroundColor;
 
         if (renderParameters.getBackgroundRGBColor() == null) {
@@ -60,6 +75,11 @@ public void render(final BufferedImage targetImage)
 
         final Graphics2D targetGraphics = targetImage.createGraphics();
 
+        targetGraphics.setRenderingHint(RenderingHints.KEY_TEXT_ANTIALIASING,
+                                        RenderingHints.VALUE_TEXT_ANTIALIAS_ON);
+        targetGraphics.setRenderingHint(RenderingHints.KEY_RENDERING,
+                                        RenderingHints.VALUE_RENDER_QUALITY);
+
         targetGraphics.setColor(foregroundColor);
         targetGraphics.setStroke(stroke);
 
@@ -69,52 +89,66 @@ public void render(final BufferedImage targetImage)
         }
 
         final List<TileSpec> tileSpecs = renderParameters.getTileSpecs();
-        final int maxCharactersPerLine = 12;
 
-        int lineWidth = 0;
+        FontMetrics metrics = null;
         int lineHeight = 0;
-        int minBoxWidthForTileIdRendering = 0;
-        if (tileSpecs.size() > 0) {
+        int charWidth = 0;  // width of a single monospaced character
+
+        if (! tileSpecs.isEmpty()) {
             targetGraphics.setFont(TILE_ID_FONT);
-            final FontMetrics metrics = targetGraphics.getFontMetrics();
-            lineWidth = metrics.stringWidth("A") * maxCharactersPerLine;
+            metrics = targetGraphics.getFontMetrics();
             lineHeight = metrics.getHeight();
-
-            // add margin that should be good enough for 'typical' overlap
-            minBoxWidthForTileIdRendering = (int) (lineWidth * 1.3) + 1;
+            // MONOSPACED: all characters have the same advance width.
+            charWidth = metrics.charWidth('A');
         }
 
-        Rectangle box;
-        String tileId;
-        int x;
-        int y;
-        int start;
         for (final TileSpec tileSpec : tileSpecs) {
 
-            box = getScaledBox(tileSpec);
+            final Rectangle box = getScaledBox(tileSpec);
             targetGraphics.draw(box);
 
-            if (box.width > minBoxWidthForTileIdRendering) {
+            final String tileId = tileSpec.getTileId();
+            if (tileId == null || tileId.isEmpty()) {
+                continue;
+            }
 
-                tileId = tileSpec.getTileId();
+            // Derive how many margin pixels to leave on each side (same fraction as before).
+            final int usableWidth = (int) (box.width / TILE_ID_BOX_MARGIN);
 
-                if (tileId != null) {
-                    x = box.x + ((box.width - lineWidth) / 2); // center tileId horizontally
-                    y = box.y + (box.height / 4);              // shift tileId down from top to avoid 'typical' overlap
+            // How many characters fit on one line inside this box?
+            final int charsPerLine = usableWidth / charWidth;
 
-                    start = 0;
-                    for (int stop = maxCharactersPerLine; stop < tileId.length(); stop += maxCharactersPerLine) {
-                        targetGraphics.drawString(tileId.substring(start, stop), x, y);
-                        y = y + lineHeight;
-                        start = stop;
-                    }
-                    if (start < tileId.length()) {
-                        targetGraphics.drawString(tileId.substring(start), x, y);
-                    }
-                }
+            // If not even one character fits, skip the label for this tile.
+            if (charsPerLine < 1) {
+                continue;
+            }
+
+            // How many lines does this tile id need, and do they fit vertically?
+            final List<String> lines = wrapText(tileId, charsPerLine);
+            final int totalTextHeight = lines.size() * lineHeight;
 
+            // Only draw if the wrapped text fits inside the usable box height (same margin as width).
+            final int usableHeight = (int) (box.height / TILE_ID_BOX_MARGIN);
+            if (totalTextHeight > usableHeight) {
+                continue;
+            }
+
+            // Measure the widest line so we can centre the block horizontally.
+            int maxLineWidth = 0;
+            for (final String line : lines) {
+                final int w = metrics.stringWidth(line);
+                if (w > maxLineWidth) {
+                    maxLineWidth = w;
+                }
             }
 
+            final int x = box.x + ((box.width - maxLineWidth) / 2);                    // centre horizontally
+            int y = box.y + ((box.height - totalTextHeight) / 2) + metrics.getAscent(); // centre vertically
+
+            for (final String line : lines) {
+                targetGraphics.drawString(line, x, y);
+                y += lineHeight;
+            }
         }
 
         if (renderParameters.isAddWarpFieldDebugOverlay()) {
@@ -129,6 +163,25 @@ public void render(final BufferedImage targetImage)
         LOG.debug("render: exit, boxes for {} tiles rendered", tileSpecs.size());
     }
 
+    /**
+     * Wraps {@code text} into lines of at most {@code maxChars} characters each,
+     * breaking only at character boundaries (no word-wrap, matching the original behaviour).
+     *
+     * @param text      the string to wrap.
+     * @param maxChars  maximum number of characters per line (must be &gt;= 1).
+     * @return list of lines, never empty.
+     */
+    static List<String> wrapText(final String text, final int maxChars) {
+        final List<String> lines = new ArrayList<>();
+        int start = 0;
+        while (start < text.length()) {
+            final int end = Math.min(start + maxChars, text.length());
+            lines.add(text.substring(start, end));
+            start = end;
+        }
+        return lines;
+    }
+
     private Rectangle getScaledBox(final TileSpec tileSpec) {
         final double x = (tileSpec.getMinX() - xOffset) * scale;
         final double y = (tileSpec.getMinY() - yOffset) * scale;
@@ -139,5 +192,5 @@ private Rectangle getScaledBox(final TileSpec tileSpec) {
 
     private static final Logger LOG = LoggerFactory.getLogger(BoundingBoxRenderer.class);
 
-    private static final Font TILE_ID_FONT = new Font(Font.MONOSPACED, Font.PLAIN, 12);
-}
+    private static final Font TILE_ID_FONT = new Font(Font.MONOSPACED, Font.BOLD, TILE_ID_FONT_SIZE);
+}
diff --git a/render-app/src/test/java/org/janelia/alignment/BoundingBoxRendererTest.java b/render-app/src/test/java/org/janelia/alignment/BoundingBoxRendererTest.java
@@ -2,8 +2,11 @@
 
 import java.awt.Color;
 import java.awt.image.BufferedImage;
+import java.io.File;
 import java.util.Arrays;
 
+import javax.imageio.ImageIO;
+
 import org.junit.Assert;
 import org.junit.Test;
 
@@ -17,28 +20,7 @@ public class BoundingBoxRendererTest {
 
     @Test
     public void testRender() {
-
-        final String json =
-                "{\n" +
-                "  \"x\" : 0.0, \"y\" : 0.0, \"width\" : 400, \"height\" : 100, \"scale\" : 1.0,\n" +
-                "  \"tileSpecs\" : [ {\n" +
-                "    \"tileId\" : \"tile_a.1.0\",\n" +
-                "    \"z\" : 1.0, \"minX\" : 0.0, \"minY\" : 0.0, \"maxX\" : 199.0, \"maxY\" : 99.0, \"width\" : 200.0, \"height\" : 100.0,\n" +
-                "    \"mipmapLevels\" : { \"0\" : { \"imageUrl\" : \"src/test/resources/stitch-test/col0075_row0021_cam1.png\" } },\n" +
-                "    \"transforms\" : { \"type\" : \"list\", \"specList\" : [ \n" +
-                "      { \"className\" : \"mpicbg.trakem2.transform.AffineModel2D\", \"dataString\" : \"1 0 0 1 0 0\" } ]\n" +
-                "    }\n" +
-                "  }, {\n" +
-                "    \"tileId\" : \"tile_b.1.0\",\n" +
-                "    \"z\" : 1.0, \"minX\" : 190.0, \"minY\" : 0.0, \"maxX\" : 389.0, \"maxY\" : 99.0, \"width\" : 200.0, \"height\" : 100.0,\n" +
-                "    \"mipmapLevels\" : { \"0\" : { \"imageUrl\" : \"src/test/resources/stitch-test/col0076_row0021_cam0.png\" } },\n" +
-                "    \"transforms\" : { \"type\" : \"list\", \"specList\" : [ \n" +
-                "      { \"className\" : \"mpicbg.trakem2.transform.AffineModel2D\", \"dataString\" : \"1 0 0 1 190 0\" } ]\n" +
-                "    }\n" +
-                "  } ]\n" +
-                "}";
-
-        final RenderParameters renderParameters = RenderParameters.parseJson(json);
+        final RenderParameters renderParameters = RenderParameters.parseJson(TEST_JSON);
 
         final BufferedImage bufferedImage = renderParameters.openTargetImage();
 
@@ -65,4 +47,65 @@ public void testRender() {
         }
 
     }
+
+    private static final String TEST_JSON =
+            "{\n" +
+            "  \"x\" : 0.0, \"y\" : 0.0, \"width\" : 400, \"height\" : 100, \"scale\" : 1.0,\n" +
+            "  \"tileSpecs\" : [ {\n" +
+            "    \"tileId\" : \"tile_a.1.0\",\n" +
+            "    \"z\" : 1.0, \"minX\" : 0.0, \"minY\" : 0.0, \"maxX\" : 199.0, \"maxY\" : 99.0, \"width\" : 200.0, \"height\" : 100.0,\n" +
+            "    \"mipmapLevels\" : { \"0\" : { \"imageUrl\" : \"src/test/resources/stitch-test/col0075_row0021_cam1.png\" } },\n" +
+            "    \"transforms\" : { \"type\" : \"list\", \"specList\" : [ \n" +
+            "      { \"className\" : \"mpicbg.trakem2.transform.AffineModel2D\", \"dataString\" : \"1 0 0 1 0 0\" } ]\n" +
+            "    }\n" +
+            "  }, {\n" +
+            "    \"tileId\" : \"tile_b.1.0\",\n" +
+            "    \"z\" : 1.0, \"minX\" : 190.0, \"minY\" : 0.0, \"maxX\" : 389.0, \"maxY\" : 99.0, \"width\" : 200.0, \"height\" : 100.0,\n" +
+            "    \"mipmapLevels\" : { \"0\" : { \"imageUrl\" : \"src/test/resources/stitch-test/col0076_row0021_cam0.png\" } },\n" +
+            "    \"transforms\" : { \"type\" : \"list\", \"specList\" : [ \n" +
+            "      { \"className\" : \"mpicbg.trakem2.transform.AffineModel2D\", \"dataString\" : \"1 0 0 1 190 0\" } ]\n" +
+            "    }\n" +
+            "  } ]\n" +
+            "}";
+
+    /**
+     * Generates PNG files showing bounding-box renders at several scales so that tile-id
+     * label readability can be compared visually.
+     *
+     * <p>Output files are written to the system temp directory.  The path of each generated
+     * file is printed to stdout.</p>
+     *
+     * <p>Usage: run as a standard Java application (no arguments required).</p>
+     */
+    public static void main(final String[] args) throws Exception {
+
+        // Scales to render — covering a wide range so readability can be compared easily.
+        final double[] scales = {1.0, 0.8, 0.6, 0.4 };
+
+        for (final double scale : scales) {
+            // Load fresh parameters for each scale so that canvas dimensions are recomputed.
+            final RenderParameters renderParameters = RenderParameters.parseJson(TEST_JSON);
+
+            // Override the scale.
+            renderParameters.setScale(scale);
+            renderParameters.initializeDerivedValues();
+
+            final BufferedImage targetImage = renderParameters.openTargetImage();
+
+            final BoundingBoxRenderer renderer = new BoundingBoxRenderer(renderParameters, Color.GREEN);
+            renderer.render(targetImage);
+
+            final File outputFile = new File("/Users/trautmane/Desktop",
+                                             String.format("bounding_box_scale_%f.png", scale));
+            ImageIO.write(targetImage, "PNG", outputFile);
+
+            System.out.printf("scale=%-5s  image size=%4dx%-4d  file=%s%n",
+                              scale,
+                              targetImage.getWidth(),
+                              targetImage.getHeight(),
+                              outputFile.getAbsolutePath());
+        }
+
+    }
+
 }
