phoenixash065@gmail.com

@mesOzz11·4 public vizzes

For class

This example demonstrates simple JavaScript function definitions and invocations, displaying results in separate HTML paragraphs. It shows both standard function declarations and function expressions assigned to variables, each performing multiplication. A third function, `mycalc`, sums two numbers but is never called. The page uses plain HTML elements with IDs (`demo1`, `demo2`, `demo3`) and a CSS class for large, centered text, with all logic handled in an external `learn.js` file without any external libraries.

May 14, 2024

Loading thumbnail…

Fork of Bar chart

This chart shows the top 15 coffee-exporting countries by metric tons, with Brazil leading the list. The horizontal bar chart uses `d3.scaleBand` for the categorical country axis and `d3.scaleLinear` for the numerical export volume axis. Data loaded from a remote CSV is sorted in descending order and filtered to the top 15 entries. Named `d3.axisBottom` and `d3.axisLeft` add the axes, while SVG rectangles render the bars with the y-axis label rotated for readability.

Apr 29, 2024

Loading thumbnail…

Fork circles

This example demonstrates a scatterplot of circles rendered as SVG elements using the D3.js library. The visualization decouples data from rendering logic by defining circle objects with x, y, radius, and fill properties, then binding them to SVG circles through D3's method chaining and data join pattern. The code uses the `select`, `selectAll`, and `attr` functions from D3 to create the visualization.

Apr 29, 2024

Loading thumbnail…

Fork of HTML Starter

This example displays a simple static composition of two concentric circles rendered in blue and green on an SVG canvas. It demonstrates the foundational structure of an HTML page using inline SVG elements, with the circle positions and radii hard-coded in the markup. The visualization relies on native SVG circle tags and CSS styling, with no JavaScript libraries or data binding involved. It serves as a minimal starting point for building more complex React-based visualizations, as noted in the accompanying README.

Apr 29, 2024