svg圆动画

<svg width="540" height="540">
      <circle cx="270" cy="270" r="240" stroke-width="30px" stroke="rgb(11,72,133)" fill="none" stroke-dasharray="109 5" opacity="0.2">
        <animateTransform attributeName="transform" repeatCount="indefinite" type="rotate" from="0 270 270" to="360 270 270" dur="80" />
      </circle>
      <circle cx="270" cy="270" r="215" stroke-width="3px" stroke="#1e548c" fill="none" stroke-dasharray="3 19">
        <animateTransform attributeName="transform" repeatCount="indefinite" type="rotate" from="0 270 270" to="-360 270 270" dur="60" />
      </circle>
      <circle cx="270" cy="270" r="185" stroke-width="40px" stroke="#0a3460" fill="none" stroke-dasharray="4 8">
        <animateTransform attributeName="transform" repeatCount="indefinite" type="rotate" from="0 270 270" to="360 270 270" dur="60" />
      </circle>
      <circle cx="270" cy="270" r="145" stroke-width="10px" stroke="#154b82" fill="none" stroke-dasharray="60 10">
        <animateTransform attributeName="transform" repeatCount="indefinite" type="rotate" from="0 270 270" to="-360 270 270" dur="20" />
      </circle>
      <circle cx="270" cy="270" r="100" stroke-width="60px" stroke="#0e3b69" fill="none" stroke-dasharray="2 51">
        <animateTransform attributeName="transform" repeatCount="indefinite" type="rotate" from="0 270 270" to="-360 270 270" dur="25" />
      </circle>
      <circle cx="270" cy="270" r="70" stroke-width="20px" stroke="#1a69bb" fill="none" stroke-dasharray="70 10">
        <animate attributeName="r" repeatCount="indefinite" attributeType="XML" from="70" to="80" dur="1" />
        <animate attributeName="stroke-dasharray" repeatCount="indefinite" from="70 10" to="80 20" dur="1" />
      </circle>
    </svg>