This D3.js v7 example displays two overlapping area charts comparing Quantity1 and Quantity2 across categories and subcategories, using a vertical side-by-side legend to identify each series. The visualization fetches CSV data from a GitHub-hosted dataset and maps subcategories to a band scale on the x-axis while quantities use a linear scale on the y-axis. The code employs `d3.scaleBand`, `d3.scaleLinear`, `d3.area`, `d3.axisBottom`, and `d3.axisLeft` to construct the SVG rendering. Colored fills from `d3.schemeCategory10` distinguish the two quantities, with axes labeled "Subcategory" and "Quantity" and x-axis labels rotated for readability.