draw: add drawRectangle

examples/lib/face-alignment.js

@@ -266,6 +266,8 @@
           outPtr,
           outSize,
         );
+        image.data.set(rgba);
+        ctx1.putImageData(image, 0, 0);
         const out = ctx2.getImageData(0, 0, outCols, outRows);
         out.data.set(outImg);
         ctx2.putImageData(out, 0, 0);

examples/src/face_alignment.zig

@@ -7,6 +7,7 @@ const Image = zignal.Image;
 const SimilarityTransform = zignal.SimilarityTransform(f32);
 const Rectangle = zignal.Rectangle(f32);
 const Rgba = zignal.Rgba;
+const drawRectangle = zignal.drawRectangle;
 
 pub const std_options: std.Options = .{
     .logFn = if (builtin.cpu.arch.isWasm()) @import("js.zig").logFn else std.log.defaultLog,
@@ -72,6 +73,7 @@ pub fn extractAlignedFace(
     defer rotated.deinit(allocator);
 
     const rect = Rectangle.initCenter(center.x, center.y, side * scale, side * scale);
+    drawRectangle(Rgba, image, rect, 1, .{ .r = 0, .g = 0, .b = 0, .a = 255 });
     var chip: Image(Rgba) = undefined;
     try rotated.crop(allocator, rect, &chip);
     defer chip.deinit(allocator);

src/draw.zig

@@ -4,6 +4,7 @@ const Color = @import("color.zig").Color;
 const Rgba = @import("color.zig").Rgba;
 const Image = @import("image.zig").Image;
 const Point2d = @import("point.zig").Point2d(f32);
+const Rectangle = @import("geometry.zig").Rectangle(f32);
 
 /// Draws a colored straight of a custom width between p1 and p2 on image.  Moreover, it alpha-blends
 /// pixels along diagonal lines.
@@ -188,6 +189,16 @@ pub fn drawLineFast(comptime T: type, image: Image(T), p1: Point2d, p2: Point2d,
     }
 }
 
+pub fn drawRectangle(comptime T: type, image: Image(T), rect: Rectangle, width: usize, color: T) void {
+    const points: []const Point2d = &.{
+        .{ .x = rect.l, .y = rect.t },
+        .{ .x = rect.r, .y = rect.t },
+        .{ .x = rect.r, .y = rect.b },
+        .{ .x = rect.l, .y = rect.b },
+    };
+    drawPolygon(T, image, points, width, color);
+}
+
 /// Draws a cross where each side is of length size
 pub fn drawCross(comptime T: type, image: Image(T), center: Point2d, size: usize, color: T) void {
     if (size == 0) return;

src/zignal.zig

@@ -28,5 +28,6 @@ pub const drawCircleFast = draw.drawCircleFast;
 pub const drawCross = draw.drawCross;
 pub const drawLine = draw.drawLine;
 pub const drawLineFast = draw.drawLineFast;
+pub const drawRectangle = draw.drawRectangle;
 pub const drawPolygon = draw.drawPolygon;
 pub const fillPolygon = draw.fillPolygon;