Fork of Customizing Axes try

100%

Fork of Customizing Axes try

✓ Published0🌍 Public

Aayonghosh2003

Last edited Jun 4, 2021

Created on May 31, 2021

This visualization displays Derrick Rose's scoring average over time as a gold area chart with red strokes, showing his career points per year. The chart uses a time-based x-axis and linear y-axis, with custom axis labels, grid lines, and a title. The code imports specific D3 v5 modules including `scaleTime`, `scaleLinear`, `area`, and `curveBasis`, and loads data from a CSV file using `csv`. Interactive features include custom tick spacing and rotated axis labels.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Customizing Axes

A bar chart displays student scores from a CSV file, ranking each student on a vertical band scale against a linear grade axis. The visualization customizes axes by removing default domain lines, adding grid lines, and applying a formatting function that converts large numbers to abbreviated labels using D3's `format`. It uses `d3.csv`, `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to render SVG bars with styled ticks and titles.

TtreasurehunterAP

75% match

Loading thumbnail…

Fork of Customizing Axes

This visualization displays the win counts for NCAA college basketball teams using a horizontal bar chart, with team names on the y-axis and game wins on the x-axis. Built with D3 v5, it uses `d3.scaleLinear` for the numeric x-axis and `d3.scaleBand` for categorical team labels. Customized axes include removed domain lines, modified tick styles via CSS, and added axis titles and chart heading. Data is loaded from a CSV file containing team statistics from the 2018 season.

JJadenzzz

74% match

Loading thumbnail…

Fork of Customizing Axes

This visualization displays a stacked bar chart of career-level data, showing the distribution of Standard, Double, and No awards across two career levels. The chart uses a custom color palette with red, blue, and green bars, and demonstrates custom axis configuration with tick labels removed from the bottom axis. The code is built on D3 v4, loading data from a CSV file and using the `csv`, `scaleLinear`, `scaleBand`, `axisLeft`, `axisBottom`, and `stack` APIs to process and render the SVG output.

Vvasanthvasu

74% match

Loading thumbnail…

Customizing Axes

This example shows the decline in rainforest area in square kilometers from 1998 to 2018, using an area chart with a green fill. The chart customizes its axes by rotating the date labels on the x-axis vertically and adding descriptive axis titles for both year and rainforest area. The visualization uses d3.csv to load the data, d3.scaleTime and d3.scaleLinear for scaling, and d3.axisBottom and d3.axisLeft with custom tick sizes to create grid lines. The area path is generated using d3.area with a curveBasis interpolation.

JJake

74% match

Loading thumbnail…

Fork of Fork of Customizing Axes

This example presents an interactive analysis of agent performance metrics from Valorant esports match data, displayed through a bar chart and scatter plot. Users can dynamically change the metric displayed on each chart using dropdown menus. The visualization is built with D3 v7, utilizing `scaleLinear` and `scaleBand` for the bar chart and `scaleLinear` with `extent` for the scatter plot. Data is loaded from a local CSV file and rendered as animated SVG circles and rectangles.

Ddaniel

74% match

Loading thumbnail…

Fork of Area Chart

This fork of an area chart visualizes sales data from 1988 to 2006, combining a smooth line and a brown filled area beneath it to emphasize trends over time. The axes display year and sales values, formatted with `d3.format`. The code uses D3 v5 APIs including `csv` for data loading, `scaleTime` and `scaleLinear` for scales, and `line` alongside `area` generators with `curveBasis` for smoothing. The SVG output is styled with CSS, featuring a yellow background and labeled axes.

Rrohinikotha

73% match

Loading thumbnail…

Fork of Fork of Customizing Axes

This example shows a bar chart of the top ten scores by Indian batsmen, with each bar’s length proportional to the runs scored and the player names on the vertical axis. The chart applies custom axis styling, including labeled tick lines, a rotated axis title, and a formatted tick scale. The visualization uses d3.csv to load data, and d3.scaleLinear, d3.scaleBand, d3.axisLeft, and d3.axisBottom to render the SVG. The axis labels and title are added as SVG text elements, with margins controlling layout.

DDeekshithVemula

73% match

Loading thumbnail…

Fork of Customizing Axes

This visualization presents a comparative analysis of player performance in a gaming context, featuring both a bar chart and an interactive scatter plot. The bar chart displays aggregated performance metrics per agent, while the scatter plot allows users to explore correlations between different statistics like kills, deaths, and assists. Users can dynamically switch which metric is displayed on the bar chart and both axes of the scatter plot via dropdown menus. The visualization is built using D3 version 7, leveraging APIs such as `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft` to render the SVG elements and manage the interactive updates. The data is loaded from CSV files containing player match statistics.

Ddaniel

73% match