Sumukh Kumble

@skumble27·5 public vizzes

Hair Metal Conclusion

This interactive scatterplot charts hair length and album count against Billboard hits for 1980s hair metal bands, with pink circles representing each band. Clicking the x-axis labels switches the independent variable between hair length and number of albums, triggering a smooth transition of the axis and circles via d3 transitions. The visualization uses d3.csv to load the data, d3.scaleLinear for both axes, d3.axisBottom for the x-axis, and d3-tip for hover tooltips that display the band’s age and the selected metric.

Dec 22, 2020

Loading thumbnail…

HTML Starter

This example demonstrates a minimal webpage that displays the text “Hello World” styled with large, centered typography. It serves as a bare-bones HTML starter template, using an inline CSS rule to set the font size and alignment, while JavaScript handles DOM selection and text insertion. The page loads the d3.v6 library from a CDN and uses `d3.select()` to target the body element. Additional console logging shows basic script execution in browser developer tools.

Dec 22, 2020

Loading thumbnail…

HTML Starter

A bare-bones HTML page serves as a minimal template for web development, displaying the text “Hello HTML” centered in the browser. It uses inline CSS to set the body’s font size and text alignment, and an embedded JavaScript script that logs “Hello JavaScript!” to the Chrome developer console. The example demonstrates the fundamental structure of an HTML document with a style block and script tag, providing a starting point for adding custom styling and interactivity without any external libraries.

Dec 22, 2020

Loading thumbnail…

HTML Starter

This example displays the text “Hello D3 world” in the center of a plain HTML page, using an extremely large font size. It demonstrates a minimal setup for integrating D3.js with HTML and CSS, where the D3 library is loaded via a CDN, and a separate JavaScript file uses `d3.select` to set the text content of the body element. The rendering is purely text-based with no data visualization.

Dec 22, 2020

Loading thumbnail…

Hello World

This example displays the text “Hello World” centered on a plain white page with a 13em font size. It demonstrates the minimal structure of an HTML document that combines CSS for styling and inline JavaScript for interactivity. The page loads D3.js v6 and invites users to open the browser’s developer tools to observe any console output, though no active computation or data binding occurs. The code relies solely on basic DOM elements and a script tag to include the D3 library.

Dec 22, 2020