animateMotion-values-paced-1-ref.svg

Enable keyboard shortcuts

Checkerboard

<svg xmlns="http://www.w3.org/2000/svg">

  <!-- First row -->

  <g transform="translate(20,20)">

<g>

      <rect width="15px" height="15px"/>

    </g>

    <g transform="translate(50,0)">

      <rect x="0" y="10" width="15px" height="15px"/>

    </g>

    <g transform="translate(100,0)">

      <rect x="12" y="10" width="15px" height="15px"/>

    </g>

  </g>

  <!-- Second row -->

  <g transform="translate(20,70)">

<g>

      <rect x="30" y="10" width="15px" height="15px"/>

    </g>

    <g transform="translate(50,0)">

      <rect x="35.76" y="17.68" width="15px" height="15px"/>

    </g>

    <g transform="translate(100,0)">

      <rect x="48" y="34"  width="15px" height="15px"/>

    </g>

  </g>

  <!-- Third row -->

  <g transform="translate(20,120)">

<g>

      <rect x="50.4" y="37.2" width="15px" height="15px"/>

    </g>

    <g transform="translate(50,0)">

      <rect x="60" y="50" width="15px" height="15px"/>

    </g>

    <g transform="translate(100,0)">

      <rect x="60" y="50" width="15px" height="15px"/>

    </g>

  </g>

</svg>