fresh block

100%

✓ Published0🌍 Public

Last edited Apr 15, 2018

Created on Apr 15, 2018

This visualization shows multiple time-series lines representing different metrics (views, likes, dislikes, and comment counts) from a CSV dataset, plotted against dates in November 2017. The lines are smoothed using a basis curve and colored via a categorical color scale. A bottom time axis and left linear axis labeled "Temperature, ºF" frame the chart, while each line is labeled with its metric name at its final value. The data is parsed with d3.timeParse and rendered as SVG using D3 v4.

AI-generated description

Built with blockbuilder.org

mit Licensed

Similar vizzes

Loading thumbnail…

fresh block

This visualization displays monthly values as a line chart with circular markers, showing a basic time series of twelve data points from January through December 2016. The SVG rendering uses d3.svg.line with an ordinal x-scale and linear y-scale to map the data. Hovering over a grey circle highlights it in red, reveals the corresponding value as text above the point, and draws a dashed vertical line from the marker down to the chart baseline. The code relies on d3.json for data loading and d3.time.format for date parsing.

MMarineRu

83% match

Loading thumbnail…

fresh block

This example shows a simple time-series line chart of numeric values plotted against monthly dates. The visualization uses an SVG-rendered line and includes text labels for each date along the x-axis and the final value displayed prominently to the right. The code relies on D3 v4’s `d3.line` for the path generation, `d3.scaleTime` and `d3.scaleLinear` for the axes, and `d3.timeParse` to convert date strings. Data is loaded from an external `dataset.json` file, with the y-domain fixed from zero to the maximum value.

BBkilian971

82% match

Loading thumbnail…

fresh block

A line chart displays monthly values over time, with each data point shown as a semi-transparent grey circle. Hovering a circle highlights it in red, displays the numeric value as text, and draws a dashed vertical guide line to the baseline. The visualization uses D3 v4 with `d3.scaleTime`, `d3.scaleLinear`, `d3.line`, and `d3.json` to load and render the dataset, while `d3.select` and `transition` manage the interactive hover effects in an SVG container.

MMilowB

82% match

Loading thumbnail…

fresh block

A single black line chart plots monthly values from a small JSON dataset, with light gray circles marking each data point. Hovering a circle turns it red, displays the exact value above it, and draws a dashed vertical guide line to the baseline. The visualization uses D3 v4 with SVG rendering, applying `d3.scaleTime`, `d3.scaleLinear`, and `d3.line` for the chart, plus mouseover handlers to toggle the interactive details. Axis labels show abbreviated month-year formats, with the final value annotated in larger monospace text.

NNpfn

82% match

Loading thumbnail…

fresh block

This example shows a simple time series line chart of monthly values, with each data point’s date label displayed beneath the line and the final value annotated at the end of the curve. The chart uses a D3 v4 SVG rendering with a time-scaled x-axis and a linear y-axis, both defined via `d3.scaleTime` and `d3.scaleLinear`. The line is drawn using `d3.line` and appended as a path, while text elements are bound to the data for labels and the last value. Data is loaded from `dataset.json` and pre-processed with a time parser (`d3.timeParse`) and number formatting.

BBkilian971

82% match

Loading thumbnail…

fresh block

This example visualizes multiple time-series lines from a weather dataset, with each line representing a different category (`symbol`) and showing how a price-like value changes over time. The visualization uses D3 v3 to load CSV data, parse date strings with `d3.time.format`, and render the lines using `d3.svg.line`. A categorical color scale (`d3.scale.category10`) assigns distinct colors to each line dynamically, and the lines are drawn on an SVG canvas with a time-based x-axis and linear y-axis. The code nests the data by symbol using `d3.nest`, then appends a separate path for each group, highlighting the trend patterns across categories.

DDarienLiang

81% match

Loading thumbnail…

fresh block

A line chart displays monthly values for twelve categories labeled A through L, with circles marking each data point and dashed vertical guides from the baseline. Hovering a circle highlights it in red, fades in the corresponding value label and guide line, then restores them on mouseout. The visualization uses d3.line, d3.scaleTime, and d3.scaleLinear to position marks, with transitions on opacity for interactive feedback. Data comes from a local JSON file, and rendering occurs in SVG with a monospace font for numeric labels.

KKylaste

81% match

Loading thumbnail…

fresh block

A monthly time-series line chart displays a dataset of twelve alphabetical categories (A–L) with associated values. The visualization uses an SVG line and red circular markers to trace value changes over time. Built with D3.js v3, it employs ordinal and linear scales, a line generator, and custom mouseover/mouseout interactions that highlight data points with blue fills, dashed vertical guide lines, and enlarged value labels. The chart reads from an external JSON file, rendering axis labels as text elements and supporting smooth transitions during hover effects.

BBrunoDumas

81% match