SVG - círculo de escala desde el centro

Question

Quiero escalar mi arco que está incrustado en svg. Mientras aplica la transformación de escala, se escala hacia 0, 0. En lugar de eso, quiero que se escale al centro de la suya.

Este es el código

<g>     
    <path d="M 300 100 a 200 200 0 1 0 0.00001 0" fill="#7EEC4A" stroke="rgb(208,231,235)" linejoin="round" stroke-width="1" fill-opacity="0.9" stroke-opacity="0.2"> 
    </path> 

    <animateTransform attributeType="xml" 
     attributeName="transform" 
     type="scale" 
     from="0" 
     to="1" 
     dur="0.5s" fill="freeze" /> 
</g> 

Answer 1

No

del todo satisfactorios, porque he sido incapaz de dejar sin cambio su forma original, pero el efecto requiere pedirá otra parece bien:

<g transform="translate(300,250)"> 
     <g> 
      <path d="M 0 -150 a 200 200 0 1 0 0.00001 0" fill="#7EEC4A" 
       stroke="rgb(208,231,235)" linejoin="round" stroke-width="1" fill-opacity="0.9" 
       stroke-opacity="0.2"> 
      </path> 
      <animateTransform attributeType="xml" 
       attributeName="transform" 
       type="scale" 
       from="0" 
       to="1" 
       dur="0.5s" fill="freeze" /> 
     </g> 
    </g> 

Puede intentar this violín

Answer 2

Usando el elemento <circle> y animación de la "r" atributo:

<g>     
    <circle cx="200" cy="200" r="200" fill="#7EEC4A" stroke="rgb(208,231,235)" linejoin="round" stroke-width="1" fill-opacity="0.9" stroke-opacity="0.2"> 
     <animate attributeType="xml" attributeName="r" from="0" to="200" dur="5s" repeatCount="indefinite" />  
    </circle> 
</g>