Skip to main content
SimilarExport ZIP
100%

Dataviz 2018 Assignment Graphics

✓ Published0🌍 Public
MMukund Khandelwal
Last edited Sep 11, 2018
Created on Sep 11, 2018

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.

AI-generated description

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

Code fragments used from stackoverflow

MIT Licensed

Similar vizzes

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
94% 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
92% 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
91% 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
90% 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
90% 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
90% 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
85% match
Loading thumbnail…

grids

This visualization displays a grid-based layout with multiple colored panels, including a header bar, a slider-controlled range display, and a large SVG canvas. The interface uses Bootstrap’s grid system for responsive column and row structuring, while d3.v5 handles SVG sizing and element selection. A slider appears to adjust a numeric value shown in the adjacent label, with the main chart area left empty. The page uses a fixed full-viewport layout with distinct color-coded sections for headers, controls, and content areas.

AAnimesh Nautiyal
72% match