Skip to main content
SimilarExport ZIP
100%

Dataviz 2018 Assignment Graphics

✓ Published2🌍 Public
MMukund Khandelwal
Last edited Nov 6, 2018
Created on Sep 10, 2018
Forked from HTML Cars Report

A grid of blue rectangular bars replicates the graphics from a Dataviz 2018 assignment using plain SVG rect elements. The visualization shows a series of short horizontal bars arranged in rows and columns, with one bar in the third column enlarged to a taller block, all enclosed by a grey rectangular border. The rendering relies on static SVG shapes defined in index.html, with no JavaScript or D3 data binding. CSS is limited to hiding the page margin and setting unused stroke styles, so the graphic is purely markup-driven rather than computed from data.

AI-generated description

Dataviz 2018 Assignment Graphics recreated using shapes with SVG and CSS notebook.

MIT Licensed

Similar vizzes

Loading thumbnail…

Dataviz 2018 Assignment Graphics

A grid of blue rectangular bars replicates the graphics from a Dataviz 2018 assignment using plain SVG rect elements. The visualization shows a series of short horizontal bars arranged in rows and columns, with one bar in the third column enlarged to a taller block, all enclosed by a grey rectangular border. The rendering relies on static SVG shapes defined in index.html, with no JavaScript or D3 data binding. CSS is limited to hiding the page margin and setting unused stroke styles, so the graphic is purely markup-driven rather than computed from data.

MMukund Khandelwal
100% match
Loading thumbnail…

Dataviz 2018 Assignment Graphics

A grid of blue rectangular bars replicates the graphics from a Dataviz 2018 assignment using plain SVG rect elements. The visualization shows a series of short horizontal bars arranged in rows and columns, with one bar in the third column enlarged to a taller block, all enclosed by a grey rectangular border. The rendering relies on static SVG shapes defined in index.html, with no JavaScript or D3 data binding. CSS is limited to hiding the page margin and setting unused stroke styles, so the graphic is purely markup-driven rather than computed from data.

MMukund Khandelwal
100% match
Loading thumbnail…

Dataviz 2018 Assignment Graphics

A grid of small blue rectangles is arranged in seven rows and three columns inside a grey rectangular frame, with one rectangle overwritten in the third row. The layout is generated programmatically using nested JavaScript loops that create SVG `rect` elements via `document.createElementNS` and append them to an SVG element with the `xmlns` namespace. Pure SVG and CSS render the shapes, with no external visualization library.

MMukund Khandelwal
90% match
Loading thumbnail…

Dataviz 2018 Assignment Graphics

A grid of small blue rectangles is generated and drawn into an SVG canvas. The page loads an HTML document that defines a 5000 by 3000 pixel SVG element and uses a JavaScript loop to create each rectangle, setting its position, size, and fill color programmatically via the SVG namespace. The rectangles are arranged in rows and columns, creating a simple, repeating pattern. The visualization relies entirely on the SVG `rect` element and JavaScript DOM manipulation, with no external charting library, and includes a CSS stylesheet for general page styling.

MMukund Khandelwal
90% match
Loading thumbnail…

Dataviz 2018 Assignment Graphics

This example demonstrates a simple grid of blue squares rendered inside an SVG element. The visualization begins with a single static rectangle defined in the markup, then uses the D3.js `select` and `attr` APIs to programmatically append a looping series of additional rectangles, creating a dense 50-pixel grid pattern across the canvas. The underlying data is generated algorithmically rather than sourced from a dataset. The final result is an abstract, low-level exercise in shape composition, with the SVG output styled by a minimal external CSS file.

MMukund Khandelwal
88% match
Loading thumbnail…

Dataviz 2018 Assignment Graphics

A grid of small blue rectangles is arranged in repeating rows and columns across an SVG canvas, creating a simple patterned composition. The visualization is built entirely with raw JavaScript and SVG manipulation, using `document.createElementNS` logic through a loop to generate each rectangle with fixed dimensions and fill color. The code references `svgOne` as the target SVG element and applies styles from an external CSS file, though the primary rendering relies on inline attributes set via the script. The example demonstrates basic shape generation without any data binding or interaction, serving as a static graphic recreation.

MMukund Khandelwal
87% match
Loading thumbnail…

Dataviz 2018 Assignment Graphics

A collection of geometric shapes and lines, arranged in a dense, grid-like composition, recreates the graphics of a Dataviz 2018 assignment. The example uses only SVG and CSS, with a single `<rect>` element duplicated in a loop and a `fill` color applied. A CSS class, `.lines`, defines stroke properties for paths, though no specific JavaScript libraries are referenced in the visible code. The embedded YouTube video suggests the work may be a video-based assignment, while the SVG rendering is scaled and positioned within an HTML page.

MMukund Khandelwal
84% match
Loading thumbnail…

Exercise2: Pseudo Visualization

Four horizontal bars, colored orange, red, green, and blue, with varying widths, sit on a white background, each outlined in black. The visualization uses basic Scalable Vector Graphics (SVG) primitives—`rect` elements defined directly in the HTML—to create a static, pseudo-chart that mimics a stacked bar layout. No JavaScript libraries or data-binding frameworks are present; the rendering is purely declarative, with positions and dimensions hard-coded in the markup and styling provided by a simple external stylesheet.

Nnubhatia
76% match