knguyengithub

@knguyengithub·14 public vizzes

Fork of HTML Cars Report

This example displays a single car make, “Honda,” in large monospace text on a plain HTML page. It demonstrates a minimal data visualization workflow by parsing a hardcoded JSON array of car records from cars.js using `JSON.parse` and accessing the first object’s `make` property. The value is inserted into a `<pre>` element via `document.getElementById` and `textContent`, with styling controlled by external CSS. No charting library or advanced rendering is used; the visualization is purely DOM-based text output.

Sep 17, 2021

Loading thumbnail…

cars Report

This example shows a simple cars report listing three vehicles with their prices, with the first item highlighted in red. The page is built with basic HTML and CSS, using an unordered list to display the data. The CSS file styles the body with a large monospace font and applies a `.highlighted` class to change the text color of the specified list item. No external libraries or JavaScript are used; the visualization relies solely on static markup and styling to present the information.

Sep 17, 2021

Loading thumbnail…

Fork of HTML Cars Report

This example displays a simple car sales report as a bulleted list of vehicle names, model years, and prices, with one item highlighted in red. The visualization uses basic HTML unordered list elements and CSS styling—setting a monospace 3em font for the body and applying a `.highlighted` class to emphasize a specific listing. The code relies on plain HTML and a linked external stylesheet, with no JavaScript libraries or data-processing frameworks involved. The car data is hardcoded directly into the page markup rather than loaded from an external source.

Sep 17, 2021

Loading thumbnail…

Cars report

This example displays the make of the first car from a small, hard-coded JavaScript dataset of five vehicles. It renders the text "Honda" in large type within a preformatted HTML element. The code imports the car array from `cars.js` and parses a separate JSON string using `JSON.parse`. It then uses vanilla JavaScript and the DOM API `getElementById` to set the `textContent` of the message element on the page.

Sep 17, 2021

Loading thumbnail…

Fork of Cars report

This example displays the make of the first car in a static dataset, rendering “Honda” as large text on a plain HTML page. It imports car data from a separate `cars.js` module, which contains a hardcoded JSON array of five vehicles with year, make, model, and price fields. The `index.js` file parses this JSON using `JSON.parse` and updates the DOM by setting the `textContent` of a `<pre>` element with `id="message-element"`, styled via inline CSS. The visualization uses no charting library, relying solely on React-like modular imports and vanilla JavaScript.

Sep 17, 2021

Loading thumbnail…

Cars report

This example displays a car report by parsing a hardcoded JSON array of vehicle data and outputting the make of the first entry. The visualization is a minimal HTML page that uses JavaScript’s `JSON.parse` to convert the data structure, then sets the text content of a `<pre>` element via `document.getElementById`. The page is built with React, though the core rendering relies on standard DOM manipulation. The data source is an inline JSON string containing five cars with year, make, model, and price fields.

Sep 17, 2021

Loading thumbnail…

Fork of Fork of Fork of car report

This example displays the text “ken” in a large, centered format on a plain HTML page. It relies on a static dataset of car listings defined as a JSON string in `cars.js`, which is parsed and imported as a module. The page’s rendering is driven by React, using the `index.js` script to set the text content of an element via the DOM API. The visual output is minimal, showing only the message text without any data-driven charts or graphics.

Sep 17, 2021

Loading thumbnail…

Fork of Fork of car report

This example displays a hardcoded message, “ken,” on a bare HTML page styled with CSS. The React-based project imports car data from `cars.js` as JSON, but the visible interface relies on vanilla JavaScript to update the `#message-element` with text content. The code uses `document.getElementById` to manipulate the DOM directly. The data source includes used car records with year, make, model, and price, though no visualization or chart renders it in the current implementation. The page primarily demonstrates minimal HTML, CSS, and JavaScript integration.

Sep 17, 2021

Loading thumbnail…

Fork of car report

This is a minimal web page that displays the text "ken" in large type, rendered from a hard-coded JavaScript string. The page uses a simple CSS layout to center the message on a blank canvas, with the text size set to 13em. The core functionality relies on the DOM API `document.getElementById` to access the message element and update its `textContent`. The included `cars.js` file defines a small dataset of car records, but that data is not used in the displayed output. The page is built as a JavaScript application without any external visualization or charting libraries.

Sep 17, 2021

Loading thumbnail…

car report

This example displays the make of the first car in a dataset, rendering the text "Honda" in a large, centered format on an HTML page. The visualization is a minimal hard-coded report built with React, using JavaScript to parse a JSON array of car records. The page uses basic CSS for styling and a JavaScript script to update a pre element’s content, with the data stored in a separate `cars` module.

Sep 17, 2021

Loading thumbnail…

Fork of car report

This example displays the make of the first car in a hard-coded dataset, rendering “Honda” as large text centered on the page. A JavaScript array of car objects is stored in a separate module and imported into the main script, which then updates the text content of an HTML element via `document.getElementById`. The page uses plain CSS for centering and font sizing, with no external visualization libraries or interactive features beyond the static output.

Sep 17, 2021

Loading thumbnail…

Fork of Fork of React Starter test

This example renders the message “Hello React!” centered in large text using React and ReactDOM. The App component returns a div with the class “message,” which is styled with a 13em font size. React 16.13.1 production builds are loaded from unpkg, and the component is mounted into the root element via `ReactDOM.render`. The visualization simply demonstrates a minimal React setup with no data or interactive behavior.

Sep 14, 2021

Loading thumbnail…

Fork of React Starter

A minimal React starter example renders the text "Hello React!" in large, centered type. The app uses React and ReactDOM to define a functional component and mount it to a DOM node via `ReactDOM.render`. The UI is styled with a CSS class, and the bundle is loaded from separate HTML and JavaScript files. No data or visualization logic is present beyond this static display.

Sep 14, 2021

Loading thumbnail…

Cars Report

This example demonstrates a minimal "Cars Report" page that displays the text "Hello Ken" in large, centered type on a plain white background. It shows a single static HTML element styled entirely through inline CSS, with no interactive or dynamic visualization. The code uses a basic `<script>` tag to log "Hello JavaScript!" to the browser’s developer console, and the page structure is plain HTML with no external libraries or frameworks. The data source is absent, and the rendering approach relies solely on default browser text layout.

Sep 14, 2021