Fork 3 of Vega-Lite API Template

100%

Fork 3 of Vega-Lite API Template

✓ Published1🌍 Public

Last edited Jan 10, 2025

Created on Jan 10, 2025

Forked from Fork 2 of Vega-Lite API Template

This visualization displays a time-series line chart of weekly temperatures in San Francisco. The line mark plots temperature values against timestamps, with a tooltip showing the exact recorded temperature on hover. The example is built using the Vega-Lite API, which compiles specifications to Vega and renders via D3. Data is loaded from a remote CSV file using D3’s `csv` method, and the chart is configured with custom axis styles and font sizes for readability. The visualization automatically fits to the window dimensions.

AI-generated description

A visualization constructed using the vega-lite-api.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Vega-Lite API Template

This example displays a line chart of weekly temperature data for San Francisco, using the Vega-Lite API to construct the visualization declaratively. The chart renders temperature values over time with a tooltip on hover, styled with custom axis configuration. It loads CSV data via d3.csv, registers Vega and Vega-Lite with the vega-lite-api library, and renders the final output as an SVG using vega-tooltip for interactivity. The visualization fills the entire browser window and adapts to its size.

CChristian Potdevin

94% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example shows a time series line chart of weekly temperature data for San Francisco. The visualization uses a line mark to connect data points over time, with tooltips displaying the temperature value on hover. The chart is built using the Vega-Lite API, which constructs the visualization specification programmatically and renders it via the Vega rendering engine. The code imports data from a CSV file hosted on GitHub, and customizes the chart’s appearance through a configuration object that adjusts axis styling and font colors. The visualization automatically fits its width and height to the browser window, using d3’s CSV parser to load the dataset.

DDon-eime

93% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example uses the Vega-Lite API to render a line chart of San Francisco weekly temperatures, sourced from a CSV via d3.csv. The visualization encodes timestamps on the x-axis and temperature values on the y-axis, with tooltips displaying temperature details. It leverages vega-lite-api to construct the chart specification, vega-lite to compile it, and vega-tooltip for interactive hover information, all styled with a custom config for readability.

JJadeITNT

93% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example displays a time-series line chart of weekly temperature data for San Francisco, using the Vega-Lite API to declare marks and encodings for time on the x-axis and temperature on the y-axis. The `getData.js` file loads CSV data from a remote URL via `d3.csv`, and the chart renders with a custom dark theme and tooltips. It leverages `vega`, `vega-lite`, `vega-lite-api`, and `vega-tooltip` to build the visualization in an SVG view.

Eeleshaky

93% match

Loading thumbnail…

Fork of Fork of Vega-Lite API Template

This visualization displays a week of temperature data from San Francisco using an area mark, with time on the x-axis and temperature on the y-axis. It is built with the Vega-Lite API, which registers Vega and Vega-Lite libraries, and uses D3’s `d3.csv` to load data from a remote gist. The chart auto-sizes to the full window and applies a custom configuration for axis and label styling, with a tooltip handler from Vega-Tooltip.

JJonas Carvalho

92% match

Loading thumbnail…

Fork of Vega-Lite API Template

This example shows a line chart of weekly temperature readings from San Francisco, using Vega-Lite’s declarative API. The chart encodes time on the x-axis and temperature on the y-axis, with a tooltip revealing the precise temperature value per point. The visualization is built with the `vega-lite-api` library, which registers Vega and Vega-Lite, and loads data via `d3.csv`. It renders interactively to an SVG, sized to the window, with custom axis and label styling from a configuration object.

Jj-PGi

92% match

Loading thumbnail…

Fork of Fork of Fork of Vega-Lite API Template

This example uses the Vega-Lite API to render a line chart of San Francisco weekly temperature data from a CSV file loaded via d3.csv. The visualization encodes timestamps on the x-axis and temperature on the y-axis, with a customized dark theme and larger axis labels for readability. The chart automatically resizes to fit the browser window and includes interactive tooltips via vega-tooltip. The code registers Vega-Lite with the API wrapper and uses the markLine specification to draw the single series.

Nnkarinti

92% match

Loading thumbnail…

Fork of Fork of Vega-Lite API Template

A line chart displays temperature readings over time, with a tooltip that reveals the exact temperature on hover. The visualization is built using the Vega-Lite API, which translates a concise specification into a rendered Vega graphic. Data is loaded from a CSV file of San Francisco weekly temperatures via the `d3.csv` method. The chart's appearance, including axis styling and label fonts, is customized through a configuration object, and the visualization resizes to fit the browser window.

Nnkarinti

92% match