Skip to content

Commit 20ec260

Browse files
committed
adding rlc parallel. Adding S21 plot
1 parent 10195e2 commit 20ec260

6 files changed

Lines changed: 1151 additions & 81 deletions

File tree

smith_chart/.DS_Store

6 KB
Binary file not shown.

smith_chart/index.html

Lines changed: 32 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
<title>Online Smith Chart Tool</title>
2424

2525

26-
<script src="https://cdn.plot.ly/plotly-2.4.2.min.js"></script>
26+
<script src="https://cdn.plot.ly/plotly-2.35.2.min.js"></script>
2727
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@7.26.29/dist/sweetalert2.all.min.js"></script>
2828

2929
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css" rel="stylesheet"
@@ -247,6 +247,13 @@ <h4 class="mb-0"><strong>ONLINE SMITH CHART TOOL</strong></h4>
247247
<use xlink:href="svg/elements_w_custom.svg#rainbow3" alt="Inductor w/ESR" />
248248
</svg>
249249
</div>
250+
<div class="col-6 col-lg-2 schemHover text-center border-top border-bottom border-dark"
251+
onclick="clicked_cell('customZ')">
252+
<p class="m-0">Custom</p>
253+
<svg viewBox="6500 0 500 500">
254+
<use xlink:href="svg/elements_w_custom.svg#rainbow3" alt="customZ" />
255+
</svg>
256+
</div>
250257
<div class="col-6 col-lg-2 schemHover text-center border-top border-bottom border-dark"
251258
onclick="clicked_cell('rlc')">
252259
<p class="m-0">RLC</p>
@@ -255,10 +262,10 @@ <h4 class="mb-0"><strong>ONLINE SMITH CHART TOOL</strong></h4>
255262
</svg>
256263
</div>
257264
<div class="col-6 col-lg-2 schemHover text-center border-top border-bottom border-dark"
258-
onclick="clicked_cell('customZ')">
259-
<p class="m-0">Custom</p>
260-
<svg viewBox="6500 0 500 500">
261-
<use xlink:href="svg/elements_w_custom.svg#rainbow3" alt="customZ" />
265+
onclick="clicked_cell('rlc_par')">
266+
<p class="m-0">Parallel RLC</p>
267+
<svg viewBox="7000 0 500 500">
268+
<use xlink:href="svg/elements_w_custom.svg#rainbow3" alt="rlc_par" />
262269
</svg>
263270
</div>
264271

@@ -333,55 +340,34 @@ <h4 class="mb-0"><strong>ONLINE SMITH CHART TOOL</strong></h4>
333340
</div>
334341
</div>
335342

336-
<!-- <div class="col-2 col-lg-2">
337-
<div class="input-group">
338-
<div class="input-group-text"><input class="form-check-input mt-0" autocomplete="off" type="checkbox" checked onchange="toggle_labels_DP()"></div>
339-
<span class="input-group-text">Show label: DP</span>
340-
</div>
341-
</div>
342-
<div class="col-2 col-lg-2">
343-
<div class="input-group">
344-
<div class="input-group-text"><input class="form-check-input mt-0" autocomplete="off" type="checkbox" checked onchange="toggle_labels_imag()"></div>
345-
<span class="input-group-text">Show label: adm</span>
346-
</div>
347-
</div>
348-
<div class="col-2 col-lg-2">
349-
<div class="input-group">
350-
<div class="input-group-text"><input class="form-check-input mt-0" autocomplete="off" type="checkbox" checked onchange="toggle_labels_real()"></div>
351-
<span class="input-group-text">Show label: res</span>
352-
</div>
353-
</div> -->
354-
355-
356-
<!-- <div class="col-2 col-lg-2">
357-
<div class="input-group">
358-
<div class="input-group-text"><input class="form-check-input mt-0" autocomplete="off" type="checkbox" checked onchange="toggle_circles_adm()"></div>
359-
<span class="input-group-text">Show circle: adm</span>
360-
</div>
361-
</div>
362-
<div class="col-2 col-lg-2">
363-
<div class="input-group">
364-
<div class="input-group-text"><input class="form-check-input mt-0" autocomplete="off" type="checkbox" checked onchange="toggle_circles_res()"></div>
365-
<span class="input-group-text">Show circle: res</span>
366-
</div>
367-
</div> -->
368-
369343

