How to move an SVG element to a desired point on a line on click?

Question

JavaScript

Faced such task. Make a wavy dotted line with several dots under which the dates will be indicated and draw a boat. When you click on one of the dates, the ship should smoothly "sail" along the line to this point and stop, when you click on another date, it sails to it, etc.
My prototype on CodePen:
codepen.io/AlexFox18/pen/LxgYaP?editors=1010
I can't figure out how to write a compact JS handler using SVG path to keep the effect of "floating" the ship moving to any of the points from any position.
Who can faced similar?
Thank you all in advance.