Shriram Bhosle

@sb43·3 public vizzes

Cars Report

This example shows a minimal React-based data report that reads a hardcoded array of car objects and displays the make of the second car in large text on the page. The data is embedded as a JSON string in both `cars.js` and `index.js`, then parsed with `JSON.parse` and accessed via array indexing. The rendered message is set by directly manipulating the `textContent` of a `<pre>` element with `document.getElementById`, using plain DOM APIs rather than React’s rendering lifecycle. The page structure is static HTML, with the JavaScript bundled and injected via the `bundle.js` script.

Apr 9, 2021

Loading thumbnail…

Cars Report

This example displays the third car’s make from a hardcoded JSON array by rendering the text “ford” inside a large, centered `<pre>` element. It imports a parsed JSON object (`cars2`) from a separate module and uses JavaScript’s `textContent` property to update the DOM. The code relies solely on the native `JSON.parse` method and direct DOM manipulation, without using D3 or other charting libraries despite the D3 v6 introduction in the README.

Apr 9, 2021

Loading thumbnail…

Cars Report

This example displays the make of the first car in a small static dataset, rendering the text into a large `<pre>` element. The code imports car data from a JSON string parsed into an array in `cars.js`, then uses plain DOM manipulation via `document.getElementById` to update the page content. Built with React, it relies on a bundled JavaScript output and a simple HTML shell, with no interactive charts or visual encoding beyond the displayed label.

Jan 8, 2020