sirmelpalot

@sirmelpalot·3 public vizzes

Scatter Plot with Menus

This interactive scatter plot displays automobile data from the UCI Machine Learning Repository’s Auto MPG dataset. Users select which columns to plot on the X and Y axes via dropdown menus, which re-render the visualization’s axes and circles accordingly. Built with D3 v5, the code uses `scaleLinear`, `axisLeft`, `axisBottom`, and a custom `dropdownMenu` module. Points animate into position over two seconds with staggered delays, and the SVG rendering includes axis labels, tick marks, and semi-transparent red circles.

Mar 3, 2020

Loading thumbnail…

I have One Brathole

A yellow circle with blue outline dominates a lavender SVG canvas, forming a cartoon face with two black eyes and two small nostrils. The example demonstrates fundamental D3 v5 SVG rendering by appending basic shapes like `circle` elements to an `<svg>` container. It also attempts to add an `arc` element with radius and angle attributes, though this API is not native to D3 or SVG. The code uses d3-selection’s `select` and `append` methods to build static shapes with fixed coordinates and styles, showing basic attribute manipulation for simple geometric illustrations.

Feb 27, 2020

Loading thumbnail…

React Starter

This example demonstrates a simple React application that renders the text "Hello React!" centered on the page in large type. The index.html file loads React and ReactDOM from unpkg CDNs, while index.js defines an App component that outputs a div with the message class. ReactDOM.render mounts this component into the root div, and the styling in index.html sets the font size and alignment for the displayed message.

Feb 27, 2020