Data Table Summary

Avocado Dataset Characteristics

This example displays basic dataset characteristics for avocado sales data from 2015–2019 across U.S. cities, showing the CSV file size in kilobytes, the number of rows, and the number of columns. It loads the data asynchronously using `d3.csv` from a GitHub gist URL, then formats the raw data back to CSV with `d3.csvFormat` to calculate its byte length. The results are rendered as plain text in a `<pre>` element via the DOM API. The visualization demonstrates a minimal D3 v5 data-loading workflow without any graphical charting.

AAndrew Petit

82% match

Avocados Scatter Plot

This scatter plot displays the relationship between average price and total volume for avocados in 2018, with each point representing a market observation. The visualization uses D3 v5’s `scaleLinear`, `axisLeft`, `axisBottom`, and `csv` to load and map data from the Hass Avocado Board, rendering circles in an SVG canvas. Axes include formatted tick labels and clear titles, while a green, semi-transparent fill highlights point density. The code handles data parsing, margin-based layout, and custom axis labels, all styled via an external CSS file.

LLeora Wenger

78% match

Data Table Summary

This example displays a plain-text summary of a tabular dataset, showing the total row count, column count, and file size in kilobytes. It then prints the first ten rows as formatted JSON. The visualization uses D3 v5 APIs such as `d3.csv` to load the data, `d3.csvFormat` to measure its size, and `d3.select` to append `<pre>` elements to the page. The data consists of daily high and low stock prices for five companies sourced from Yahoo Finance.

77% match

Data Table Summary

This example displays a plain-text summary of a loaded CSV file, showing the total row count, column count, and file size in kilobytes, followed by the first ten rows formatted as JSON. It imports `select`, `csv`, and `csvFormat` from D3 v5 to fetch `data.csv` and compute the byte length. The output renders in a monospace `<pre>` element styled with green-on-black terminal colors. The dataset describes daily high and low stock prices for several tickers, sourced from a 2018 United Nations population report.

Cars Scatter Plot

This scatter plot displays the relationship between the total volume of avocados sold and their average price, with each point representing a weekly observation from 2016 to 2018, colored by year. The visualization uses D3 v5's scaleLinear, axisBottom, axisLeft, and scaleOrdinal APIs within an SVG rendering. Data is loaded from a CSV file containing Hass Avocado Board pricing information, processed by converting string values to numbers and normalizing volume to millions. The chart includes axes with grid lines, a title, and a legend indicating the color mapping for each year.

Jjons288

Avocados Scatter Plot

This scatter plot displays weekly avocado sales, showing the relationship between total volume sold and average price from 2016 to 2018, with each circle colored by year. Data comes from the Hass Avocado Board dataset. The visualization uses D3 v5 with `scaleLinear` for axes, `scaleOrdinal` for color encoding, and `axisBottom`/`axisLeft` for ticks. The SVG rendering includes custom axis labels, a title, and a legend built from the color scale domain.

Jjons288

Data Table Summary

This example shows a plain-text summary of a tabular dataset. It prints the number of rows, columns, and file size in kilobytes, followed by the first ten rows displayed as formatted JSON. The code uses `d3.csv` to load the data, `csvFormat` to compute its size, and `JSON.stringify` to display the preview. Styled with black background and green monospace text, it renders the output into `pre` elements appended to the page body, drawing from the 2013 stock price dataset.

Data Table Summary

A terminal-style black-and-green interface displays a text summary of stock price data. The page prints the total row and column counts, the data size in kilobytes, and the first ten rows as formatted JSON. The example loads a CSV file from a VizHub-hosted dataset using D3 v5's `csv` method, then uses `csvFormat` and `select` to append `pre` elements with the computed statistics.