Skip to main content
SimilarExport ZIP
100%

rao

✓ Published0🌍 Public
RRakshithaRao27
Last edited Feb 27, 2022
Created on Feb 27, 2022

This visualization displays a title "CAR AND ITS ORIGIN!" and a static SVG car illustration, alongside a text summary of a car dataset. The page uses D3.js version 7 to fetch a CSV file from a GitHub gist, then calculates and displays the data's size in kilobytes, the number of rows, and the number of columns. The SVG image, loaded from an external URL, is composed of various paths and circles that form the car's shape. The code also defines custom CSS styles for the heading and the pre-formatted message container.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

rao

This example demonstrates how to load and parse a CSV dataset using D3. It displays a message showing the file size in kilobytes, the number of rows, and the number of columns from the car1.csv file hosted on GitHub. The visualization uses d3.csv to fetch the data and d3.csvFormat to calculate the raw data size. The page also includes a static SVG image as a decorative element.

RRakshithaRao27
86% match
Loading thumbnail…

Car2

This example displays a dataset of cars and their origin information, presenting the data size in kilobytes, row count, and column count as text on a webpage. The visualization uses D3.js version 7 to load a CSV file from a GitHub gist via the `d3.csv` method. The page is built with HTML and includes styling for the header and message container. The code also references an SVG illustration of a car, though it is not actively rendered by the JavaScript.

RRakshithaRao27
81% match
Loading thumbnail…

Fork of HTML Starter

This example shows a static SVG car graphic alongside a text-based dataset summary. The visualization displays a blue car with white windows and black wheels, while the adjacent summary reports the CSV file’s size, row count, and column count. The code uses D3.js v7’s `csvParse` method and the Fetch API to load and parse the external CSV dataset. Rendering is done via inline SVG elements like `rect` and `circle`, with styling handled through CSS.

Ssriram.official9@gmail.com
77% match
Loading thumbnail…

Car Data

This example displays a car listing with the year, make, model, and price in South African rand, rendered as a large text element in an SVG-based page. The visualization loads data from a CSV file containing country population figures, though the primary car data is formatted via a custom `carFormat` function. The code uses D3 v4's `select` and `csv` methods to read data, while a separate `svgMan.js` module also selects the SVG element. The page includes a 1000x500 SVG canvas with minimal styling, and the project follows a React-based structure with a bundled script.

DDante L. Lentsoe
76% match
Loading thumbnail…

rao

This example displays a scatter plot of the Iris dataset, mapping petal length and petal width while coloring points by species using a custom marker function. It renders as an SVG via React and D3 v6, using `d3.csv` to load data, `scaleLinear` and `extent` for axes, and `axisLeft`/`axisBottom` for tick marks. The code also appends rotated axis labels and sets circle radii, with point colors assigned per species.

RRakshithaRao27
76% match
Loading thumbnail…

rao

This visualization displays electronic sales data over time, plotting total sales against years as a single black line on a skyblue background. The chart uses D3 v5 APIs, including `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line`, to render an SVG with labeled axes and gridlines. Data is loaded from a CSV file via `csv()`, with dates parsed using `d3.timeParse`.

RRakshithaRao27
75% match
Loading thumbnail…

Cars Report

This example displays a static SVG scene containing a red circle and a blue rectangle, rendered on an HTML page. It loads a small dataset of car records from a JSON string defined in `cars.js` and uses React to parse and access the data. The core logic in `index.js` imports the parsed car array and sets the text content of a nonexistent element with the ID `message-element` to the first car’s make, though the page’s HTML does not include that element. The visualization itself is purely declarative SVG markup, with no interactive or data-driven rendering.

VVineel Gannu
75% match
Loading thumbnail…

ICE-5 Data visualization

This visualization displays a static SVG image of race cars alongside a summary of race data loaded from a remote CSV file. The page uses D3 v7’s `d3.csv` to fetch the dataset, then calculates and reports the file size in kilobytes, the number of rows, and the number of columns, displaying these metrics in a styled `<pre>` element. The SVG is embedded directly via an `<img>` tag, while the data source is linked externally. The interface is minimal, with large colored headings and a red message container.

RRahulChaitu999
75% match