Applets:Periodendauer periodischer Signale: Difference between revisions

From LNTwww
No edit summary
No edit summary
Line 1: Line 1:
<p>
<p>
{{BlaueBox|TEXT=
{{BlaueBox|TEXT=
Line 9: Line 10:
<html>
<html>
<head>
<head>
    <meta charset="utf-8" />
   <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jsxgraph/0.99.6/jsxgraphcore.js"></script>
   <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jsxgraph/0.99.6/jsxgraphcore.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/mathjax/MathJax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
  <script type="text/javascript" src="https://cdn.rawgit.com/mathjax/MathJax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
    <style>
        .button {
            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;
        }
        .button:active {
            background-color: #939393;
        }
 
        table {
            border-collapse: separate;
            border-spacing: 20px 0;
        }
    </style>
</head>
   <style>
   <style>
   .button1{
   .button1{
Line 63: Line 40:


<form id="jxgForm">
<form id="jxgForm">
<!-- Resetbutton, Checkbox und Formel -->
<!-- Resetbutton, Checkbox und Formel -->
    <p>
<p>
        <input type="checkbox" id="gridbox" onclick="showgrid();" checked> <label for="gridbox">Gitterlinien zeigen</label>
    <input type="checkbox" id="gridbox" onclick="showgrid();" checked> <label for="gridbox">Gitterlinien zeigen</label>
        <button class="button" onclick="rst()">Reset</button>
    <button class="button" onclick="rst()">Reset</button>
    </p>
</p>


<div id="pltBoxHtml" class="jxgbox" style="width:600px; height:600px; border:1px solid black; margin:170px 20px 0px 0px;"></div>
<div id="box1" class="jxgbox" style="width:600px; height:600px; border:1px solid black; margin:100px 20px 0px 0px;"></div>
<div id="cnfBoxHtml" class="jxgbox" style="width:600px; height:150px; border:1px solid white; margin:-960px 20px 0px 0px;"></div>
<div id="box2" class="jxgbox" style="width:600px; height:150px; border:1px solid white; margin:-760px 20px 0px 0px;"></div>
<div id="outBoxHtml" class="jxgbox" style="width:600px; height:100px; border:1px solid white; margin:625px 20px 0px 0px;"></div>
<div id="box3" class="jxgbox" style="width:600px; height:100px; border:1px solid white; margin:625px 20px 0px 0px;"></div>
</form>


<script type="text/javascript">
<script type="text/javascript">
Line 78: Line 55:
//Grundeinstellungen der beiden Applets
//Grundeinstellungen der beiden Applets
JXG.Options.text.useMathJax = true;
JXG.Options.text.useMathJax = true;
var brd1 = JXG.JSXGraph.initBoard('pltBoxHtml', {showCopyright:false, axis:false, zoom:{factorX:1.1, factorY:1.1, wheel:true, needshift:true, eps: 0.1}, grid:false, boundingbox: [-0.5, 2.2, 12.4, -2.2]});
var brd1 = JXG.JSXGraph.initBoard('box1', {showCopyright:false, axis:false, zoom:{factorX:1.1, factorY:1.1, wheel:true, needshift:true, eps: 0.1}, grid:false, boundingbox: [-0.5, 2.2, 12.4, -2.2]});
var brd2 = JXG.JSXGraph.initBoard('cnfBoxHtml', {showCopyright:false, showNavigation:false, axis:false, grid:false, zoom:{enabled:false}, pan:{enabled:false}, boundingbox: [-1, 2.2, 12.4, -2.2]});
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 brd3 = JXG.JSXGraph.initBoard('outBoxHtml', {showCopyright:false, showNavigation:false, axis:false, grid:false, zoom:{enabled:false}, pan:{enabled:false}, boundingbox: [-1, 2.2, 12.4, -2.2]});
var brd3 = JXG.JSXGraph.initBoard('box3', {showCopyright:false, showNavigation:false, axis:false, grid:false, zoom:{enabled:false}, pan:{enabled:false}, boundingbox: [-1, 2.2, 12.4, -2.2]});
brd2.addChild(brd1);
brd2.addChild(brd1);
brd2.addChild(brd3);
brd2.addChild(brd3);


//Einstellungen der Achsen
//Einstellungen der Achsen
xaxis = brd1.create('axis', [[0, 0], [1,0]], {name:'\\[\\frac{t}{T}\\]', withLabel:true, label:{position:'rt', offset:[-25, 15]}});
xaxis = brd1.create('axis', [[0, 0], [1,0]], {name:'\\[t/T\\]', withLabel:true, label:{position:'rt', offset:[-25, 15]}});
yaxis = brd1.create('axis', [[0, 0], [0, 1]], {name:'\\[x(t)\\]', withLabel:true, label:{position:'rt', offset:[10, -5]}});
yaxis = brd1.create('axis', [[0, 0], [0, 1]], {name:'\\[x(t)\\]', withLabel:true, label:{position:'rt', offset:[10, -5]}});


Line 193: Line 170:
//Definition des Reset-Buttons
//Definition des Reset-Buttons
function rst() {
function rst() {
     document.getElementById("myForm").reset();
     document.getElementById("jxgForm").reset();
};
};
</script>
</script>

Revision as of 18:54, 13 September 2017

Funktion: $$x(t) = A_1\cdot cos\Big(2\pi f_1\cdot t- \frac{2\pi}{360}\cdot \phi_1\Big)+A_2\cdot cos\Big(2\pi f_2\cdot t- \frac{2\pi}{360}\cdot \phi_2\Big)$$