370344
</div>
371345

372346
<div class="row mt-4">
373347

374348
<div class="col-12 col-lg-6">
375-
<div class="row text-center">
376-
<h4 class="mb-0">S11 Parameter vs Frequency</h4>
349+
350+
<div class="row text-center border rounded py-2">
351+
<h4 class="mb-0">S11 vs Frequency</h4>
352+
<!-- </div>
353+
<div class="row" id="smith_sparameters" > -->
354+
<div>
355+
<div id="SParamPlot" style="height: 300px">
356+
<!-- Plotly chart will be drawn inside this DIV -->
357+
</div>
358+
</div>
377359
</div>
378-
<div class="row" id="smith_sparameters">
360+
<div class="row text-center border rounded py-2">
361+
<h4 class="mb-0">S21 vs Frequency</h4><p>(assuming S11^2 + S21^2 = 1)</p>
362+
<!-- </div>
363+
<div class="row"> -->
379364
<div>
380-
<div id="SParamPlot">
365+
<div id="SParamPlot_s21" style="height: 300px">
381366
<!-- Plotly chart will be drawn inside this DIV -->
382367
</div>
383368
</div>
384369
</div>
370+
385371
</div>
386372

387373
<!-- <div class="col-lg-4">
@@ -515,7 +501,10 @@ <h4>Let me know of any issues or requests!</h4>
515501
<div class="container-xl">
516502
<div class="row mt-2">
517503
<div class="col">
518-
Copyright &copy; Will Kelsey 2021. www.will-kelsey.com/smith_chart
504+
Copyright &copy; Will Kelsey <span id="current-year"></span>. www.will-kelsey.com/smith_chart
505+
<script>
506+
document.getElementById("current-year").textContent = new Date().getFullYear();
507+
</script>
519508
</div>
520509
</div>
521510
<div class="row mt-3">

smith_chart/js/smith_tool.js

