kazGuido

@kazGuido·2 public vizzes

Fork of HTML Starter

This example demonstrates basic D3.js chart construction, including SVG creation, linear and logarithmic scales, and band scales for categorical data. It renders rect elements as a bar chart with axis generation using `d3.axisLeft` and `d3.axisBottom`. The code also shows data binding with arrays and JSON objects, plus animated text transitions using `transition().duration()`. Styling includes CSS classes and inline SVG attributes with a yellow background.

Oct 14, 2022

Loading thumbnail…

SVG training

This example demonstrates basic SVG interactivity and styling through pure HTML, CSS, and JavaScript without any external libraries. It shows three black rectangles on an 800x600 canvas, where hovering over a rectangle triggers a CSS transition that gradually changes its fill color to green and expands its dimensions and position over three seconds. The code utilizes CSS pseudo-class `:hover` and the `transition` property, while the first rectangle is wrapped in an anchor tag linking to google.com. The rendering relies entirely on native SVG elements within the HTML document.

Oct 13, 2022