Fork of Bonus ICE Scatter plot using D3.js

Fork of Bonus ICE Scatter plot using D3.js

This 3D scatter plot visualizes COVID-19 data across countries, showing two traces: one plotting cured cases against dead cases, and another plotting active cases against dead cases. The visualization uses Plotly’s `scatter3d` type within `Plotly.newPlot`, with D3.js handling CSV data loading via `d3.csv` and the `unpack` function to extract columns. Data originates from a GitHub-hosted CSV file containing per-country case counts, rendered as colored markers with configurable opacity and line styling in a minimal HTML page.

Pprathyusha-reddy-arch

87% match

Fork of Fork of ICE-7 : Reusable Scatter Plot

This example visualizes COVID-19 data by plotting countries against death counts using a reusable scatter plot. It employs D3 v6 to load CSV data, scale axes with `scaleLinear`, and render marks via `symbol` and `symbols` for varied point shapes. The chart’s axes are generated with `axisLeft` and `axisBottom`, while margins and dimensions are configured through a custom `scatterPlot` function. The visualization is built with SVG, and the `d3.csv` module fetches the dataset from a remote URL. The code demonstrates a modular pattern where the plot function accepts configurable accessors for x, y, and symbol values, making it reusable.

80% match

Fork of ICE-7 : Reusable Scatter Plot

This scatter plot visualizes COVID-19 total cases against total deaths, with each country represented by a symbol scaled according to a 100-pixel size. The visualization uses D3 v7’s `scaleLinear`, `scaleOrdinal`, `symbol`, and `axisLeft`/`axisBottom` APIs to render SVG marks and axes. Data loads from a GitHub-hosted CSV via `d3.csv`, with margins and dimensions set dynamically to the window size. The reusable `scatterPlot` function exposes configuration methods for data, value accessors, and dimensions.

80% match

Fork of ICE-7 : Reusable Scatter Plot

This visualization uses D3 to render a reusable scatter plot of COVID-19 data, plotting each country’s population against itself while encoding the dataset’s SkinThickness column through symbol shapes. The chart displays axes for both variables, with points positioned using `scaleLinear` and `extent` for domains. The code relies on `d3.scaleOrdinal` to map symbol types and `d3.symbol` to generate the path data, while `axisLeft` and `axisBottom` add the scales. Data is loaded as CSV via `d3.csv`, and the plot is rendered as SVG with a custom margin and size configuration.

Fork of Fork of Bonus ICE Scatter plot using D3.js

This example shows two 3D scatter plots of agricultural data, comparing crop production and district names against crop year, season, and area. The visualization uses Plotly's `scatter3d` traces rendered inside a `myDiv` container, with data loaded from a CSV file via D3.js’s `d3.csv`. Each trace maps distinct dataset columns to the x, y, and z axes, using marker size, color, and opacity to differentiate the points. The code relies on Plotly’s `newPlot` API to render the interactive chart.

Vvryvarma5577@gmail.com

Fork of Fork of Bonus ICE Scatter plot using D3.js

Vvryvarma5577@gmail.com

ICE 7 Reusable D3 Scatter Plot

This example presents a reusable scatter plot of COVID-19 data, mapping countries along the x-axis and death counts along the y-axis. It utilizes the D3.js library (v7) within an SVG rendering context, demonstrating a modular component pattern via the `scatterPlot()` function. The main script asynchronously loads a CSV dataset using `d3.csv`, parses death values as numbers, and then invokes the chart with configurable accessors, margins, and point size. The visualization adapts to the full browser window by setting its width and height from `window.innerWidth` and `window.innerHeight`.

Fork of Scatter Plot

This scatter plot visualizes heart disease data from the UCI Machine Learning Repository, allowing users to explore correlations between numeric attributes like age, cholesterol, and blood pressure. Dropdown menus let viewers select which columns map to the X and Y axes. The visualization is built using D3 v5, with `scaleLinear` for scaling axes, `axisLeft` and `axisBottom` for gridlines, and animated circle transitions via `transition().duration(2000)` with staggered delays. SVG rendering displays semi-transparent red circles, while axis labels and tick marks are styled through CSS.

AAshtone Onyango