Skip to main content
SimilarExport ZIP
100%

Blank Canvas

✓ Published1🌍 Public
HHanyang
Last edited Jul 10, 2019
Created on Jul 10, 2019
Forked from Make a face!

A blank SVG canvas fills the browser window, defined by a single rounded rectangle that matches the viewport dimensions. The page appears as an empty, frameless space with no data or interaction, emphasizing the starting point for a visualization. The code uses D3 v5’s `select` and `arc` imports, though only `select` renders the static shape. The SVG size adapts to the document body’s client height and width, while CSS fixes the body and hides overflow, ensuring the canvas remains fully visible without scrollbars.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Blank Canvas

This visualization displays a blank, rounded rectangle that fills the entire browser window. The SVG canvas is sized to match the viewport dimensions, and a single rectangle with a 40-pixel corner radius is appended to it. The code uses D3 v5’s `select` and `arc` imports, though only `select` is applied, while the styling relies on a fixed-position body with no margins or overflow. No data is loaded or rendered, leaving the canvas intentionally empty.

Mmla341
95% match
Loading thumbnail…

Blank Canvas

A blank SVG canvas fills the browser window, framed by a single rounded rectangle. The example demonstrates a minimal setup for web-based visualization, using D3 v6 to select the SVG element and set its dimensions based on the viewport. The code imports `select` and `arc` from D3, though only `select` is used to append the background shape. Styling is handled externally via CSS, which fixes the body and hides overflow to ensure the canvas remains visually clean and uncluttered.

MMatthew Rubino
95% match
Loading thumbnail…

Blank Canvas

A blank canvas fills the browser window, rendered as a single rounded rectangle using D3 v5's `select` and SVG `attr` methods. The visualization displays no data, only an empty, fixed-position SVG that adapts to the viewport's dimensions. The code imports `select` and `arc` from D3, though only `select` is used to create the static shape. The HTML loads `styles.css` for full-bleed layout and `bundle.js` to execute the drawing logic.

LLiu2021311512
94% match
Loading thumbnail…

Blank Canvas

A blank SVG canvas fills the browser viewport, displaying nothing but a single rounded rectangle that matches the window's dimensions. The visualization demonstrates the foundational setup of a D3 project by importing the `d3` library and appending a basic shape element. Using `d3.select` on an empty SVG, it dynamically sets the width and height attributes based on the document's client dimensions, then adds a `rect` with a 40-pixel corner radius. The code relies on D3 v5 and a bundled JavaScript file, with CSS positioning the body to cover the entire viewport.

AAndreas Loew
94% match
Loading thumbnail…

Blank Canvas

An empty SVG canvas fills the browser window, displaying only a rounded rectangle that spans the full viewport. The example demonstrates the minimal setup required to render a blank visualization surface. The code uses D3 v5's `select` and `arc` imports to create an SVG container, then appends a `<rect>` element with its width and height set to the document body's client dimensions. The CSS fixes the body to prevent scrolling, ensuring the canvas remains static.

Jjblaskovich
94% match
Loading thumbnail…

Blank Canvas

A blank, rounded-rectangle canvas fills the entire browser viewport, with its width and height set to the document’s client dimensions. The example demonstrates a minimal SVG setup using D3 v5, where the `select` and `arc` functions are imported but only `select` is used to append a single styled `<rect>`. The visualization shows no data or interaction, serving purely as an empty starting point. It relies on the D3 selection API and SVG attributes, with CSS fixed positioning to prevent page scrolling.

Nntds12
94% match
Loading thumbnail…

Blank Canvas

A blank SVG canvas fills the browser viewport. The visualization draws a single rounded rectangle that covers the entire display area, using the body’s client dimensions for sizing. The code imports `select` from the D3 library (version 5.9.2) and applies `.attr` and `.append` methods to create the SVG rectangle, with no data or additional marks rendered.

MMunTatt Yap
94% 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
93% match