Lines changed: 47 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -314,6 +314,8 @@ function clicked_cell(type) {
314314
schematic.push({ type: 'rl', real: 0, imaginary: 0, abs: [50, 1], unit: ['Ω', 'nH'], tol: 0 });
315315
} else if (type == "rlc") {
316316
schematic.push({ type: 'rlc', real: 0, imaginary: 0, abs: [50, 1, 1], unit: ['Ω', 'nH', 'pF'], tol: 0 });
317+
} else if (type == "rlc_par") {
318+
schematic.push({ type: 'rlc_par', real: 0, imaginary: 0, abs: [50, 1, 1], unit: ['Ω', 'nH', 'pF'], tol: 0 });
317319
} else if (type == "customZ") {
318320
schematic.push({ type: 'customZ', real: 0, imaginary: 0, abs: [50, 1, 1], unit: ['Ω', 'nH', 'pF'], lut: [[2440e6, 50, 50]], interp: "linear", raw: "2440e6,50,50", tol: 0 });
319321
}
@@ -338,6 +340,7 @@ function update_schem_abs(target_num, obj, absCounter) {
338340
case ("rc"):
339341
case ("rl"):
340342
case ("rlc"):
343+
case ("rlc_par"):
341344
case ("bb"):
342345
case ("sr"):
343346
case ("pr"):
@@ -395,6 +398,10 @@ function update_schem_component(freq_here, save_impedance, sch_index) {
395398
case ("si"):
396399
im_here = (schematic[sch_index].abs[0] * scaler[0] * 2 * Math.PI * freq_here / zo);
397400
break;
401+
case ("rlc_par"):
402+
re_here = schematic[sch_index].abs[0] * scaler[0] / zo;
403+
im_here = (1/zo) / ((1/(schematic[sch_index].abs[1] * scaler[1] * 2 * Math.PI * freq_here)) - (schematic[sch_index].abs[2] * scaler[2] * 2 * Math.PI * freq_here));
404+
break;
398405
case ("rlc"):
399406
re_here = schematic[sch_index].abs[0] * scaler[0] / zo;
400407
im_here = ((schematic[sch_index].abs[1] * scaler[1] * 2 * Math.PI * freq_here) - (1 / (schematic[sch_index].abs[2] * scaler[2] * 2 * Math.PI * freq_here))) / zo;
@@ -438,15 +445,17 @@ function update_schem_component(freq_here, save_impedance, sch_index) {
438445
}
439446

440447
if (save_impedance) {
441-
if ((Math.abs(re_here) < 0.1) && (re_here != 0)) schematic[sch_index].real = expo(re_here, 2);
442-
else schematic[sch_index].real = Number(re_here).toPrecision(precision);
448+
//This is removing precision before the calculation is done! oops.
449+
// if ((Math.abs(re_here) < 0.1) && (re_here != 0)) schematic[sch_index].real = expo(re_here, 2);
450+
// else schematic[sch_index].real = Number(re_here);
443451

444-
if ((Math.abs(im_here) < 0.1) && (im_here != 0)) schematic[sch_index].imaginary = expo(im_here, 2);
445-
else schematic[sch_index].imaginary = Number(im_here).toPrecision(precision);
452+
// if ((Math.abs(im_here) < 0.1) && (im_here != 0)) schematic[sch_index].imaginary = expo(im_here, 2);
453+
// else schematic[sch_index].imaginary = Number(im_here);
446454

455+
schematic[sch_index].real = Number(re_here);
456+
schematic[sch_index].imaginary = Number(im_here);
447457
schematic[sch_index].line_length = ln_here;
448458
}
449-
450459
return [re_here, im_here, ln_here]
451460
//}
452461
//}
@@ -622,7 +631,7 @@ function update_smith_chart() {
622631
var schem_inv = one_over_complex(start[0] + schem_inv[0], start[1] + schem_inv[1]);
623632
span_impedance_re[sp] = schem_inv[0];
624633
span_impedance_im[sp] = schem_inv[1];
625-
} else if ((schematic[i].type[0] == 's') || (schematic[i].type[0] == 'b') || (schematic[i].type == 'customZ')) {
634+
} else if ((schematic[i].type[0] == 's') || (schematic[i].type[0] == 'b') || (schematic[i].type == 'customZ') || (schematic[i].type == 'rlc_par')) {
626635
//For series elements plotted on normal curves....
627636
start_impedance[0] = span_impedance_re[sp];
628637
start_impedance[1] = span_impedance_im[sp];
@@ -1108,6 +1117,8 @@ function update_smith_chart() {
11081117
yaxis: 'y2',
11091118
type: 'scatter'
11101119
};
1120+
var traceS21 = {...traceS11};
1121+
var traceS21Ph = {...traceS11Ph};
11111122

11121123
var sParamLayout = {
11131124
yaxis: {
@@ -1125,9 +1136,11 @@ function update_smith_chart() {
11251136
zeroline: false,
11261137
// showgrid: true,
11271138
gridcolor: "rgb(37, 50, 64)",
1139+
griddash:"dash",
11281140
fixedrange: true,
11291141
title: 'Phase (deg)',
11301142
automargin: true,
1143+
overlaying:"y"
11311144
},
11321145
xaxis: {
11331146
automargin: true,
@@ -1143,8 +1156,11 @@ function update_smith_chart() {
11431156
b: 20,
11441157
t: 20
11451158
},
1146-
hovermode: false,
1159+
hovermode:"x unified",
11471160
showlegend: false,
1161+
hoverlabel: {
1162+
bgcolor:"lightblue"
1163+
},
11481164
// legend: {
11491165
// x: 1,
11501166
// xanchor: 'right',
@@ -1178,17 +1194,29 @@ function update_smith_chart() {
11781194
// [reflectio_coeff_real, reflectio_coeff_imag, reflection_mag, reflection_phase] = impedanceToReflectionCoefficient (real_old, imag_old, zo)
11791195
traceS11.x = [];
11801196
traceS11Ph.x = [];
1197+
traceS21.x = [];
1198+
traceS21Ph.x = [];
1199+
traceS11.y = [];
1200+
traceS11Ph.y = [];
1201+
traceS21.y = [];
1202+
traceS21Ph.y = [];
11811203
for (i = 0; i < span_impedance_re.length; i++) {
11821204
[reflectio_coeff_real, reflectio_coeff_imag, reflection_mag, reflection_phase] = impedanceToReflectionCoefficient(span_impedance_re[i], span_impedance_im[i], zo)
11831205
if (reflection_mag == 0) {
11841206
traceS11.y.push(0);
11851207
traceS11Ph.y.push(0);
1208+
traceS21.y.push(0);
1209+
traceS21Ph.y.push(0);
11861210
} else {
11871211
traceS11.y.push(20 * Math.log10(reflection_mag));
11881212
traceS11Ph.y.push(reflection_phase);
1213+
traceS21.y.push(20 * Math.log10(1-reflection_mag));
1214+
traceS21Ph.y.push(-reflection_phase);
11891215
}
11901216
traceS11.x.push((freq + span_freq * (i - span_res) / span_res) / schematic[0].freq_unit.multiplier);
11911217
traceS11Ph.x.push((freq + span_freq * (i - span_res) / span_res) / schematic[0].freq_unit.multiplier);
1218+
traceS21.x.push((freq + span_freq * (i - span_res) / span_res) / schematic[0].freq_unit.multiplier);
1219+
traceS21Ph.x.push((freq + span_freq * (i - span_res) / span_res) / schematic[0].freq_unit.multiplier);
11921220
}
11931221
newSpanFreq = span_freq / schematic[0].freq_unit.multiplier;
11941222
}
@@ -1197,11 +1225,10 @@ function update_smith_chart() {
11971225

11981226
// var data = [traceS11, traceS22];
11991227
var data = [traceS11, traceS11Ph];
1200-
// var smith_lambda = document.getElementById("SParamPlot").offsetWidth;
1201-
// sParamLayout.width = smith_lambda;
1202-
// sParamLayout.height = smith_lambda;
1228+
var data21 = [traceS21, traceS21Ph];
12031229

12041230
Plotly.react('SParamPlot', data, sParamLayout, config);
1231+
Plotly.react('SParamPlot_s21', data21, sParamLayout, config);
12051232

12061233

12071234
//update the HTML tables
@@ -1232,7 +1259,6 @@ function draw_schematic(i) {
12321259
sch_imag = true;
12331260
sch_real = true;
12341261
sch_abs = true;
1235-
sch_icon = "black_box";
12361262
sch_svg = 0;
12371263
rows_to_create = [['Impedance'], ['abs', 'abs'], ['tol']];
12381264
break;
@@ -1241,7 +1267,6 @@ function draw_schematic(i) {
12411267
sch_imag = true;
12421268
sch_real = true;
12431269
sch_abs = true;
1244-
sch_icon = "CustomZ";
12451270
sch_svg = 6500;
12461271
rows_to_create = [['blank-impedance'], ['custom']];
12471272
break;
@@ -1252,7 +1277,6 @@ function draw_schematic(i) {
12521277
sch_real = true;
12531278
sch_abs = true;
12541279
unit = [['mΩ', 'Ω', 'KΩ', 'MΩ']];
1255-
sch_icon = "resistor_parallel";
12561280
sch_svg = 2500;
12571281
break;
12581282
case ("sr"):
@@ -1262,7 +1286,6 @@ function draw_schematic(i) {
12621286
sch_real = true;
12631287
sch_abs = true;
12641288
unit = [['mΩ', 'Ω', 'KΩ', 'MΩ']];
1265-
sch_icon = "resistor_series";
12661289
sch_svg = 3000;
12671290
break;
12681291
case ("pc"):
@@ -1272,7 +1295,6 @@ function draw_schematic(i) {
12721295
sch_real = false;
12731296
sch_abs = true;
12741297
unit = [['mF', 'uF', 'nF', 'pF', 'fF']];
1275-
sch_icon = "capacitor_parallel";
12761298
sch_svg = 500;
12771299
break;
12781300
case ("sc"):
@@ -1282,7 +1304,6 @@ function draw_schematic(i) {
12821304
sch_real = false;
12831305
sch_abs = true;
12841306
unit = [['mF', 'uF', 'nF', 'pF', 'fF']];
1285-
sch_icon = "capacitor_series";
12861307
sch_svg = 1000;
12871308
break;
12881309
case ("pi"):
@@ -1292,7 +1313,6 @@ function draw_schematic(i) {
12921313
sch_real = false;
12931314
sch_abs = true;
12941315
unit = [['H', 'mH', 'uH', 'nH', 'pH']];
1295-
sch_icon = "inductor_parallel";
12961316
sch_svg = 1500;
12971317
break;
12981318
case ("si"):
@@ -1302,7 +1322,6 @@ function draw_schematic(i) {
13021322
sch_real = false;
13031323
sch_abs = true;
13041324
unit = [['H', 'mH', 'uH', 'nH', 'pH']];
1305-
sch_icon = "inductor_series";
13061325
sch_svg = 2000;
13071326
break;
13081327
case ("tl"):
@@ -1312,7 +1331,6 @@ function draw_schematic(i) {
13121331
sch_real = false;
13131332
sch_abs = true; //is actually length
13141333
unit = [[' m', 'mm', 'um', 'λ']];
1315-
sch_icon = "transmission_line";
13161334
sch_svg = 3500;
13171335
break;
13181336
case ("ss"):
@@ -1322,7 +1340,6 @@ function draw_schematic(i) {
13221340
sch_real = false;
13231341
sch_abs = true; //is actually length
13241342
unit = [[' m', 'mm', 'um', 'λ']];
1325-
sch_icon = "stub_short";
13261343
sch_svg = 4500;
13271344
break;
13281345
case ("so"):
@@ -1332,7 +1349,6 @@ function draw_schematic(i) {
13321349
sch_real = false;
13331350
sch_abs = true; //is actually length
13341351
unit = [[' m', 'mm', 'um', 'λ']];
1335-
sch_icon = "stub_open";
13361352
sch_svg = 4000;
13371353
break
13381354
case ("rc"):
@@ -1342,7 +1358,6 @@ function draw_schematic(i) {
13421358
sch_real = true;
13431359
sch_abs = true;
13441360
unit = [['mΩ', 'Ω', 'KΩ', 'MΩ'], ['mF', 'uF', 'nF', 'pF', 'fF']];
1345-
sch_icon = "black_box";
13461361
sch_svg = 5000;
13471362
break;
13481363
case ("rl"):
@@ -1352,19 +1367,26 @@ function draw_schematic(i) {
13521367
sch_real = true;
13531368
sch_abs = true;
13541369
unit = [['mΩ', 'Ω', 'KΩ', 'MΩ'], ['H', 'mH', 'uH', 'nH', 'pH']];
1355-
sch_icon = "black_box";
13561370
sch_svg = 5500;
13571371
break;
13581372
case ("rlc"):
13591373
rows_to_create = [['Impedance'], ['abs', 'unit_0'], ['abs', 'unit_1'], ['abs', 'unit_2'], ['tol']];
1360-
sch_label = "Inductor w/ ESR";
1374+
sch_label = "Grounded RLC";
13611375
sch_imag = true;
13621376
sch_real = true;
13631377
sch_abs = true;
13641378
unit = [['mΩ', 'Ω', 'KΩ', 'MΩ'], ['H', 'mH', 'uH', 'nH', 'pH'], ['mF', 'uF', 'nF', 'pF', 'fF']];
1365-
sch_icon = "black_box";
13661379
sch_svg = 6000;
13671380
break;
1381+
case ("rlc_par"):
1382+
rows_to_create = [['Impedance'], ['abs', 'unit_0'], ['abs', 'unit_1'], ['abs', 'unit_2'], ['tol']];
1383+
sch_label = "Parallel RLC";
1384+
sch_imag = true;
1385+
sch_real = true;
1386+
sch_abs = true;
1387+
unit = [['mΩ', 'Ω', 'KΩ', 'MΩ'], ['H', 'mH', 'uH', 'nH', 'pH'], ['mF', 'uF', 'nF', 'pF', 'fF']];
1388+
sch_svg = 7000;
1389+
break;
13681390
}
13691391
innerText += '<div class="row"><div class="col"><svg viewBox="' + sch_svg + ' 0 500 500"><use xlink:href="svg/elements_w_custom.svg#rainbow3" alt="' + sch_label + '" /></svg></div></div>';
13701392

0 commit comments

Comments
 (0)