ICE-7 Line chart SKM

Fork of ICE-7 Area chart SKM

This area chart displays the top 40 Test cricket players by total runs, drawn as a single steelblue path over a categorical x-axis of player names and a linear y-axis of runs. The code loads data from a CSV via `d3.csv`, sorts and slices the dataset, then uses `d3.scaleBand` and `d3.scaleLinear` with `d3.area` to generate the SVG path. Rotated x-axis labels and an SVG text element for the y-axis title accompany the chart, all rendered client-side in D3 v7.

89% match

ICE-7 Line Chart

This example shows a line chart depicting cricket run data over time, with the y-axis representing runs and the x-axis representing players. The chart uses a red gradient stroke for the line and includes labeled axes for clarity. The visualization is built with D3 v6, using `scaleTime`, `scaleLinear`, `axisBottom`, and `axisLeft` to construct the scales and axes, while a `line` generator with `curveBasis` smooths the data path. Data is loaded from a CSV file via `csv()`, and the SVG rendering is styled with CSS classes.

LLG0498

ICE_6

This example displays the top 10 all-time leading run-scorers in cricket as a horizontal bar chart. The SVG visualization uses D3 v5 with `d3.scaleLinear` and `d3.scaleBand` to map runs and player names, while `d3.axisLeft` and `d3.axisBottom` render the axes. Data comes from a CSV file loaded via `d3.csv`, with run values parsed as numbers. Each player’s total runs are shown as orange bars, with a titled chart and formatted tick labels using `d3.format`.

Vvineeth-001

ICE-7 Pie chart SKM

A pie chart displays the number of test cricket players per country from a CSV dataset, using rounded labels for player counts and a legend with color-coded entries. The chart is rendered with D3 v5, using `d3.pie` and `d3.arc` to generate the slices and `d3.scaleOrdinal` for colors. Data is fetched asynchronously via `d3.csv` and aggregated client-side by country. Labels are positioned using the arc centroid, and the SVG output includes a fixed set of ten distinct section colors.

ICE-7 Line chart-Srinivas

This line chart displays the number of runs Sachin Tendulkar scored each year, using a blue line plotted over an SVG canvas. The x-axis represents years, scaled with d3.scaleTime, while the y-axis shows runs, scaled with d3.scaleLinear. Data is loaded asynchronously from a CSV file using d3.csv. Axes are generated with d3.axisBottom and d3.axisLeft, and the line path is constructed with d3.line. The chart includes labeled axes and grid lines rendered via tick marks.

Ssrinivasaraosankula

ICE-7 Scatter plot

This example visualizes Test Cricket player statistics with a scatter plot that maps runs against batting averages, animating through different data fields every three seconds to explore relationships between metrics like strike rate and innings played. The visualization uses D3.js version 6.7.0, employing the `scaleLinear` and `scaleOrdinal` functions for positioning and color encoding, while SVG symbols represent player types. Data from a CSV file hosted on GitHub Gist is loaded asynchronously, with circles colored by country and shaped by player role. The reusable chart module implements a configurable API, cycling through four quantitative fields on the x-axis.

78% match

ICE-6 Marks and Channels

This visualization presents two charts examining Test cricket records. The bar chart displays the top 10 players by number of centuries scored, using horizontal bars colored with d3.scaleOrdinal and d3.schemeCategory10. The scatter plot below explores the correlation between matches played and runs scored, though the scatter plot code is incomplete. Both charts load data from a CSV file containing Test cricket statistics, using D3.js v7 to render SVG elements with axes for the quantitative comparisons.

77% match

ICE-5 M sai krishna

This visualization presents a summary of Test cricket batting records for 83 top batsmen over the last 25 years, displayed with a cricket-themed SVG showing a red ball on a green field. The page uses D3.js v7 to load a CSV file from a GitHub Gist, calculating and displaying the file size in kilobytes and bytes, row count, and column count in a text container. The embedded SVG replicates the ball design from the separate ball.svg file, while custom CSS styles the page with green headings and white background.