Animated Basketball

SVG and JavaScript. Class of 2015–2016.

Objective: Create a basketball in SVG code with realistic animation.

Problems: We need to clip the lines on the basketball. We want to make the basketball look like it is rolling smoothly.

Solutions: Clipping paths. Use the relationship between the diameter and the circumference (π) to calculate the amount of rotation needed for each bump in location.