jcruchaga

@jcruchaga·3 public vizzes

Dibujando una cara con d3.js

A yellow smiley face drawn with SVG circles, rectangles, and a path arcs its eyebrows upward and back down in a looping animation. The face is centered via a transformed group, with eyes positioned symmetrically and a mouth created using the d3.arc generator. Eyebrow movement uses d3's transition method with a two-second duration, while the empty d3.csv data file remains unused. The example demonstrates fundamental D3 v5 DOM manipulation and SVG rendering.

Jul 29, 2020

Loading thumbnail…

Aprendiendo html

This example shows a simple SVG scene titled “Aprendiendo SVG,” combining a circle, rectangle, and path within a translated group. It demonstrates basic SVG shapes and attributes like `fill`, `stroke`, and `stroke-width` directly in the markup. The HTML file links an external stylesheet (`estilos.css`) that sets page margins and heading typography. Rendering relies on inline SVG inside a 600×600 viewport, with no JavaScript libraries or data sources involved.

Jul 29, 2020

Loading thumbnail…

Aprendiendo

This example displays the text "Hola Mundo!" in an enormous, full-viewport font size of 13em, demonstrating a minimal React-free HTML setup. The page renders static, unstyled content directly in the browser using plain HTML and CSS, with an external JavaScript file (`index.js`) linked but showing no visible behavior. It serves as a bare-bones starting point for building interactive visualizations, relying on React as the underlying framework for future development. The code uses vanilla DOM elements and CSS styling without any data sources or rendering libraries.

Jul 29, 2020