Applets:Periodendauer periodischer Signale: Unterschied zwischen den Versionen
Aus LNTwww
Tasnad (Diskussion | Beiträge) (Die Seite wurde neu angelegt: „ {{Header |Untermenü= |Vorherige Seite= |Nächste Seite= }} Erklärung. <applet> {{Display}}“) |
Tasnad (Diskussion | Beiträge) |
||
Zeile 1: | Zeile 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}} |
Version vom 6. September 2017, 14:15 Uhr
Erklärung.
<applet>