Multi-Series Line Chart

Multi-Series Line Chart

This multi-series line chart displays daily average temperatures for New York, San Francisco, and Austin over one year, using color to distinguish each city's trend. The visualization encodes dates on the x-axis via `d3.time.scale` and temperatures on the y-axis via `d3.scale.linear`, with `d3.svg.axis` rendering the axes. Data is loaded from a TSV file using `d3.tsv`, and each city’s line is drawn with `d3.svg.line`, colored by `d3.scale.category10`. The chart uses conventional margins and an SVG rendering approach, with city labels placed at the final data point.

Multi-Series Line Chart

This multi-series line chart visualizes the daily average temperatures for New York, San Francisco, and Austin over one year. Loaded from a TSV file, the data is parsed with `d3.tsv` and `d3.timeParse`, with dates mapped to the x-axis via `d3.scaleTime` and temperatures to the y-axis with `d3.scaleLinear`. Lines are drawn with `d3.line` and colored using `d3.scaleOrdinal` with a `d3.schemeCategory10` palette. The chart supports pan and zoom through the `d3.zoom` interaction, and clicking a city’s label highlights its line while dimming others via CSS transitions.

GGoomble

Multi-Series Line Chart

This multi-series line chart displays daily average temperatures for New York, San Francisco, and Austin over one year, loaded from a TSV file via d3.tsv. The visualization uses d3.time.scale for the x-axis, d3.scale.linear for the y-axis, d3.scale.category10 for color encoding, and d3.svg.line with basis interpolation to draw each city’s temperature trend. Axes are rendered with d3.svg.axis, while d3.extent, d3.min, and d3.max compute the domains. City labels appear at the end of each line, and the SVG output uses conventional margins.

Multi-Series Line Chart

This multi-series line chart shows daily average temperatures for New York, San Francisco, and Austin over one year, using color-coded lines for each city. The data is loaded from a TSV file and parsed with `d3.tsv` and `d3.timeParse`. It uses `d3.scaleTime` for the x-axis, `d3.scaleLinear` for the y-axis, and `d3.scaleOrdinal` with `d3.schemeCategory10` for color encoding. Lines are drawn with `d3.line` and a basis curve, while `d3.axisBottom` and `d3.axisLeft` render the axes. City labels are appended at the end of each line.

Mmbostock

Multi-Series Line Chart

This multi-series line chart shows the daily average temperatures in New York, San Francisco, and Austin over one year, with each city’s values plotted as a separate colored line and labeled with its name. The data is loaded from a TSV file using `d3.tsv`, parsed with `d3.timeParse`, and encoded with `d3.scaleTime`, `d3.scaleLinear`, and `d3.scaleOrdinal` using `d3.schemeCategory10`. Lines are drawn with `d3.line`, while axes are rendered via `d3.axisBottom` and `d3.axisRight`, and the SVG also includes small circles for each data point plus text annotations showing the temperature extremes.

GGoomble

Multi-Series Line Chart

This multi-series line chart displays daily average temperatures for New York, San Francisco, and Austin over a year, with each city represented by a distinct colored line. The visualization uses D3 v4’s SVG rendering, parsing a TSV file with `d3.tsv` and `d3.timeParse`. It encodes time on the x-axis via `d3.scaleTime`, temperature on the y-axis with `d3.scaleLinear`, and city categories using `d3.scaleOrdinal` with `d3.schemeCategory10`. The chart includes interactive zooming through `d3.zoom` and clickable city labels that toggle line visibility.

CCatherine-Yu

Multi-Series Line Chart

This multi-series line chart displays daily average temperatures for New York, San Francisco, and Austin over a year, with each city encoded by a distinct color from the `d3.scale.category10` ordinal scale. The visualization uses `d3.tsv` to load tabular data, `d3.time.format` to parse dates, and `d3.time.scale`/`d3.scale.linear` for the x- and y-axes. It renders SVG line shapes via `d3.svg.line`, with axes generated by `d3.svg.axis`, and computes domains using `d3.extent`, `d3.min`, and `d3.max`.

Multi-Series Line Chart

The visualization is a multi-series line chart that compares the daily average temperatures of New York, San Francisco, and Austin over one year, using a TSV file as its data source. It displays three colored lines, one per city, plotted over time on an SVG canvas. The chart uses D3 v3 APIs including `d3.tsv` to parse the data, `d3.time.scale` for the x-axis, `d3.scale.linear` for the y-axis, and `d3.scale.category10` for color encoding. Axes are rendered with `d3.svg.axis`, and the line paths are generated via `d3.svg.line` with basis interpolation.