-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
118 lines (109 loc) · 3.3 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
<html>
<head>
<meta charset="UTF-8">
<meta name="robots" content="noindex">
<style class="cp-pen-styles">
html,body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
font-family: Open Sans;
font-size: 12px;
color: orange;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
display: -webkit-flex;
-webkit-align-items: center;
-webkit-justify-content: center;
background: #222;
}
h3 {
margin: 0 0 3px 1px;
}
p {
color: #555;
width: 512px;
}
p a {
color: #555;
}
canvas {
background: black;
}
span {
width: 160px;
margin: 0;
padding: 0;
display: inline-block;
}
form,
label {
display: inline-block;
}
input[type="range"] {
margin: 0;
padding: 0;
width: 432px;
display: inline;
vertical-align: middle;
}
</style>
</head>
<body>
<div>
<h3>Harmonic analysis</h3>
<canvas width="512" height="256"></canvas>
<form>
<div>
<span>Fundamental Frequency</span>
<input name="frequency" type="range" min="-4" max="-3" value="-3.5" step="0.0001">
</div>
<div>
<span>1st Added Harmonic Freq (n)</span>
<input name="harm1n" type="number" value="2">
</div>
<div>
<span>1st Added Harmonic Mag (pu)</span>
<input name="harm1mag" type="number" value="0" min="0" step="0.1">
</div>
<div>
<span>1st Added Harmonic Phase (deg)</span>
<input name="harm1ph" type="range" min="0" max="360" value="0" step="1" oninput="this.form.harm1phAmount.value=this.value" />
<input type="number" name="harm1phAmount" min="0" max="360" value="0" oninput="this.form.harm1ph.value=this.value" />
</div>
<div>
<span>2nd Added Harmonic Freq (n)</span>
<input name="harm2n" type="number" value="5">
</div>
<div>
<span>2nd Added Harmonic Mag (pu)</span>
<input name="harm2mag" type="number" value="0" min="0" step="0.1">
</div>
<div>
<span>2st Added Harmonic Phase (deg)</span>
<input name="harm2ph" type="range" min="0" max="360" value="0" step="1" oninput="this.form.harm2phAmount.value=this.value">
<input type="number" name="harm2phAmount" min="0" max="360" value="0" oninput="this.form.harm2ph.value=this.value" />
</div>
<div>
<input name="circle" type="checkbox" checked="checked">Show Harmonic Locus<br>
<input name="locus" type="checkbox" checked="checked">Show Overall Resulting Locus<br>
<input name="coordalphabeta" type="checkbox" checked="checked">Show Coordinates Alpha-Beta<br>
<input name="coordabc" type="checkbox">Show Coordinates Abc<br>
</div>
<div>
<span>Choose graph to plot:</span><br>
<input type="radio" name="plot" value="waveAlphaBeta" checked>Waveform - alpha(red), beta(green)<br>
<input type="radio" name="plot" value="waveAbc">Waveform - a(red), b(green), c(blue)<br>
<input type="radio" name="plot" value="magnitude">Phasor Magnitude<br>
<input type="radio" name="plot" value="angle">Phasor Angle - stationary reference<br>
<input type="radio" name="plot" value="anglediff">Phasor Angle - synchronous reference (fundamental)<br>
</div>
</form><br>
Developed by Victor Maryama, based on code by André Michelle (https://codepen.io/andremichelle/pen/LVzMRz)
</div>
<script src="HarmonicPLL.js"></script>
</body>
</html>