SVG inconsistencia patrón entre Chrome y Firefox

Question

I tiene un gradiente de superposición de un color sólido (rojo) especificado como un patrón:

<svg width="480" height="480"> 
    <defs> 

     <pattern width="1" height="1" x="0" y="0" id="pattern"> 
      <rect width="240" height="240" x="0" y="0" fill="rgba(255,0,0,1)"/> 
      <rect width="240" height="240" x="0" y="0" fill="url(#gradient)"/> 
     </pattern> 

     <linearGradient id="gradient" x1="0" y1="1" x2="0" y2="0"> 
      <stop offset="0%" stop-color="rgb(0,0,0)" stop-opacity="1"/> 
      <stop offset="100%" stop-color="rgb(0,0,0)" stop-opacity="0"/> 
     </linearGradient> 

    </defs> 
    <path 
     transform="matrix(1,0,0,1,200,200)" 
     d="M0 0M 120 0 A 120 120 0 0 0 -120 0 A 120 120 0 0 0 120 0" 
     fill="url(#pattern)" 
    /> 
</svg> 

Izquierda: Firefox. Derecha: Cromo

El de la derecha (Chrome) es correcta.

¿Alguien sabe cómo hacer que esto funcione en Firefox?

verlo en directo: http://jsbin.com/eyenoh/edit#html,live

Answer 1

yo era capaz de conseguir que funcione mediante el objeto cuadro delimitador como sistema de coordenadas para el contenido patrón.

<pattern width="1" height="1" x="0" y="0" id="pattern" patternContentUnits="objectBoundingBox"> 
    <rect width="1" height="1" x="0" y="0" fill="rgba(255,0,0,1)"/> 
    <rect width="1" height="1" x="0" y="0" fill="url(#gradient)"/> 
</pattern> 

lo ve aquí: http://jsbin.com/efesev/edit#html,live

Voy a tratar de investigar más a fondo. Parece un buen candidato para un informe de error.