This example demonstrates two types of map legends rendered as SVG. A color legend for an ordinal scale shows four fruit categories with distinct colors, while a size legend for a square-root scale displays five circular symbols whose radii encode numeric values. The code builds reusable legend components using D3 v5 selection methods, including `selectAll`, `enter`, and `merge`, with scales from `scaleOrdinal` and `scaleSqrt`. Both legends are positioned manually via `translate` and styled with CSS classes.