geekycoder561

@geekycoder561·4 public vizzes

Let's make a face with D3.js

This example shows how to create a stylized face by directly manipulating an SVG element with D3.js. The page sets the SVG’s background to red using `d3.select` and a style method, while the CSS file provides a monospace font for the body. The code uses the D3 v5 library, loaded from a CDN, to select the SVG and apply the background color. No data is loaded; the rendering is purely declarative, relying on the chosen SVG dimensions and the single style assignment. The rest of the face construction is left as a visual exercise.

May 9, 2021

Loading thumbnail…

Fork of HTML Starter

This example displays the static text “Hello HTML” centered on a white page, rendered at an extreme 13em font size. It demonstrates the basic structure of an HTML document that combines embedded CSS for styling and inline JavaScript for browser console output. The page uses a simple `<style>` block to define the body’s text alignment and font size, and a `<script>` tag that calls `console.log()` to print “Hello JavaScript!” to the developer console. No external libraries or data sources are involved.

May 9, 2021

Loading thumbnail…

Fork of D3 Starter

This example demonstrates a minimal D3.js v6 setup, showing a blank SVG canvas with a red background and the text "D3 new" displayed in the page body. It uses `d3.select` and the `svg.style` method to apply styling to the SVG element. The code loads D3 from a CDN and includes both an inline script and an external JavaScript module, though the module only sets body text. The visualization is static, with no data binding or interactive elements, serving as a basic starter template for D3 projects.

May 9, 2021

Loading thumbnail…

Untitled

This example demonstrates the simplest possible D3 version 6 setup, replacing the page’s body text with the string “Hello D3 version 6.” It shows how to import the `select` function from the `d3` package and chain its `.text()` method to update the DOM. The accompanying README links to a video tutorial and serves as an entry point for learning the v6 API. The code uses no data sources or complex rendering, focusing solely on the basic module import and a single selection operation.

May 9, 2021