d3.js - Draw Complicated Shapes in D3 -


i trying draw irregular, petal shape d3 animation, cannot find understandable documentation odd shapes in svg-format. how might go creating such shape? rose-petal shape

it's this:

<svg> <path fill="#ffffff" stroke="#000000" stroke-miterlimit="10" d="m21,34.328c21,15.693,32.477,0.515,50.124,0.515     c67.77,0.515,79,16.928,79,34.328c0,17.399-29,65.157-29,65.157s21,52.962,21,34.328z"/> </svg> 

and use definition (defs) future reference. here

and here: is possible import svg shapes in d3.js?

if want hand, here's paths tutorial: https://developer.mozilla.org/en-us/docs/web/svg/tutorial/paths

here codepen