Skip to main content
SimilarExport ZIP
100%

Cars Report

✓ Published0🌍 Public
RRashmi000
Last edited Sep 16, 2019
Created on Sep 16, 2019
Forked from Hello VizHub

This example displays the make of the first car from a hardcoded JSON dataset containing three vehicles. It retrieves `cars[0].make` and writes the result into a large HTML element using the DOM API `document.getElementById`. The app imports the parsed JSON from the `cars.js` module and relies on ES6 module syntax. Styling uses a dark background with the Ubuntu font from Google Fonts, and the page runs as a bundled script in `index.html`.

AI-generated description

An example showing the capabilities of VizHub.

MIT Licensed

Similar vizzes

Loading thumbnail…

Cars Report

This example displays the make of the first car from a hardcoded JSON dataset, rendered as large text on a page. It shows how to import and parse data from an ES6 module (`cars.js`) and update the DOM via `document.getElementById` and `textContent`. The styling uses Google Fonts' Ubuntu and a dark blue background via CSS. No external visualization library is used; the example relies solely on core JavaScript and the browser's DOM API.

RRashmi000
94% match
Loading thumbnail…

Cars Report

This example displays the make of the first car in a small, hardcoded JSON dataset. The code defines an array of car objects in `cars.js`, parses it with `JSON.parse`, and then uses DOM manipulation via `document.getElementById` to insert that value into a `<pre>` element. The page uses an external Google Fonts stylesheet and a dark blue, centered text layout, with the displayed message rendered at a very large font size.

PPrasad Saodekar
90% match
Loading thumbnail…

car Report

This example displays the make of the first car from a hardcoded JSON dataset, rendered as large text on a dark, styled web page. The application imports the `cars` array from a local ES6 module and uses JavaScript's DOM `getElementById` method to inject the string into a `<pre>` element. It relies on the D3.js library for data handling, while the visual styling, including a custom font and centered layout, is defined using CSS with an imported Ubuntu typeface.

Mmkdeeps01
90% match
Loading thumbnail…

car Report

This example displays the make of the first car from a hardcoded JSON dataset, rendered as large text on a dark, styled web page. The application imports the `cars` array from a local ES6 module and uses JavaScript's DOM `getElementById` method to inject the string into a `<pre>` element. It relies on the D3.js library for data handling, while the visual styling, including a custom font and centered layout, is defined using CSS with an imported Ubuntu typeface.

Mmkdeeps01
90% match
Loading thumbnail…

Cars Report

The Cars Report displays the make of the first car in a small inline dataset, rendered as large text on a dark blue page. The example uses a plain JavaScript array of car objects defined in `cars.js` and parsed with `JSON.pars` (a typo for `JSON.parse`). Index.js accesses `cars[0].make` and updates the DOM via `document.getElementById("message-element").textContent`. Styling relies on the Ubuntu font from Google Fonts and a CSS background color, with no external visualization libraries.

Sselina-rudolph
90% match
Loading thumbnail…

Cars Report

Cars Report displays the make of the first car in a hardcoded JSON dataset by rendering it as large text in the browser. The example demonstrates a minimal D3 version 6 setup, importing car data from a separate `cars.js` module and using `JSON.parse` and `JSON.stringify` to handle the data. The `index.js` file accesses the `make` property and writes it to a DOM element via `textContent`, while `index.html` provides the page structure and loads the bundled script.

DDaniel Walder
90% match
Loading thumbnail…

Cars Report

This example displays the make of the first car in a hardcoded JSON dataset, rendering it as large, styled text on a dark background. It loads an array of five car objects from `cars.js`, parses the JSON, and uses vanilla JavaScript to set the text content of a `<pre>` element via `document.getElementById`. The page’s styling comes from CSS, including the Ubuntu font, a navy background, and centered, 12em font size. No external visualization libraries are used; the focus is on a minimal DOM update.

Iimregan
90% match
Loading thumbnail…

Cars Report

This example demonstrates a minimal data-visualization gallery piece where the page displays the make of the first car from a hardcoded JSON array, showing "Honda" prominently. The code parses an embedded JSON string via `JSON.parse` into a `cars` array, exports it as an ES6 module, and imports it into `index.js` to update a `<pre>` element’s text content. The styling uses a Google Fonts import (`Ubuntu`) with CSS for a dark background and large centered text.

RRashmi000
90% match