diff --git a/docs/elements/courtyardoutline.mdx b/docs/elements/courtyardoutline.mdx index 5fa2511..f3b51b9 100644 --- a/docs/elements/courtyardoutline.mdx +++ b/docs/elements/courtyardoutline.mdx @@ -75,3 +75,68 @@ export default () => ( ) `} /> + +## Anchor Alignment Examples + +`` draws the polygon you provide in footprint coordinates. +To make the footprint origin act like a specific anchor (center, top-left, +bottom-right, etc.), translate the outline points accordingly. + + { + const W = 10 + const H = 6 + + const rect = [ + { x: 0, y: 0 }, + { x: W, y: 0 }, + { x: W, y: H }, + { x: 0, y: H }, + ] + + const translate = (outline, dx, dy) => + outline.map((p) => ({ x: p.x + dx, y: p.y + dy })) + + return ( + + + + + + } + /> + + + + + + } + /> + + + + + + } + /> + + ) +} +`} +/>