This example combines d3-brush and d3-zoom to implement a Focus + Context visualization of the S&P 500 index. The main chart displays the full time series as a blue area, while a smaller context chart below shows the same data with a brushable selection window. Users can either drag the brush handle in the context view to select a date range, or pan/zoom directly on the focus view. The two views are synchronized bidirectionally, so brushing the context updates the focus, and zooming in the focus updates the brush selection. The code enforces a minimum brush size to prevent over-zooming, and uses d3.zoom's transform to rescale the x-scale during pan/zoom interactions.