This example demonstrates two types of legends using D3.js version 5.6.0, rendered as SVG elements. The first legend uses `scaleOrdinal` to map fruit names to colors, displayed as labeled circles. The second legend uses `scaleSqrt` to map a numeric domain to circle radii, with labeled tick marks. Both legends are created using custom reusable functions, `colorLegend` and `sizeLegend`, which manage the enter/update/exit lifecycle for the SVG groups, circles, and text elements.