Difference between revisions of "Applets:Periodendauer periodischer Signale"
From LNTwww
(Die Seite wurde neu angelegt: „ {{Header |Untermenü= |Vorherige Seite= |Nächste Seite= }} Erklärung. <applet> {{Display}}“) |
|||
| Line 1: | Line 1: | ||
| − | + | ||
| − | + | Erklärung. | |
| − | + | ||
| − | + | <applet> | |
| − | |||
| − | |||
| + | <html> | ||
| + | <head> | ||
| + | <script type="text/javascript" | ||
| + | src="https://cdnjs.cloudflare.com/ajax/libs/jsxgraph/0.99.6/jsxgraphcore.js"></script> | ||
| + | <style> | ||
| + | .button1{ | ||
| + | background-color: black; | ||
| + | border: none; | ||
| + | color: white; | ||
| + | font-family: arial; | ||
| + | padding: 8px 20px; | ||
| + | text-align: center; | ||
| + | text-decoration: none; | ||
| + | display: inline-block; | ||
| + | font-size: 16px; | ||
| + | border-radius: 15px; | ||
| + | position:relative; | ||
| + | top: 105px; | ||
| + | left: 530px; | ||
| + | } | ||
| + | .button1:active { | ||
| + | background-color: #939393;} | ||
| − | + | .hinweis1 { | |
| + | background-color: #f5f5f5; | ||
| + | border-radius: 4px ; | ||
| + | padding: 20px 60px; | ||
| + | font-family: arial; | ||
| + | position:absolute; | ||
| + | top: 159px; | ||
| + | left: 100px; | ||
| + | } | ||
| + | |||
| + | </style> | ||
| + | </head> | ||
| + | <body> | ||
| + | |||
| + | <form id="myForm"> | ||
| + | |||
| + | |||
| + | <h2 class="text" style="color:#939393; font-weight:bold; top:-10px; left:90px; font-family:arial; font-size:1.5em;position:absolute;">Periodendauer <I>T</I><sub>0</sub> periodischer Signale</h2> | ||
| + | |||
| + | <button class="button1" style="font-size:0.750em" onclick="zurueck()">Reset</button> | ||
| + | <p><span class="separate" style="position:absolute; top:123px; left:454px; font-family:arial; font-size:0.750em;">mit Gitter<input name="gridbox" id="gridbox" type="checkbox" onclick="showgrid();" checked="checked"></span></p> | ||
| + | <box class="hinweis1" style="font-size:0.750em"><I>x(t)=A</I><sub>1</sub>·<I>cos(2πf</I><sub>1</sub>·t<I>−</I><I>φ</I><sub>1</sub>)<I>+A</I><sub>2</sub>·<I>cos(2πf</I><sub>2</sub><I>·t−</I><I>φ</I><sub>2</sub>) für <I>t ≥ 0</I> </box> | ||
| + | <div id="box2" class="jxgbox" style="width:500px; height:100px; float:top; margin:-10px 20px 100px 0px;"></div> | ||
| + | <div id="box1" class="jxgbox" style="width:600px; height:600px; border:1px solid black; margin:-10px 20px 100px 0px;"></div> | ||
| + | |||
| + | |||
| + | <script type="text/javascript"> | ||
| + | |||
| + | var brd2 = JXG.JSXGraph.initBoard('box2', {showCopyright:false, showNavigation:false, axis:false, grid:false, zoom:{enabled:false}, pan:{enabled:false}, boundingbox: [-1, 2.2, 12.4, -2.2]}); | ||
| + | var brd1 = JXG.JSXGraph.initBoard('box1', {showCopyright:false, axis:false, grid:false, boundingbox: [-0.9, 2.2, 12.4, -2.2]}); | ||
| + | brd2.addChild(brd1); | ||
| + | |||
| + | xaxis = brd1.create('axis', [[0, 0], [1,0]], {name:'<I>t</I>/ms', withLabel:true, label:{position:'rt', offset:[-25, 15]}}); | ||
| + | yaxis = brd1.create('axis', [[0, 0], [0, 1]], {name:'<I>x(t)</I>/V', withLabel:true, label:{position:'rt', offset:[10, -5]}}); | ||
| + | |||
| + | a = brd2.create('slider',[[-0.7,1.5],[3,1.5],[0,0.5,1]], {suffixlabel:' <I>A</I>_1=', unitLabel: 'V', snapWidth:0.01}), | ||
| + | b = brd2.create('slider',[[-0.7,0.5],[3,0.5],[0,1,10]], {suffixlabel:'<I>f</I>_1=', unitLabel: 'kHz', snapWidth:0.1}), | ||
| + | c = brd2.create('slider',[[-0.7,-0.5],[3,-0.5],[-180,0,180]], {suffixlabel:'<I>φ</I>_1=', unitLabel: 'Grad', snapWidth:1}), | ||
| + | d = brd2.create('slider',[[6,1.5],[9.7,1.5],[0,0.5,1]], {suffixlabel:'<I>A</I>_2=', unitLabel: 'V', snapWidth:0.01}), | ||
| + | e = brd2.create('slider',[[6,0.5],[9.7,0.5],[0,2,10]], {suffixlabel:'<I>f</I>_2=', unitLabel: 'kHz', snapWidth:0.1}), | ||
| + | g = brd2.create('slider',[[6,-0.5],[9.7,-0.5],[-179,90,180]], {suffixlabel:'<I>φ</I>_2=',unitLabel: 'Grad', snapWidth:5}), | ||
| + | t = brd2.create('slider',[[-0.7,-1.5],[3,-1.5],[0,0,10]], {suffixlabel:'<I>t</I>=', unitLabel: 'ms',snapWidth:0.01}), | ||
| + | |||
| + | |||
| + | brd2.createElement('text', [6.95,-1.48, "V"], {fixed:true}); | ||
| + | brd2.createElement('text', [7.8,-1.6, "<I>T</I>_0="], {fixed:true}); | ||
| + | brd2.create('text',[5.4,-1.48, function() | ||
| + | { return '<I>x(t)</I>='+(a.Value()*Math.cos(2*Math.PI*b.Value()*t.Value()-c.Value())+d.Value()*Math.cos(2*Math.PI*e.Value()*t.Value()-g.Value())).toFixed(3) ;}], {fixed:true}); | ||
| + | |||
| + | signaldarstellung = brd1.create('functiongraph',[function(x){ | ||
| + | return (a.Value()*Math.cos(2*Math.PI*b.Value()*x-2*Math.PI*c.Value()/360)+d.Value()*Math.cos(2*Math.PI*e.Value()*x-2*Math.PI*g.Value()/360)) | ||
| + | },0], {strokeColor: "red"}); | ||
| + | |||
| + | function showgrid() { | ||
| + | if (gridbox.checked) { | ||
| + | xaxis = brd1.create('axis', [[0, 0], [1,0]], {}); | ||
| + | yaxis = brd1.create('axis', [[0, 0], [0, 1]], {}); | ||
| + | } else { | ||
| + | xaxis.removeTicks(xaxis.defaultTicks); | ||
| + | yaxis.removeTicks(yaxis.defaultTicks); | ||
| + | } | ||
| + | brd1.fullUpdate(); | ||
| + | }; | ||
| + | |||
| + | </script> | ||
| + | </form> | ||
| − | |||
| + | <script> | ||
| + | function zurueck() { | ||
| + | document.getElementById("myForm").reset(); | ||
| + | } | ||
| + | </script> | ||
| + | </body> | ||
| + | </html> | ||
{{Display}} | {{Display}} | ||
Revision as of 14:15, 6 September 2017
Erklärung.
<applet>
