Project Report

100%

Project Report

✓ Published0🌍 Public

Last edited Nov 23, 2018

Created on Aug 26, 2018

This example renders a text-based project report from JSON data about project activities. It uses JavaScript promises and DOM manipulation to load the data and display a filtered list of activities with durations of 80 days or less. The code filters activities, formats each one with its ID, name, duration, and critical status, then inserts the result into an HTML page styled with Ubuntu font. The visualization demonstrates a simple data-processing pipeline using standard JavaScript APIs rather than specialized visualization libraries.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Activities

This example demonstrates how to generate a text-based activity report from a JSON dataset. It loads a list of activities, filters them by price, and formats each entry into a readable string. The page initially shows “Loading...” and then displays the report after a simulated two-second delay. The code uses a JavaScript Promise in `getActivity` to retrieve the data, array methods `filter` and `map` to process it, and template literals for formatting. The final output is rendered in a `<pre>` element.

SSandraPicarra

75% match

Loading thumbnail…

Project and Activity List

This example displays a plain-text summary of a tabular dataset about real projects. It loads two TSV files, `projects.tsv` and `activities.tsv`, using D3’s `tsv` function, then renders a report to the page via `select('body')`. The report shows the number of rows, columns, and size in kilobytes for each table, followed by a JSON-formatted preview of the first ten rows. The console output is styled with a black background and green monospace text.

RRubens

75% match

Loading thumbnail…

Cars Report

This example demonstrates a text-based report generated from a small in-memory dataset of cars, filtering and formatting entries based on price. It shows how JavaScript modules and promises structure asynchronous data loading and report generation. The page initially displays “Loading…” and then uses `getCars()` with a simulated delay to fetch parsed JSON data, followed by `generateReport()` and `formatCar` to create formatted lines. D3 v6 is included but not used, while the core logic relies on native array methods like `filter`, `map`, and `join`. The final output appears as a large custom-styled `<pre>` element.

IImmaculata-Mary Muoghalu

69% match

Loading thumbnail…

Cars Report

This example displays a simple text report of cars, showing each vehicle's year, make, model, and price. It loads a static JSON dataset with a simulated delay, then filters and formats the results into a list. The code uses a JavaScript Promise for asynchronous data retrieval, an ES6 module for data formatting, and the DOM API to update the page's content directly. No external visualization libraries are used; the output is plain text presented in a large font.

Yyoghurtx

69% match

Loading thumbnail…

Cars Report

This example demonstrates a JavaScript data-processing pipeline that filters a hardcoded JSON array of car objects by price and formats the results into a text report. It shows asynchronous loading with a Promise, array filtering and mapping, and module imports/exports. The code uses `JSON.parse`, `setTimeout` within a Promise, and template literals to construct strings. The rendered output is displayed in an HTML `<pre>` element, with a loading message shown initially before the report appears.

Aanuj1450

69% match

Loading thumbnail…

Car Report

This example displays a text-based car report, listing vehicles under a specified price threshold after a simulated two-second loading delay. It demonstrates asynchronous data handling by fetching an embedded JSON array through a `Promise` with `setTimeout`, then filtering and formatting entries using `Array.filter`, `Array.map`, and `Array.join`. The D3.js `select` API updates the text content of a `<pre>` element, first with a loading message and then with the generated report. Styling relies on a custom CSS file with a Google Fonts import, while no visual charts or scales are used.

Ddsku2276

68% match

Loading thumbnail…

HTML_Playground

This example displays a vehicle report generated from a static JSON dataset. It demonstrates asynchronous data fetching and report generation within an HTML page. The code uses JavaScript's `Promise` and `setTimeout` to simulate a two-second loading delay. The `getCars` module parses the JSON, while `generateReport` filters and formats the car entries into text lines, which are then injected into the preformatted element of the page via `document.getElementById`. The visualization is purely text-based, showing the data without any graphical charts.

Ttanvirmahdad

67% match

Loading thumbnail…

HTML Activities Report

This example presents a static HTML activities report, listing seven numbered project items (A1 through A7) alongside their associated progress counts. It highlights three items—A1, A2, and A3—as critical by applying a red CSS class. The rendering uses plain HTML with an unordered list, styled by an external stylesheet (`styles.css`) that sets a monospace font at 2em, while the `.highlighted` class colors critical entries red. No JavaScript or interactive libraries are involved; the visualization relies solely on semantic markup and CSS for its visual hierarchy.

RRubens

67% match