Cycloid
The cycloid through the origin, generated by a circle of radius r rolling over the $x$-axis on the positive side ($y \geq 0$), consists of the points $(x, y)$ with
\[
\begin{aligned}
x&=r(t-\sin t)\\
y&=r(1-\cos t).
\end{aligned}
\]
Web references:
// Define the id of your board in BOARDID
const board = JXG.JSXGraph.initBoard(BOARDID, {
boundingbox: [-5, 5, 7, -5],
axis: true
});
var r = board.create('slider', [[0.5, 4], [3.5, 4], [0, 1, 2]], {name: 'r'});
var c = board.create('curve', [
(t) => r.Value() * (t - Math.sin(t)),
(t) => r.Value() * (1 - Math.cos(t)),
-4 * Math.PI, 4* Math.PI
], {
strokeWidth: 3
});
This example is licensed under a Creative Commons Attribution 4.0 International License.
Please note that you have to mention The Center of Mobile Learning with Digital Technology in the credits.