飞机曲线动画

167 阅读1分钟

飞机曲线动画

        <g id="plane">
          {/* <image
            href={require('./home/plane.png')}
            width="385"
            x="0"
            y="0"
          /> */}
          <polygon
            class="fil1"
            points="-141,-10 199,0 -198,-72 -188,-61 -171,-57 -184,-57 "
          />
          <polygon class="fil2" points="199,0 -141,-10 -163,63 -123,9 " />
          <polygon
            class="fil3"
            points="-95,39 -113,32 -123,9 -163,63 -105,53 -108,45 -87,48 -90,45 -103,41 -94,41 "
          />
          <path
            class="fil4"
            d="M-87 48l-21 -3 3 8 19 -4 -1 -1zm-26 -16l18 7 -2 -1 32 -7 -29 1 11 -4 -24 -1 -16 -18 10 23zm10 9l13 4 -4 -4 -9 0z"
          />
          <polygon
            class="fil1"
            points="-83,28 -94,32 -65,31 -97,38 -86,49 -67,70 199,0 -123,9 -107,27 "
          />
        </g>
        <animateMotion
          href="#plane"
          dur="10s"
          repeatCount="1"
          rotate="auto"
        >
          <mpath href="#planePath" />
        </animateMotion>
      </svg>