Skip to main content
Log in
C

Charvi Jain

@Charvijain16·10 public vizzes

Loading thumbnail…

Scatter Plot: Cars

This scatter plot displays the relationship between retail price and horsepower for a dataset of cars, with each circle representing a vehicle. The visualization uses SVG rendering with D3 v5, employing the `scaleLinear`, `axisLeft`, `axisBottom`, and `extent` APIs to map the data to pixel coordinates. The car data is loaded from a CSV file, and the axes include custom labels and tick formatting. The plot highlights the distribution of cars based on these two numeric attributes.

Nov 6, 2019
Loading thumbnail…

Scatter Plot: Cars

This scatter plot displays the relationship between retail price and horsepower for a dataset of cars, with each circle representing a vehicle. The visualization uses SVG rendering with D3 v5, employing the `scaleLinear`, `axisLeft`, `axisBottom`, and `extent` APIs to map the data to pixel coordinates. The car data is loaded from a CSV file, and the axes include custom labels and tick formatting. The plot highlights the distribution of cars based on these two numeric attributes.

Nov 6, 2019
Loading thumbnail…

Scatter Plot: Cars

This scatter plot displays the relationship between retail price and horsepower for a dataset of cars, with each circle representing a vehicle. The visualization uses SVG rendering with D3 v5, employing the `scaleLinear`, `axisLeft`, `axisBottom`, and `extent` APIs to map the data to pixel coordinates. The car data is loaded from a CSV file, and the axes include custom labels and tick formatting. The plot highlights the distribution of cars based on these two numeric attributes.

Nov 6, 2019
Loading thumbnail…

Logan Airport Weather vs Delay

This interactive visualization combines a scatter plot and a radial ring chart to explore the relationship between weather conditions and flight delays at Logan Airport. The scatter plot maps wind speed against departure delay, with circle size representing delay magnitude and color indicating precipitation levels. The ring chart displays the same data over time, with radial bars colored red for bad weather or blue for normal conditions. Users can hover over points in either view to highlight corresponding elements in the other view, using D3 v5’s selection and event handling. The data is loaded from a CSV file and rendered as SVG.

Nov 6, 2019
Loading thumbnail…

Bivariate Cars Scatter Plot

This D3.js v5 scatter plot visualizes the relationship between horsepower and retail price for a dataset of cars from the UCI Machine Learning Repository. The visualization encodes car brand as color using a categorical color scale with ordinal categories, and engine size as circle area through a square-root scale, with legends for both encodings. The chart renders as an SVG with axis labels, gridlines, and a title, using d3.scaleLinear for axes and d3.scaleOrdinal for color mapping.

Nov 6, 2019
Loading thumbnail…

Bivariate Cars Scatter Plot

This scatter plot displays the relationship between a car’s horsepower and its retail price, with each vehicle represented by a semi-transparent red circle. Built with D3 v5, the visualization uses the `scaleLinear` API to map the data domain to pixel coordinates for both axes, and `axisLeft` and `axisBottom` to render the chart’s grid lines and tick labels. The data comes from the UCI Machine Learning Repository's Auto MPG dataset. The code employs `csv` to load the data, converts numeric fields with the unary plus operator, and appends circles to an SVG canvas.

Nov 6, 2019
Loading thumbnail…

Bivariate Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for a dataset of cars from the UCI Machine Learning Repository. Red semi-transparent circles represent individual car models, positioned along linear scales computed with `d3.scaleLinear`. The axes are rendered using `d3.axisBottom` and `d3.axisLeft`, with labels and a title added as SVG text elements. Data is loaded asynchronously via `d3.csv`, with numeric fields coerced before rendering. The visualization uses D3 v5 and outputs to an SVG canvas.

Nov 5, 2019
Loading thumbnail…

Cars1 Scatter Plot

This scatter plot displays the relationship between horsepower and retail price for a collection of cars, with each vehicle represented as a red, semi-transparent circle. The visualization uses D3 v5 to construct an SVG chart, employing `d3.scaleLinear` for both axes and `d3.axisLeft`/`d3.axisBottom` for tick marks and gridlines. It pulls data from the UCI Machine Learning Repository's Auto MPG dataset, which is loaded via `d3.csv` and processed before rendering. Axis labels and a title are added as text elements within the SVG.

Nov 5, 2019
Loading thumbnail…

Scatter Plot with Menus

This scatter plot visualizes the Auto MPG dataset from the UCI Machine Learning Repository, displaying car attributes as red, semi-transparent circles. Users select which columns map to the X and Y axes via dropdown menus, built with a reusable `dropdownMenu` D3 module. The visualization uses d3.csv for data loading, d3.scaleLinear for axis scaling, and d3.axisBottom/axisLeft for gridlines, with animated circle transitions via d3.transition. Each axis label updates to reflect the selected column, and the plot re-renders on user interaction.

Nov 5, 2019
Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for a dataset of cars from the UCI Machine Learning Repository’s Auto MPG dataset. Each red, semi-transparent circle represents a car, with its position determined by the d3.scaleLinear functions for the x- and y-axes. The visualization uses d3.csv to load and parse the remote data, then renders the plot as SVG elements via d3’s axisBottom, axisLeft, and circle selections. Axis labels and a title are added as SVG text, with d3.format available for tick formatting.

Nov 5, 2019