Thiago Carvalho

@thiago092·3 public vizzes

Line Plot with menu

This line plot displays price trends over time for multiple commodities, with a dropdown menu allowing users to select which price column to visualize. The chart uses an SVG rendered with D3 v5, employing scales, axes, and a line generator with basis curve interpolation. Data is loaded as CSV from a remote URL, parsed with date and numeric formatting, and rendered through reusable dropdownMenu and scatterPlot modules. The dropdown menu dynamically updates the y-axis based on user selection.

Oct 9, 2020

Loading thumbnail…

Scatter Plot with Menus

This interactive scatter plot visualizes the Auto MPG dataset from the UCI Machine Learning Repository, displaying car attributes such as horsepower, weight, and acceleration. Two dropdown menus let users select which columns map to the X and Y axes, with the plot transitioning smoothly when selections change. Built with D3 v5, the visualization uses d3.csv for data loading, d3.scaleLinear and d3.axisBottom/Left for scales and axes, and d3.transition for animated circle repositioning. Red semi-transparent circles render in SVG, with axis labels updating to reflect the chosen variables.

Oct 9, 2020

Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for cars from the Auto MPG dataset sourced from the UCI Machine Learning Repository. Red semi-transparent circles represent each car, revealing the positive correlation between the two variables. The visualization uses d3.csv to load data, d3.scaleLinear for both axes, and d3.axisLeft and d3.axisBottom with grid lines to structure the plot. Custom text elements label the axes and title, while SVG rendering displays all marks within a clearly defined margin.

Oct 8, 2020