How to rotate and land a rocket in SVG?

Question

SVG

<!-- <?xml version="1.0"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1000" height="1000">

<rect x="0" y="0" height="1000" width="1000" fill="#add8e6"/>

<!--Der Mond -->
<image width="100" height="100" x="450" y="450" xlink:href="mond.png" />
   
<!--Umlaufbahn-->
<circle cx="500" cy="500" r="110" fill="transparent" stroke="black" stroke-width="1" stroke-dasharray="10 8" />
<circle cx="500" cy="500" r="160" fill="transparent" stroke="black" stroke-width="1" stroke-dasharray="10 8" />
<circle cx="500" cy="500" r="280" fill="transparent" stroke="black" stroke-width="1" stroke-dasharray="10 8" />

<!--Drei Planeten-->
<g transform="translate(500,500)">

<g transform="translate">
<circle cx="0" cy="110" r="20" fill="green"/>
<animateTransform attributeName="transform" dur="10s" type="rotate" values="0;360" repeatCount="indefinite" />
</g>

<g transform="translate">
<circle cx="0" cy="160" r="10" fill="blue"/>
<animateTransform attributeName="transform" dur="15s" type="rotate" values="0;360" repeatCount="indefinite" />
</g>
<g transform="translate">
<circle cx="0" cy="280" r="30" fill="red"/>
<animateTransform attributeName="transform" dur="25s" type="rotate" values="0;360" repeatCount="indefinite" />
</g>
</g>


<path d="M475,-50 450,500 "
      stroke="black" stroke-width="2"
      fill="black" />


<g transform="rotate(180)">
<image xlink:href="raumschiff.svg"  width="150" height="300"  />
<animateMotion  dur="3s"  repeatCount="indefinite" path="M475,-50 450,480 A450,480" fill="transparent" />
</g>
</svg>

Hello everyone,
please tell me how can I deploy a rocket and land it on the moon? I can't figure out how to do this successfully in SVG.

Answer 1

Draw an animation that rotates the rocket and lands it on the moon, I guess.
Try to use not naked svg, but some program for creating animations.