Fork of Vega-Lite API Template

100%

Fork of Vega-Lite API Template

✓ Published0🌍 Public

Last edited Jan 7, 2022

Created on Jan 7, 2022

This visualization displays daily average air temperatures in Belgium from 2017 to 2021 as a smooth line chart, using a bright magenta color scheme for high contrast against a dark background. It is built with the Vega-Lite API, which compiles specifications into Vega and renders via SVG, while D3.js loads the CSV data from a GitHub gist. The visualization configures custom axis styles and tooltips through vega-tooltip to show temperature readings on hover.

AI-generated description

A visualization constructed using the vega-lite-api.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Daily temperature in Belgium between 2017 and 2021

This fork visualizes daily average air temperatures in Belgium from late 2017 to late 2021 as a smooth line chart. The SVG rendering uses React with D3 v7, employing `scaleTime` and `scaleLinear` for axes, `line()` with `curveNatural` for the path, and data fetched via D3’s `csv` from a Gist. A pale gray grid and labeled axes frame the temporal trend.

Mmartfhill

85% match

Loading thumbnail…

Vega-lite-api-part2

This visualization displays daily atmospheric conditions in Belgium for 2021, using a bar chart to show mean relative humidity per month, with color encoding by wind speed and bars stacked by wind speed category. A second scatter plot shows air temperature averages over time. The code uses Vega-Lite API with React, D3’s CSV loader, Vega tooltip, and custom config for styling.

RRoland

84% match

Loading thumbnail…

Fork of Vega-Lite API Template

This visualization displays temperature trends over time as a line chart, with points sized and colored by temperature values. The example is built using the Vega-Lite API, which generates a Vega-Lite specification that is rendered as an SVG via the Vega rendering engine. The data is loaded as CSV from a Gist using D3’s `csv` function, and interactive tooltips are enabled through the Vega-Tooltip handler. Appearance is customized through a configuration object that adjusts axis styles and typography.

Ddimanya

83% match

Loading thumbnail…

Fork of D3 line chart: Daily temperature in Belgium for 2021

This interactive line chart visualizes daily average air temperatures in Belgium for 2021, plotted by date. The chart uses D3 v7 within a React app, leveraging `d3.scaleTime` and `d3.scaleLinear` for axes with a natural cubic spline curve (`d3.curveNatural`) through the data points. Data is loaded via `d3.csv` from a gist URL. The SVG renders customized tick marks, axis labels, and a temperature line, with the dataset sorted chronologically.

Ssaivinay143

83% match

Loading thumbnail…

Fork of D3 line chart: Daily temperature in Belgium between 2017 and 2021

This chart shows the daily average air temperature in Belgium from November 2017 to December 2021. A single smooth path traces the temperature fluctuations over time, with a time-scaled x-axis and a linear y-axis for degrees Celsius. Built with React and D3 v7, the visualization uses `d3.scaleTime`, `d3.scaleLinear`, and `d3.line` with a natural curve to render the SVG path. The data is loaded via `d3.csv` from a GitHub gist containing daily atmospheric conditions.

Vvlad

82% match

Loading thumbnail…

Fork of Daily temperature in Belgium between 2017 and 2021

A line chart displays daily average air temperature in Belgium from 2017 to 2021, with time on the x-axis and degrees Celsius on the y-axis. The SVG visualization uses React components with d3.scaleTime, d3.scaleLinear, and d3.line with curveNatural to render a smooth path. Axes are drawn via custom React components using d3 ticks, while data loads from a CSV through d3.csv and is sorted chronologically. The chart includes labeled axes and a minimal styling with Lato font.

GGeoffery Miller

82% match

Loading thumbnail…

Fork of D3 line chart: Daily temperature in Belgium for 2021

This interactive line chart displays the daily average air temperature in Belgium for the year 2021. Data is loaded from a CSV file using the `csv` function from D3 v7, then sorted by date. The visualization is built with React, rendering an SVG that uses `scaleTime` and `scaleLinear` to map date and temperature values to coordinates. A single natural cubic spline path, created with `line` and `curveNatural`, shows the temperature trend, while axes are generated with tick marks from `xScale.ticks()` and `yScale.ticks()`.

Ppreethamkesa

82% match

Loading thumbnail…

Fork of D3 line chart: Daily temperature in Belgium for 2021

A single black line chart depicts daily average air temperature in Belgium throughout 2021, with time on the x-axis and temperature in Celsius on the y-axis. The visualization uses D3's `scaleTime` and `scaleLinear` for axes, and `line` with `curveNatural` for the smooth path, rendered as SVG within a React application. Data comes from a CSV file loaded via `d3.csv`, and the natural curve interpolation smooths the daily fluctuations into a continuous trend.

Ddasari234

81% match