Skip to main content
SimilarExport ZIP
100%

Blank Canvas

✓ Published0🌍 Public
Ddanrhymes
Last edited Dec 1, 2019
Created on Dec 1, 2019

A full-window rounded rectangle rendered as a blank canvas, occupying the entire viewport with soft corners. The visualization uses D3 v5’s selection API to append a single SVG `rect` element, with dimensions bound to the browser’s client width and height via `document.body.clientWidth` and `clientHeight`. The `svg` is sized programmatically, and a CSS rule fixes the body to prevent scrolling, ensuring the rectangle remains the sole visual element. No data or interaction is present, highlighting the minimalist starting point of a blank SVG drawing surface.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Blank Canvas

A full-window, rounded rectangle fills the browser viewport as a blank canvas, rendered as a static SVG shape. The visualization demonstrates a minimalist setup using D3 v5’s `select` to target the SVG element and set its width and height attributes based on the document’s client dimensions. A single `rect` is appended with a large corner radius (`rx` of 40), and CSS fixes the body to eliminate scrolling. No data or interactive behavior is present; the piece simply showcases a clean, borderless visual starting point.

Fforeverworld1879
95% match
Loading thumbnail…

Blank Canvas

A single rounded rectangle fills the entire viewport, rendered in SVG with no data or marks. The visualization uses D3 v5’s `select` to bind the SVG element, then sets its width and height to the browser window’s client dimensions. A `rect` is appended with a 40-pixel corner radius, creating a soft-edged blank canvas. The code relies on `document.body.clientWidth` and `clientHeight` for sizing, with the body fixed and overflow hidden via CSS.

MMatthiasVanCampen
95% match
Loading thumbnail…

Blank Canvas

A blank, rounded-corner rectangle fills the entire browser viewport on a fixed, overflow-hidden page. The visualization is an empty canvas, showing no data or marks, only a single SVG `rect` element with a large corner radius. It uses D3 v5’s `select` API to target the SVG element and set its width and height to the document body’s client dimensions. The rendering is purely SVG, with no axes, labels, or interaction.

NNico Donovan
95% match
Loading thumbnail…

Blank Canvas

A blank, rounded rectangle fills the entire browser viewport, serving as a minimal canvas with no data or marks rendered. The SVG element is dynamically sized to match the window dimensions using the D3v5 `select` API, and a single `rect` is appended with a 40-pixel corner radius. The complete visual result is a simple, frameless field, demonstrating basic SVG construction with D3’s selection and attribute-chaining methods against a fixed-position, full-screen body.

Vvaynexie
95% match
Loading thumbnail…

Blank Canvas

A rounded, full-viewport rectangle fills the browser window, rendered as a single SVG `<rect>` with no data mapped to it. The example demonstrates a minimal blank canvas using D3 v6's `select` and `attr` methods to set the SVG's width and height from the document body's client dimensions. The rectangle's `rx` attribute softens its corners, while CSS fixes the body to prevent scrolling. The visualization shows only this simple geometric form, with no axes, marks, or interaction beyond the static shape.

Ggabcoderboi
95% match
Loading thumbnail…

Blank Canvas

A full-screen SVG canvas displays only a rounded rectangle drawn with D3's `select` and `append`. The rectangle fills the viewport dimensions, which are read from `document.body.clientWidth` and `clientHeight`. The visualization uses a minimal blank state with no explicit data source; the code sets the SVG's width and height attributes and applies a 40-pixel corner radius via `attr('rx', 40)`. No additional interactions or updates occur, leaving a static, empty composition.

Ddanielchamone
95% match
Loading thumbnail…

Blank Canvas

A blank canvas is presented as a full-screen, rounded rectangle rendered in SVG, filling the entire viewport with a clean, empty surface. The visualization uses D3.js v5 via the `select` method to create and size the `rect` element dynamically based on the browser window's dimensions. No data is loaded or displayed, and the code simply sets the SVG's width and height attributes before appending the rectangle. The result is a minimal, static composition that foregrounds the canvas itself as the subject.

MMinwoo Pak
95% match
Loading thumbnail…

Blank Canvas

A blank, rounded rectangle fills the entire browser viewport as a standalone SVG canvas. The visualization demonstrates a minimal setup where no data or marks are present, only a styled background shape. The code uses D3 v5 to select the SVG element, set its width and height to the document body’s client dimensions, and append a single `rect` with a 40-pixel corner radius. No axes, scales, or interactions are defined, making this a static, empty canvas.

WWai Kit Tsang
94% match