Conic sections in polar form
Have also a look at "Ellipse: pin and string method".
Conic sections can also be defined as curves in polar form. The equation of the curve is
$$
r = p_1−\varepsilon\cdot \cos(\varphi + \rho)
$$
The actual curve term is displayed in an HTML span using [ES6 template literals](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals).
Web references:
Curve term:
Curve term: <span id="output"></span>// Define the id of your board in BOARDID
const board = JXG.JSXGraph.initBoard(BOARDID, {
axis: true,
boundingbox: [-12, 10, 12, -10]
});
var p = board.create('slider', [
[2, 8],
[6, 8],
[0, 3, 6]
], {
name: 'p'
});
var eps = board.create('slider', [
[2, 7],
[6, 7],
[-6, 0.5, 6]
], {
name: 'ε'
});
var len = board.create('slider', [
[2, 6],
[6, 6],
[0, 3, 6]
], {
name: 'len'
});
var rho = board.create('slider', [
[2, 5],
[6, 5],
[0, 0, 2 * Math.PI]
], {
name: 'ρ'
});
var f = board.create('curve',
[function(phi) {
return p.Value() / (1 - eps.Value() * Math.cos(phi + rho.Value()));
},
[1, 0], 0,
function() {
return len.Value() * Math.PI
}
], {
curveType: 'polar',
strokewidth: 2,
strokeColor: '#CA7291'
}
);
// Show tangent:
var q = board.create('glider', [f], {
style: 6,
name: 'G'
});
board.create('tangent', [q], {
dash: 3
});
// Show the curve term
board.on('update', function() {
var _p = (p.Value()).toFixed(1),
_eps = (eps.Value()).toFixed(1),
_rho = (rho.Value()).toFixed(1);
document.getElementById('output').innerHTML = `r = ${_p} / (1 - (${_eps})*cos(φ+${_rho})`;
});
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.