custom chart v2.3

custom chart v2.2

This chart displays cricket batting data, mapping each player’s innings as a horizontal bar positioned by their first ball faced and height by runs scored before them. The SVG rendering uses d3.scaleLinear for both axes, d3.axisLeft and d3.axisBottom for scales, and d3.csv to load the dataset. Rectangles encode innings length, runs, and cumulative runs, with axis ticks showing balls faced.

custom chart v2.0

This custom chart visualizes cricket batting performance, showing each player’s innings as a horizontal bar positioned along the ball count, with bar height representing runs scored and vertical offset reflecting cumulative team runs before that batsman. The SVG rendering uses d3.scaleLinear for both axes, d3.csv for data loading, and d3.select to bind CSV data to rectangles. The chart encodes individual innings length, start ball, and runs in a single coordinated view.

custom chart v2.0

A custom SVG chart visualizes cricket batting performance across an innings, with each batsman represented by a horizontal bar positioned by their first ball faced and sized by innings length and runs scored. The bars stack vertically based on cumulative runs before each batsman, showing their contribution relative to the team total. The visualization uses d3.csv to load the data, d3.scaleLinear for both x and y positioning, and SVG rectangles appended via d3.selectAll and data joins, with the axis scales hardcoded to a 300-ball innings.

custom chart v2.1

This example visualizes a cricket batting innings by mapping each batsman’s performance as a rectangular block. The chart shows the number of runs scored (rectangle height) against the sequence of balls faced, with each player’s block positioned according to their first ball and cumulative team runs. Using d3.csv, d3.scaleLinear, and SVG rectangles, the code computes scales from the parsed data to render the custom chart. The visualization relies on data.csv containing batting statistics and displays the progression of individual contributions across the innings.

playing with json

This visualization displays cricket batting data from a T20 match, showing each batsman’s innings as a horizontal bar spanning from their first to last ball faced. The bar’s height and color encode runs scored before dismissal and strike rate, respectively, using a sequential color scale. Circles mark the final ball of each innings, while text labels annotate standout performances. The chart is rendered as SVG using D3 v5, with data parsed from CSV and scales built via `d3.scaleLinear` and `d3.scaleSequential`, axes via `d3.axisLeft` and `d3.axisBottom`, and color interpolation from `d3.interpolateRdYlGn`.

80% match

area chart

This area chart visualizes the runs scored by a cricket team each year from 2007 to 2021. The SVG render uses D3 v5’s `scaleTime` and `scaleLinear` to map years and run totals, with `d3.area` and `d3.line` generators drawing the filled region and its boundary using a basis curve. CSV data is loaded via `d3.csv`, and axes are styled with custom tick formatting and labels. The chart highlights overall scoring trends over the 15-year period.

RRupeshGandham

76% match

Fork of Reusable D3 Scatter Plot

This fork of a reusable D3 chart animates cycles through four columns of a cricket dataset, plotting balls, match, age, and score against the x-axis while score remains on the y-axis. Using the `scaleLinear` API for axes and `selection.join` for idempotent circle updates, the scatter plot updates every two seconds via `setInterval`, re-computing domains from the new data extent. It renders as an SVG with large Share Tech font labels, drawing from a CSV loaded with `d3.csv`.

Ccharanchand9

76% match

worm v0.1

This visualization displays a worm-like chart of cricket ball-by-ball data, with each rectangle representing a delivery from a bowler. The x-axis maps the ball number within an innings, while the y-axis shows runs scored, and the height of each rectangle encodes the runs scored on that delivery. It uses d3's `select`, `csv`, `scaleLinear`, and `sum` functions, along with the `nest` and `rollup` API to aggregate batting metrics by striker. The data is loaded from a CSV file, and the SVG output is rendered via d3.v5.