Difference between revisions of "Conic sections in polar form"
From JSXGraph Wiki
Jump to navigationJump to searchA WASSERMANN (talk | contribs) |
A WASSERMANN (talk | contribs) |
||
| (5 intermediate revisions by 2 users not shown) | |||
| Line 8: | Line 8: | ||
</html> | </html> | ||
<jsxgraph board="brd" width="600" height="500"> | <jsxgraph board="brd" width="600" height="500"> | ||
| − | var brd = JXG.JSXGraph.initBoard('jxgbox',{axis:true, | + | var brd = JXG.JSXGraph.initBoard('jxgbox',{axis:true,boundingbox: [-12, 10, 12, -10]}); |
var p = brd.create('slider',[[2,8],[6,8],[0,3,6]]); brd.createElement('text',[1,8,'p:']); | var p = brd.create('slider',[[2,8],[6,8],[0,3,6]]); brd.createElement('text',[1,8,'p:']); | ||
var eps = brd.create('slider',[[2,7],[6,7],[-6,0.5,6]]); brd.createElement('text',[1,7,'ε:']); | var eps = brd.create('slider',[[2,7],[6,7],[-6,0.5,6]]); brd.createElement('text',[1,7,'ε:']); | ||
| Line 23: | Line 23: | ||
===The JavaScript code to produce this picture=== | ===The JavaScript code to produce this picture=== | ||
| − | <source lang=" | + | <source lang="javascript"> |
| − | + | var brd = JXG.JSXGraph.initBoard('jxgbox',{axis:true,boundingbox: [-12, 10, 12, -10]}); | |
| − | var brd = JXG.JSXGraph.initBoard('jxgbox',{axis:true, | + | var p = brd.create('slider',[[2,8],[6,8],[0,3,6]]); brd.createElement('text',[1,8,'p:']); |
| − | var p = brd.create'slider',[[2,8],[6,8],[0,3,6]]); brd.createElement('text',[1,8,'p:']); | ||
var eps = brd.create('slider',[[2,7],[6,7],[-6,0.5,6]]); brd.createElement('text',[1,7,'ε:']); | var eps = brd.create('slider',[[2,7],[6,7],[-6,0.5,6]]); brd.createElement('text',[1,7,'ε:']); | ||
var len = brd.create('slider',[[2,6],[6,6],[0,3,6]]); brd.createElement('text',[1,6,'len:']); | var len = brd.create('slider',[[2,6],[6,6],[0,3,6]]); brd.createElement('text',[1,6,'len:']); | ||
| Line 34: | Line 33: | ||
{curveType:'polar', strokewidth:2, strokeColor:'#CA7291'} | {curveType:'polar', strokewidth:2, strokeColor:'#CA7291'} | ||
); | ); | ||
| − | var q = brd. | + | var q = brd.create('glider', [f], {style:6,name:'G'}); |
| − | brd. | + | brd.create('tangent', [q], {dash:3}); |
brd.addHook(function(){document.getElementById('ausgabe').innerHTML = (p.Value()).toFixed(1) + "/(1 - (" + (eps.Value()).toFixed(1) + ")*cos(φ+"+(rho.Value()).toFixed(1) +"))";}); | brd.addHook(function(){document.getElementById('ausgabe').innerHTML = (p.Value()).toFixed(1) + "/(1 - (" + (eps.Value()).toFixed(1) + ")*cos(φ+"+(rho.Value()).toFixed(1) +"))";}); | ||
| − | |||
</source> | </source> | ||
[[Category:Examples]] | [[Category:Examples]] | ||
[[Category:Curves]] | [[Category:Curves]] | ||
Latest revision as of 15:05, 3 March 2021
The equation of the curve is
- [math]\, r = \frac{p}{1-\epsilon\cdot cos(\phi+\rho)};[/math]
The JavaScript code to produce this picture
var brd = JXG.JSXGraph.initBoard('jxgbox',{axis:true,boundingbox: [-12, 10, 12, -10]});
var p = brd.create('slider',[[2,8],[6,8],[0,3,6]]); brd.createElement('text',[1,8,'p:']);
var eps = brd.create('slider',[[2,7],[6,7],[-6,0.5,6]]); brd.createElement('text',[1,7,'ε:']);
var len = brd.create('slider',[[2,6],[6,6],[0,3,6]]); brd.createElement('text',[1,6,'len:']);
var rho = brd.create('slider', [[2,5],[6,5],[0,0,2*Math.PI]]); brd.createElement('text',[1,5,'ρ:']);
var f = brd.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'}
);
var q = brd.create('glider', [f], {style:6,name:'G'});
brd.create('tangent', [q], {dash:3});
brd.addHook(function(){document.getElementById('ausgabe').innerHTML = (p.Value()).toFixed(1) + "/(1 - (" + (eps.Value()).toFixed(1) + ")*cos(φ+"+(rho.Value()).toFixed(1) +"))";});
