This example displays a simple yellow smiley face drawn with SVG shapes, centered within a 500×400 canvas. The construction uses D3 v6 selection and attribute methods to position a yellow circle for the head, two black circles for the eyes, and a red rectangle for the mouth. The code calculates all coordinates relative to the SVG’s width and height, ensuring the face remains centered. It relies on D3’s append and attr functions exclusively for creating and styling the visual elements.