Chocolate Molecule

SVG circles, radial gradients, geometry, transforms

Chocolate Molecule

Objective: Draw a complicated molecule using SVG with atoms place in precise locations, radial gradients on the atoms, several different colors, and an artistic flair.

Problem: How can we calculate the vertices for the pentagon and the hexagon so they can share one side?

Solution: We can use a web site that calculates the polygon vertices. We can use SVG translate, scale, and rotate transforms to move the atoms into precise locations, using trial and error.