Heart rate

100%

✓ Published2🌍 Public

Last edited Mar 26, 2022

Created on Mar 26, 2022

A line chart shows heart rate over time, with time on the x-axis and heart rate values on the y-axis. The visualization uses Vega-Lite’s `line` mark, encoding a temporal field for x and a quantitative field for y. Data is loaded from a remote CSV file via a URL in the Vega-Lite specification. The chart is rendered in the browser using Vega-Embed, which loads the specification and displays the resulting visualization. The chart is set to a fixed width of 360 pixels.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Heart rate

This line chart displays gross value over time, sourced from a CSV file hosted in a GitHub gist. The visualization is rendered using Vega-Lite and embedded in an HTML page through the Vega-Embed API. The chart’s x-axis encodes the temporal dimension, while the y-axis encodes the quantitative gross value, with the data plotted using a simple line mark.

Ppreethamkesa

78% match

Loading thumbnail…

Line chart

This line chart visualizes temperature data over time, using a line mark to represent temperature values on the y-axis against timestamps on the x-axis. Built with the Vega-Lite API (vl) and D3.js, the example loads CSV data from a remote URL via d3.csv, then renders the chart with configurable axis styling and an SVG renderer. Tooltips are enabled through the Vega tooltip handler, and the visualization auto-fits to the browser window size.

NNikhil Sharma

74% match

Loading thumbnail…

line chart

This line chart visualizes temperature readings over time, with each point along the line representing a recorded temperature value and a tooltip displaying the exact temperature on hover. It renders as a single continuous stroke, styled with a dark color scheme for axis labels and a light grid. The visualization is built using the Vega-Lite API, which composes the chart specification and renders it through Vega. Data is loaded asynchronously from a CSV file using `d3.csv`, and the chart is configured with custom axis styles and a responsive sizing that adapts to the browser window dimensions. A Vega tooltip handler enables interactive data inspection.

Hhuashe418

74% match

Loading thumbnail…

Vega-Lite Line Chart

This visualization displays temperature readings over time as a single semi-transparent line, with tooltips revealing the associated location name for each data point. Built with the Vega-Lite API, it renders as an SVG using vega-lite v4 beta and vega-tooltip for interactive hover information. The code loads CSV data from a remote GitHub gist using d3.csv, then configures the chart dimensions to fit the full window while customizing axis colors and label styles for readability. The line mark uses explicit size and opacity settings to achieve its subtle visual effect.

Bbakstorage00001

73% match

Loading thumbnail…

Vega-Lite API Template

This example shows a line chart of temperature readings over time, rendered as a single thick stroke. The visualization uses the Vega-Lite API to specify the mark type and encodings, including the x-axis as a temporal field and the y-axis as a quantitative field with a non-zero scale. Data is fetched from a CSV file containing weekly San Francisco temperature measurements using d3’s `csv` function. The code registers Vega-Lite and Vega-Tooltip to enable interactive tooltips, and applies custom axis styling from a configuration object.

AAnkit5ingh

72% match

Loading thumbnail…

Tempurature Line Chart

This chart displays temperature readings over time using a line plot, with the y-axis labeled “temperature” and the x-axis labeled “timestamp.” The visualization is constructed with the Vega-Lite API, which registers Vega and Vega-Lite libraries and renders to SVG. Data is loaded from a CSV file via d3.csv, and the chart’s appearance is customized through a configuration object that adjusts axis ticks, font sizes, and color. Tooltips are enabled via the Vega-Tooltip handler, showing the temperature value on hover.

AAndres de la Garza

72% match

Loading thumbnail…

p

A simple line chart shows the change in a quantitative "rate" over temporal "steps" using a single line mark. It loads its data from a remote GitHub gist URL, and the chart is defined as a Vega-Lite specification in `line.vl.json`. The visualization is rendered by the Vega-Lite and Vega libraries, embedded into the page via `vegaEmbed`. The chart is configured with a fixed width of 360 pixels, encoding the steps field on the x-axis and the rate field on the y-axis.

Ppreethamkesa

71% match

Loading thumbnail…

[Vega-Lite] 3.2 Line Chart

This visualization displays fluctuations in the S&P 500 stock index over time, with a line chart showing price changes along a temporal axis. The example uses Vega-Lite’s JSON specification format to declare the chart, which is rendered through the vega-embed library within a minimal HTML page. The chart encodes dates on the x-axis and quantitative price values on the y-axis, while the mark type is set to "area" to fill the region beneath the line. The underlying data is fetched from a remote CSV hosted in a GitHub gist.

PPeilingShih

70% match