Miha Tomšič

@MihaTomsic·4 public vizzes

Untitled

This example displays a static SVG scene containing a rotated green rectangle and a red circle, positioned inside a group that is translated and rotated relative to the canvas. The SVG is embedded directly in an HTML page and uses the D3.js v4 library, loaded via a script tag. Rendered with SVG, the graphics are defined declaratively, with the group transform applying rotation and translation to both shapes.

Sep 15, 2023

Loading thumbnail…

Hello D3 v7

This example demonstrates the simplest possible D3 v7 setup: it displays the text “Hello D3 version 7” and “Hello D3 version 7.8” in the browser using the `select` API from the D3 library (loaded via `https://unpkg.com/d3@7.8.5/dist/d3.min.js`). The rendering approach is purely DOM-based; the code selects the `body` and `div` elements and assigns the greeting strings as text content. No data source or visualization is involved, serving solely as a minimal introduction to working with D3’s selection and text manipulation methods.

Sep 6, 2023

Loading thumbnail…

Osnove SVG

This example demonstrates basic SVG shapes by rendering circles, rectangles, lines, and paths directly in an HTML document. The code uses inline SVG elements—`<circle>`, `<rect>`, `<line>`, and `<path>`—with explicit attributes for position, size, and color. A red circle, a purple bordered rectangle, a thick green line, and a blue triangular path are drawn on a 500×500 canvas. Styling is applied via presentation attributes like `fill`, `stroke`, and `stroke-width`. The visualization introduces core SVG syntax without any JavaScript libraries or external data sources, relying purely on static markup.

Sep 5, 2023

Loading thumbnail…

HTML Starter

A bare minimum HTML page demonstrates a styled text message using pure CSS and JavaScript, with no external libraries. The page renders a single div element containing the phrase “Yellow, Ouch Tee Emm Ell!” in large, centered type, styled via a CSS class that sets font size and alignment. The example serves as a minimal template for web-based visualization projects, showing how to structure HTML, CSS, and JavaScript in a single file. It provides a simple starting point for developers building interactive visualizations without a framework.

Sep 5, 2023