mirror
/
vk3cpu
kopia lustrzana https://github.com/miguelvaca/vk3cpu
1
0
Forkuj 0
Kod Zgłoszenia Packages Projekty Wydania Wiki Aktywność
vk3cpu/magloop.html

704 wiersze
32 KiB
HTML
Czysty Zwykły widok Historia

First check in
2020-10-17 04:04:13 +00:00
<!DOCTYPE html>
Initial commit
2020-10-08 07:21:58 +00:00
<html lang="en">
First check in
2020-10-17 04:04:13 +00:00
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Phone layout updates
2020-10-21 04:10:02 +00:00
<title>VK3CPU Magloop Calculator</title>
First check in
2020-10-17 04:04:13 +00:00
<link rel="stylesheet" href="magloop.css">
</head>
<body>
Update magloop.html Changed heading to include "Interactive"
2020-10-21 04:14:16 +00:00
<header>Miguel VK3CPU - Interactive Magloop Antenna Calculator</header>
Big phone layout updates.
2020-10-21 03:39:46 +00:00
<section class="gridLayoutClass">
Update magloop.html
2020-10-21 04:20:10 +00:00
<div class="chart-container" style="position: relative;">
Big phone layout updates.
2020-10-21 03:39:46 +00:00
<canvas id="chartCanvas" class="chartCanvasClass">
2D Chart Canvas
</canvas>
</div>
<div class="slider_container">
<div class="sliders">
<label for="loop_diameter_slider">&#8960a:</label>
<input type="range" id="loop_diameter_slider" min="0.5" max="3.0" value="1.0" step="0.05">
Phone layout updates
2020-10-21 04:10:02 +00:00
<span id="loop_diameter_value"></span>m
Phone layout updates.
2020-10-20 01:19:12 +00:00
</div>
Big phone layout updates.
2020-10-21 03:39:46 +00:00
<div class="sliders">
<label for="conductor_diameter_slider">&#8960b:</label>
<input type="range" id="conductor_diameter_slider" min="5" max="30" value="19" step="1">
Phone layout updates
2020-10-21 04:10:02 +00:00
<span id="conductor_diameter_value"></span>mm
Big phone layout updates.
2020-10-21 03:39:46 +00:00
</div>
<div class="sliders">
Phone layout updates
2020-10-21 04:10:02 +00:00
<label for="loop_turns_slider">N:</label>
Big phone layout updates.
2020-10-21 03:39:46 +00:00
<input type="range" id="loop_turns_slider" min="1" max="8" value="1.0" step="1.0">
<span id="loop_turns_value"></span>
</div>
<div class="sliders">
Phone layout updates
2020-10-21 04:10:02 +00:00
<label for="loop_spacing_slider">c/b:</label>
Big phone layout updates.
2020-10-21 03:39:46 +00:00
<input type="range" id="loop_spacing_slider" min="1.1" max="4.0" value="2.0" step="0.05">
<span id="loop_spacing_value"></span>
</div>
<div class="sliders">
Phone layout updates
2020-10-21 04:10:02 +00:00
<label for="transmit_power_slider">Tx:</label>
<input type="range" id="transmit_power_slider" min="5" max="1500" value="400" step="5">
<span id="transmit_power_value"></span>W
Big phone layout updates.
2020-10-21 03:39:46 +00:00
</div>
<!--
<div>
<label for="heightAboveGround_slider">Height above ground:</label>
<input type="range" id="heightAboveGround_slider" min="0.0" max="10.0" value="1.0" step="0.1">
<span id="heightAboveGround_value"></span> (m)
</div>
-->
</div>
<div id="antenna-front-container" class="antennaFront-container" style="position: relative;">
<canvas id="antennaFront2D" class="antennaFrontClass" width="50" height="50">
Phone layout updates.
2020-10-20 01:19:12 +00:00
</canvas>
Big phone layout updates.
2020-10-21 03:39:46 +00:00
</div>
<div id="antenna-side-container" class="antennaSide-container" style="position: relative;">
<canvas id="antennaSide2D" class="antennaSideClass" width="50" height="50">
</canvas>
</div>
</section>
First check in
2020-10-17 04:04:13 +00:00
</body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>
<script>
Tidy up legend and tooltip
2020-10-18 23:42:27 +00:00
var frequencies = [];
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
First check in
2020-10-17 04:04:13 +00:00
var loop_diameter_slider = document.getElementById("loop_diameter_slider");
var loop_diameter_value = document.getElementById("loop_diameter_value");
Phone layout updates
2020-10-21 04:10:02 +00:00
//loop_diameter_value.innerHTML = loop_diameter_slider.value;
const val = loop_diameter_slider.value * 1.0;
loop_diameter_value.innerHTML = val.toPrecision(3).toString();
First check in
2020-10-17 04:04:13 +00:00
var conductor_diameter_slider = document.getElementById("conductor_diameter_slider");
var conductor_diameter_value = document.getElementById("conductor_diameter_value");
conductor_diameter_value.innerHTML = conductor_diameter_slider.value;
var loop_turns_slider = document.getElementById("loop_turns_slider");
var loop_turns_value = document.getElementById("loop_turns_value");
loop_turns_value.innerHTML = loop_turns_slider.value;
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
var loop_spacing_slider = document.getElementById("loop_spacing_slider");
var loop_spacing_value = document.getElementById("loop_spacing_value");
loop_spacing_value.innerHTML = loop_spacing_slider.value;
First check in
2020-10-17 04:04:13 +00:00
var transmit_power_slider = document.getElementById("transmit_power_slider");
var transmit_power_value = document.getElementById("transmit_power_value");
transmit_power_value.innerHTML = transmit_power_slider.value;
Update magloop.html Removed "Height above ground" slider. Will add it back once radiation pattern solver is working.
2020-10-19 01:45:36 +00:00
/*
First check in
2020-10-17 04:04:13 +00:00
var heightAboveGround_slider = document.getElementById("heightAboveGround_slider");
var heightAboveGround_value = document.getElementById("heightAboveGround_value");
heightAboveGround_value.innerHTML = heightAboveGround_slider.value;
Update magloop.html Removed "Height above ground" slider. Will add it back once radiation pattern solver is working.
2020-10-19 01:45:36 +00:00
*/
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
function updateFrequencies() {
const hamFrequencies = [
Update magloop.html
2020-10-19 05:47:06 +00:00
//1.6, 2.0, 4.0, 6.0, 8.0
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
1.8, 3.5, 5.0, 7.0, 10.1, 14.0, 18.068, 21.0, 24.89, 28.0
Tidy up legend and tooltip
2020-10-18 23:42:27 +00:00
//1.8, 2.2, 2.8, 3.5, 5.0, 6.0, 7.0, 8.0, 9.0, 10.1, 12.0, 14.0, 16.0, 18.068, 21.0, 24.89, 28.0
Update magloop.html
2020-10-19 05:47:06 +00:00
//1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
];
frequencies = [];
hamFrequencies.forEach(freq => {
const wavelength = 3e8 / (freq * 1e6);
const l = (Math.PI * loop_diameter_slider.value) / wavelength;
if (l <= 0.20) {
frequencies.push(freq);
}
});
}
// Update the frequencies, now that we have the sliders available:
updateFrequencies();
First check in
2020-10-17 04:04:13 +00:00
function getInductance() {
const a_coil_radius = loop_diameter_slider.value * 0.5;
const b_conductor_radius = conductor_diameter_slider.value * 0.0005;
const n_turns = loop_turns_slider.value;
const mu0 = 4.0 * Math.PI * 1e-7;
var retval = (n_turns ** 2.0) * mu0 * a_coil_radius * (Math.log(8.0 * a_coil_radius / b_conductor_radius) - 2.0);
return retval;
}
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
function radiationResistance(frequency) {
First check in
2020-10-17 04:04:13 +00:00
const n_turns = loop_turns_slider.value;
const k = 20.0 * (Math.PI ** 2.0);
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
const wavelength = 3e8 / (frequency * 1e6);
const l = (Math.PI * loop_diameter_slider.value) / wavelength;
const rr = (n_turns ** 2.0) * k * (l ** 4.0);
return rr;
}
Update magloop.html
2020-10-19 05:47:06 +00:00
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
function calculateRadiationResistance() {
var retval = [];
First check in
2020-10-17 04:04:13 +00:00
frequencies.forEach(freq => {
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
const rr = radiationResistance(freq);
retval.push({x:freq, y:rr});
First check in
2020-10-17 04:04:13 +00:00
});
return retval;
}
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
function inductiveReactance(frequency) {
const inductance = getInductance();
const wavelength = 3e8 / (frequency * 1e6);
const l = (Math.PI * loop_diameter_slider.value) / wavelength;
const reactance = 2.0 * Math.PI * (frequency * 1e6) * inductance;
return reactance;
}
First check in
2020-10-17 04:04:13 +00:00
function calculateInductiveReactance() {
var retval = [];
frequencies.forEach(freq => {
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
const reactance = inductiveReactance(freq);
retval.push({x:freq, y:reactance});
First check in
2020-10-17 04:04:13 +00:00
});
return retval;
}
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
function tuningCapacitance(frequency) {
const inductance = getInductance();
const wavelength = 3e8 / (frequency * 1e6);
const l = (Math.PI * loop_diameter_slider.value) / wavelength;
const reactance = 2.0 * Math.PI * frequency * 1e6 * inductance;
const capacitance = 1e12 / (2.0 * Math.PI * frequency * 1e6 * reactance);
return capacitance;
}
First check in
2020-10-17 04:04:13 +00:00
function calculateTuningCapacitor() {
var retval = [];
frequencies.forEach(freq => {
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
const capacitor = tuningCapacitance(freq);
retval.push({x:freq, y:capacitor});
First check in
2020-10-17 04:04:13 +00:00
});
return retval;
}
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
const proximityResistance = {
// From G. S. Smith, "Radiation Efficiency of Electrically Small Multiturn Loop Antennas", IEEE Trans Antennas Propagation, September 1972
Update magloop.html
2020-10-19 05:47:06 +00:00
// 0 - this is the corresponding x-axis value. 1 - single loop adds zero to proximity resistance. Others measured empirically.
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
0:[ 1.1, 1.15, 1.20, 1.25, 1.30, 1.40, 1.50, 1.60, 1.70, 1.80, 1.90, 2.00, 2.20, 2.40, 2.50, 2.60, 2.80, 3.00, 3.50, 4.00],
1:[0.000, 0.000, 0.000, 0.000, 0.000, 0.000, 0.000, 0.000, 0.000, 0.000, 0.000, 0.000, 0.000, 0.000, 0.000, 0.000, 0.000, 0.000, 0.000, 0.000],
2:[0.299, 0.284, 0.268, 0.254, 0.240, 0.214, 0.191, 0.173, 0.155, 0.141, 0.128, 0.116, 0.098, 0.032, 0.077, 0.071, 0.061, 0.054, 0.040, 0.031],
3:[0.643, 0.580, 0.531, 0.491, 0.455, 0.395, 0.346, 0.305, 0.270, 0.241, 0.216, 0.195, 0.161, 0.135, 0.124, 0.114, 0.098, 0.085, 0.062, 0.048],
4:[0.996, 0.868, 0.777, 0.704, 0.644, 0.564, 0.470, 0.408, 0.353, 0.316, 0.281, 0.252, 0.205, 0.170, 0.156, 0.144, 0.123, 0.106, 0.077, 0.058],
5:[1.347, 1.142, 1.002, 0.896, 0.809, 0.674, 0.572, 0.492, 0.428, 0.375, 0.332, 0.295, 0.239, 0.197, 0.180, 0.165, 0.141, 0.121, 0.087, 0.066],
6:[1.689, 1.400, 1.210, 1.068, 0.956, 0.784, 0.658, 0.561, 0.485, 0.423, 0.372, 0.330, 0.265, 0.217, 0.198, 0.182, 0.154, 0.133, 0.095, 0.072],
7:[2.020, 1.693, 1.401, 1.224, 1.086, 0.880, 0.732, 0.620, 0.532, 0.462, 0.405, 0.358, 0.286, 0.234, 0.213, 0.195, 0.165, 0.142, 0.101, 0.076],
8:[2.340, 1.872, 1.577, 1.365, 1.203, 0.965, 0.796, 0.670, 0.573, 0.495, 0.433, 0.392, 0.304, 0.247, 0.225, 0.206, 0.174, 0.150, 0.106, 0.080]
};
function getProximityResFromSpacing(spacing_ratio) {
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
// Use the proximityResistance look-up table and interpolate values depending on the spacing ratio and the number of turns.
Upload test for mobile
2020-10-17 13:00:08 +00:00
var retval = 0.0;
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
const n_turns = loop_turns_slider.value;
var i = 0;
for (i = 0; i < (proximityResistance[0].length-1); i++) {
if(spacing_ratio <= proximityResistance[0][i+1]) {
// Linear interpolation between empirical proximity resistance values:
retval = (((spacing_ratio - proximityResistance[0][i]) / (proximityResistance[0][i+1] - proximityResistance[0][i]) * (proximityResistance[n_turns][i+1] - proximityResistance[n_turns][i])) + proximityResistance[n_turns][i]);
break;
}
Upload test for mobile
2020-10-17 13:00:08 +00:00
}
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
return retval;
Upload test for mobile
2020-10-17 13:00:08 +00:00
}
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
function lossResistance(frequency) {
First check in
2020-10-17 04:04:13 +00:00
const a_coil_radius = loop_diameter_slider.value * 0.5;
const b_conductor_radius = conductor_diameter_slider.value * 0.0005;
const n_turns = loop_turns_slider.value;
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
const loop_spacing_ratio = loop_spacing_slider.value;
First check in
2020-10-17 04:04:13 +00:00
const mu0 = 4.0 * Math.PI * 1e-7;
const k = (n_turns * a_coil_radius / b_conductor_radius);
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
const cu_sigma = 58e6; // Copper conductance value
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
const Rp = getProximityResFromSpacing(loop_spacing_ratio);
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
const Rs = Math.sqrt(Math.PI * frequency * 1e6 * mu0 / cu_sigma);
const R0 = (n_turns * Rs) / (2.0 * Math.PI * b_conductor_radius);
const R_ohmic = k * Rs * (Rp / R0 + 1.0);
return R_ohmic;
}
function calculateLossResistance() {
var retval = [];
First check in
2020-10-17 04:04:13 +00:00
frequencies.forEach(freq => {
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
const R_ohmic = lossResistance(freq);
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
retval.push({x:freq, y:R_ohmic});
First check in
2020-10-17 04:04:13 +00:00
});
return retval;
}
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
function calculateEfficiencyFactor() {
var retval = [];
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
frequencies.forEach(freq => {
const R_ohmic = lossResistance(freq);
const R_rad = radiationResistance(freq);
const efficiency = 100.0 / (1.0 + (R_ohmic / R_rad));
Update magloop.html
2020-10-19 05:47:06 +00:00
//const efficiency = 10.0 * Math.log10(1.0 / (1.0 + (R_ohmic / R_rad))); // for Efficiency in dB
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
retval.push({x:freq, y:efficiency});
});
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
return retval;
}
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
function qualityFactor(frequency) {
const Xl = inductiveReactance(frequency);
const Rl = lossResistance(frequency);
const Rr = radiationResistance(frequency);
const Q = Xl / (Rl + Rr);
return Q;
}
First check in
2020-10-17 04:04:13 +00:00
function calculateQualityFactor() {
var retval = [];
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
frequencies.forEach(freq => {
const Q = qualityFactor(freq);
retval.push({x:freq, y:Q});
});
return retval;
}
function bandwidth(frequency) {
const Q = qualityFactor(frequency);
const bw = frequency * 1e3 / Q; // in kiloHertz, remember that frequency comes in as MHz. Conversion between MHz and kHz is why the 1e3 exists.
return bw;
}
function calculateBandwidth() {
var retval = [];
frequencies.forEach(freq => {
const bw = bandwidth(freq);
retval.push({x:freq, y:bw});
});
First check in
2020-10-17 04:04:13 +00:00
return retval;
}
Added capacitor voltage
2020-10-18 13:15:40 +00:00
function capacitorVoltage(frequency) {
const Vcap = Math.sqrt(transmit_power_slider.value * inductiveReactance(frequency) * qualityFactor(frequency));
return Vcap;
}
function calculateCapacitorVoltage() {
var retval = [];
frequencies.forEach(freq => {
Tidy up legend and tooltip
2020-10-18 23:42:27 +00:00
const Vcap = 0.001 * capacitorVoltage(freq);
Added capacitor voltage
2020-10-18 13:15:40 +00:00
retval.push({x:freq, y:Vcap});
});
return retval;
}
First check in
2020-10-17 04:04:13 +00:00
loop_diameter_slider.oninput = function() {
Phone layout updates
2020-10-21 04:10:02 +00:00
const val = this.value * 1.0;
loop_diameter_value.innerHTML = val.toPrecision(3).toString();
Big phone layout updates.
2020-10-21 03:39:46 +00:00
drawFrontDesign();
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
updateFrequencies();
Added capacitor voltage
2020-10-18 13:15:40 +00:00
myChart.data.datasets[0].data = calculateTuningCapacitor();
myChart.data.datasets[1].data = calculateBandwidth();
myChart.data.datasets[2].data = calculateEfficiencyFactor();
myChart.data.datasets[3].data = calculateRadiationResistance();
myChart.data.datasets[4].data = calculateInductiveReactance();
myChart.data.datasets[5].data = calculateLossResistance();
myChart.data.datasets[6].data = calculateQualityFactor();
myChart.data.datasets[7].data = calculateCapacitorVoltage();
First check in
2020-10-17 04:04:13 +00:00
myChart.update();
}
conductor_diameter_slider.oninput = function() {
conductor_diameter_value.innerHTML = this.value;
Big phone layout updates.
2020-10-21 03:39:46 +00:00
drawFrontDesign();
drawSideDesign();
Added capacitor voltage
2020-10-18 13:15:40 +00:00
myChart.data.datasets[0].data = calculateTuningCapacitor();
myChart.data.datasets[1].data = calculateBandwidth();
myChart.data.datasets[2].data = calculateEfficiencyFactor();
myChart.data.datasets[3].data = calculateRadiationResistance();
myChart.data.datasets[4].data = calculateInductiveReactance();
myChart.data.datasets[5].data = calculateLossResistance();
myChart.data.datasets[6].data = calculateQualityFactor();
myChart.data.datasets[7].data = calculateCapacitorVoltage();
First check in
2020-10-17 04:04:13 +00:00
myChart.update();
}
loop_turns_slider.oninput = function() {
loop_turns_value.innerHTML = this.value;
Big phone layout updates.
2020-10-21 03:39:46 +00:00
drawSideDesign();
Added capacitor voltage
2020-10-18 13:15:40 +00:00
myChart.data.datasets[0].data = calculateTuningCapacitor();
myChart.data.datasets[1].data = calculateBandwidth();
myChart.data.datasets[2].data = calculateEfficiencyFactor();
myChart.data.datasets[3].data = calculateRadiationResistance();
myChart.data.datasets[4].data = calculateInductiveReactance();
myChart.data.datasets[5].data = calculateLossResistance();
myChart.data.datasets[6].data = calculateQualityFactor();
myChart.data.datasets[7].data = calculateCapacitorVoltage();
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
myChart.update();
}
loop_spacing_slider.oninput = function() {
loop_spacing_value.innerHTML = loop_spacing_slider.value;
Big phone layout updates.
2020-10-21 03:39:46 +00:00
drawSideDesign();
Added capacitor voltage
2020-10-18 13:15:40 +00:00
myChart.data.datasets[0].data = calculateTuningCapacitor();
myChart.data.datasets[1].data = calculateBandwidth();
myChart.data.datasets[2].data = calculateEfficiencyFactor();
myChart.data.datasets[3].data = calculateRadiationResistance();
myChart.data.datasets[4].data = calculateInductiveReactance();
myChart.data.datasets[5].data = calculateLossResistance();
myChart.data.datasets[6].data = calculateQualityFactor();
myChart.data.datasets[7].data = calculateCapacitorVoltage();
First check in
2020-10-17 04:04:13 +00:00
myChart.update();
}
transmit_power_slider.oninput = function() {
transmit_power_value.innerHTML = this.value;
Added capacitor voltage
2020-10-18 13:15:40 +00:00
myChart.data.datasets[7].data = calculateCapacitorVoltage();
myChart.update();
First check in
2020-10-17 04:04:13 +00:00
}
Phone layout updates.
2020-10-20 01:19:12 +00:00
Update magloop.html
2020-10-19 20:15:35 +00:00
window.onresize = function() {
Big phone layout updates.
2020-10-21 03:39:46 +00:00
drawFrontDesign();
drawSideDesign();
Update magloop.html
2020-10-19 20:15:35 +00:00
}
Phone layout updates.
2020-10-20 01:19:12 +00:00
Update magloop.html Removed "Height above ground" slider. Will add it back once radiation pattern solver is working.
2020-10-19 01:45:36 +00:00
/*
First check in
2020-10-17 04:04:13 +00:00
heightAboveGround_slider.oninput = function() {
heightAboveGround_value.innerHTML = this.value;
}
Update magloop.html Removed "Height above ground" slider. Will add it back once radiation pattern solver is working.
2020-10-19 01:45:36 +00:00
*/
First check in
2020-10-17 04:04:13 +00:00
Big phone layout updates.
2020-10-21 03:39:46 +00:00
const afront_canvas = document.getElementById("antennaFront2D");
const fctx = afront_canvas.getContext('2d');
function drawFrontDesign() {
const win_width = document.getElementById("antenna-front-container").offsetWidth;
const win_height = document.getElementById("antenna-front-container").offsetHeight;
//const win_width = afront_canvas.getBoundingClientRect().width;
//const win_height = afront_canvas.getBoundingClientRect().height;
afront_canvas.width = win_width;
afront_canvas.height = win_height-6;
Drawing schematic
2020-10-19 10:01:28 +00:00
Big phone layout updates.
2020-10-21 03:39:46 +00:00
fctx.clearRect(0, 0, win_width, win_height);
Phone layout updates
2020-10-21 04:10:02 +00:00
const loop_radius = win_width < win_height ? 0.40 * win_width : 0.40 * win_height; // 100; // loop_diameter_slider.value * 80;
Drawing schematic
2020-10-19 10:01:28 +00:00
const cond_radius = conductor_diameter_slider.value / 4;
Phone layout updates.
2020-10-20 01:19:12 +00:00
const loopx = win_width/2;
Big phone layout updates.
2020-10-21 03:39:46 +00:00
const loopy = win_height/2;
Optimising layout
2020-10-19 12:33:01 +00:00
Drawing schematic
2020-10-19 10:01:28 +00:00
// Draw loop:
Big phone layout updates.
2020-10-21 03:39:46 +00:00
fctx.beginPath();
fctx.arc(loopx, loopy, loop_radius + cond_radius, 0.5 * Math.PI + 0.02, 0.5 * Math.PI - 0.02, false);
fctx.arc(loopx, loopy, loop_radius - cond_radius, 0.5 * Math.PI - 0.025, 0.5 * Math.PI + 0.025, true);
fctx.closePath();
fctx.fill();
Optimising layout
2020-10-19 12:33:01 +00:00
Drawing schematic
2020-10-19 10:01:28 +00:00
// Draw cap:
Big phone layout updates.
2020-10-21 03:39:46 +00:00
fctx.lineWidth = 3;
fctx.beginPath();
fctx.moveTo(loopx - 3, loopy + loop_radius - 3*cond_radius);
fctx.lineTo(loopx - 3, loopy + loop_radius + 3*cond_radius);
fctx.moveTo(loopx + 3, loopy + loop_radius - 3*cond_radius);
fctx.lineTo(loopx + 3, loopy + loop_radius + 3*cond_radius);
fctx.stroke();
fctx.lineWidth = 1;
Optimising layout
2020-10-19 12:33:01 +00:00
Big phone layout updates.
2020-10-21 03:39:46 +00:00
// Draw coupling loop:
fctx.beginPath();
fctx.arc(loopx, loopy - (loop_radius - loop_radius/5) + cond_radius , loop_radius/5, 0, 2*Math.PI, true);
fctx.stroke();
Drawing schematic
2020-10-19 10:01:28 +00:00
// Draw loop diameter arrow:
Big phone layout updates.
2020-10-21 03:39:46 +00:00
fctx.beginPath();
fctx.moveTo(loopx - loop_radius, loopy);
fctx.lineTo(loopx - loop_radius + 2*cond_radius, loopy - 2*cond_radius);
fctx.lineTo(loopx - loop_radius + 2*cond_radius, loopy + 2*cond_radius);
fctx.lineTo(loopx - loop_radius, loopy);
fctx.lineTo(loopx + loop_radius, loopy);
fctx.lineTo(loopx + loop_radius - 2*cond_radius, loopy + 2*cond_radius);
fctx.lineTo(loopx + loop_radius - 2*cond_radius, loopy - 2*cond_radius);
fctx.lineTo(loopx + loop_radius, loopy);
fctx.stroke();
Update magloop.html Added spacing value.
2020-10-19 12:00:47 +00:00
Drawing schematic
2020-10-19 10:01:28 +00:00
// Write loop diameter symbol:
Phone layout updates
2020-10-21 04:10:02 +00:00
fctx.font = "12px arial";
Big phone layout updates.
2020-10-21 03:39:46 +00:00
fctx.textAlign = "center";
Update magloop.html
2020-10-19 20:15:35 +00:00
const dia = 1.0 * loop_diameter_slider.value;
Big phone layout updates.
2020-10-21 03:39:46 +00:00
fctx.fillText("\u2300a = " + dia.toPrecision(3).toString() + "m", loopx, loopy - 8);
Update magloop.html Added spacing value.
2020-10-19 12:00:47 +00:00
Drawing schematic
2020-10-19 10:01:28 +00:00
// Draw conductor diameter arrow:
Big phone layout updates.
2020-10-21 03:39:46 +00:00
fctx.beginPath();
Update magloop.html
2020-10-19 20:15:35 +00:00
var p1x = loopx + 0.4 * (loop_radius - cond_radius);
var p1y = loopy + 0.4 * (loop_radius - cond_radius);
var p2x = loopx + 0.707 * (loop_radius - cond_radius);
var p2y = loopy + 0.707 * (loop_radius - cond_radius);
var p3x = loopx + 0.707 * (loop_radius - cond_radius) - 3*cond_radius;
var p3y = loopy + 0.707 * (loop_radius - cond_radius);
var p4x = loopx + 0.707 * (loop_radius - cond_radius);
var p4y = loopy + 0.707 * (loop_radius - cond_radius) - 3*cond_radius;
Big phone layout updates.
2020-10-21 03:39:46 +00:00
fctx.moveTo(p1x, p1y);
fctx.lineTo(p2x, p2y);
fctx.lineTo(p3x, p3y);
fctx.lineTo(p4x, p4y);
fctx.lineTo(p2x, p2y);
Optimising layout
2020-10-19 12:33:01 +00:00
Update magloop.html
2020-10-19 20:15:35 +00:00
p1x = loopx + 1.0 * (loop_radius + cond_radius);
p1y = loopy + 1.0 * (loop_radius + cond_radius);
p2x = loopx + 0.707 * (loop_radius + cond_radius);
p2y = loopy + 0.707 * (loop_radius + cond_radius);
p3x = loopx + 0.707 * (loop_radius + cond_radius) + 3*cond_radius;
p3y = loopy + 0.707 * (loop_radius + cond_radius);
p4x = loopx + 0.707 * (loop_radius + cond_radius);
p4y = loopy + 0.707 * (loop_radius + cond_radius) + 3*cond_radius;
Big phone layout updates.
2020-10-21 03:39:46 +00:00
fctx.moveTo(p1x, p1y);
fctx.lineTo(p2x, p2y);
fctx.lineTo(p3x, p3y);
fctx.lineTo(p4x, p4y);
fctx.lineTo(p2x, p2y);
fctx.stroke();
Update magloop.html
2020-10-19 20:15:35 +00:00
p1x = loopx + 0.4 * (loop_radius - cond_radius);
p1y = loopy + 0.4 * (loop_radius - cond_radius) - 5;
Phone layout updates
2020-10-21 04:10:02 +00:00
//fctx.textAlign = "right";
Big phone layout updates.
2020-10-21 03:39:46 +00:00
fctx.fillText("\u2300b = " + conductor_diameter_slider.value.toString() + "mm", p1x, p1y);
}
const aside_canvas = document.getElementById("antennaSide2D");
const sctx = aside_canvas.getContext('2d');
function drawSideDesign() {
const win_width = document.getElementById("antenna-side-container").offsetWidth;
const win_height = document.getElementById("antenna-side-container").offsetHeight;
//const win_width = aside_canvas.getBoundingClientRect().width;
//const win_height = aside_canvas.getBoundingClientRect().height;
Phone layout updates
2020-10-21 04:10:02 +00:00
//console.log(win_width, win_height);
Big phone layout updates.
2020-10-21 03:39:46 +00:00
aside_canvas.width = win_width;
aside_canvas.height = win_height-6;
//const win_width = aside_canvas.width;
//const win_height = aside_canvas.height;
sctx.clearRect(0, 0, win_width, win_height);
Update magloop.html Adding multiple loops to graphic.
2020-10-19 10:49:07 +00:00
Big phone layout updates.
2020-10-21 03:39:46 +00:00
const cond_radius = conductor_diameter_slider.value / 4;
Update magloop.html Adding multiple loops to graphic.
2020-10-19 10:49:07 +00:00
const cond_spacing = 2 * cond_radius * loop_spacing_slider.value;
Phone layout updates.
2020-10-20 01:19:12 +00:00
const start_x = win_width/2 - loop_turns_slider.value * cond_spacing * 0.5;
Big phone layout updates.
2020-10-21 03:39:46 +00:00
const top_y = win_height * 0.2;
const bot_y = win_height * 0.8;
Update magloop.html Adding multiple loops to graphic.
2020-10-19 10:49:07 +00:00
for (let i = 0; i < loop_turns_slider.value; i++) {
Big phone layout updates.
2020-10-21 03:39:46 +00:00
sctx.beginPath();
sctx.arc(start_x + i * cond_spacing, bot_y, cond_radius, 0, Math.PI);
sctx.arc(start_x + cond_spacing * 0.5 + i * cond_spacing, top_y, cond_radius, Math.PI, 0);
sctx.lineTo(start_x + i * cond_spacing + cond_radius, bot_y);
sctx.fill();
sctx.beginPath();
sctx.moveTo(start_x + cond_spacing * 0.5 + i * cond_spacing + cond_radius, top_y);
sctx.lineTo(start_x + (i+1) * cond_spacing + cond_radius, bot_y);
sctx.arc(start_x + (i+1) * cond_spacing, bot_y, cond_radius, 0, Math.PI, false);
sctx.lineTo(start_x + cond_spacing * 0.5 + i * cond_spacing - cond_radius, top_y);
sctx.stroke();
Update magloop.html Adding multiple loops to graphic.
2020-10-19 10:49:07 +00:00
}
Update magloop.html Added spacing value.
2020-10-19 12:00:47 +00:00
// Draw left spacing arrow:
Big phone layout updates.
2020-10-21 03:39:46 +00:00
const dim_y = win_height * 0.9;
sctx.beginPath();
sctx.moveTo(start_x - 30, dim_y);
sctx.lineTo(start_x, dim_y);
sctx.lineTo(start_x - 10, dim_y + 10)
sctx.lineTo(start_x - 10, dim_y - 10)
sctx.lineTo(start_x, dim_y);
sctx.moveTo(start_x, dim_y - 10);
sctx.lineTo(start_x, dim_y + 10);
sctx.stroke();
Update magloop.html Added spacing value.
2020-10-19 12:00:47 +00:00
// Draw right spacing arrow:
Big phone layout updates.
2020-10-21 03:39:46 +00:00
sctx.beginPath();
sctx.moveTo(start_x + cond_spacing + 30, dim_y);
sctx.lineTo(start_x + cond_spacing, dim_y);
sctx.lineTo(start_x + cond_spacing + 10, dim_y + 10)
sctx.lineTo(start_x + cond_spacing + 10, dim_y - 10)
sctx.lineTo(start_x + cond_spacing, dim_y);
sctx.moveTo(start_x + cond_spacing, dim_y - 10);
sctx.lineTo(start_x + cond_spacing, dim_y + 10);
sctx.stroke();
Optimising layout
2020-10-19 12:33:01 +00:00
// Draw turns number text:
Big phone layout updates.
2020-10-21 03:39:46 +00:00
sctx.font = "14px arial";
sctx.textAlign = "center";
sctx.fillText("N = " + loop_turns_slider.value.toString(), win_width/2, win_height * 0.1);
Optimising layout
2020-10-19 12:33:01 +00:00
Update magloop.html Added spacing value.
2020-10-19 12:00:47 +00:00
// Draw spacing text:
Big phone layout updates.
2020-10-21 03:39:46 +00:00
sctx.textAlign = "left";
Update magloop.html Added spacing value.
2020-10-19 12:00:47 +00:00
const spc = loop_spacing_slider.value * conductor_diameter_slider.value;
Phone layout updates
2020-10-21 04:10:02 +00:00
sctx.fillText("c = " + spc.toPrecision(3).toString() + "mm", start_x + cond_spacing + 35, dim_y + 5);
Drawing schematic
2020-10-19 10:01:28 +00:00
}
Big phone layout updates.
2020-10-21 03:39:46 +00:00
drawFrontDesign();
drawSideDesign();
Drawing schematic
2020-10-19 10:01:28 +00:00
Update magloop.html
2020-10-19 20:15:35 +00:00
const chartCanvas = document.getElementById("chartCanvas");
const chartCanvasContext = chartCanvas.getContext('2d');
First check in
2020-10-17 04:04:13 +00:00
var myChart = new Chart(chartCanvasContext, {
type: 'line',
data: {
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
datasets: [
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
{
Phone layout updates
2020-10-21 04:10:02 +00:00
label: 'Tuning Cap (pF)',
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
fill: false,
borderColor: 'green',
backgroundColor: 'green',
data: calculateTuningCapacitor(),
borderWidth: 1,
yAxisID: 'pfID'
},
{
Tidy up legend and tooltip
2020-10-18 23:42:27 +00:00
label: 'BW (kHz)',
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
fill: false,
borderColor: 'brown',
backgroundColor: 'brown',
data: calculateBandwidth(),
borderWidth: 1,
yAxisID: 'bwID'
},
{
Tidy up legend and tooltip
2020-10-18 23:42:27 +00:00
label: 'Efficiency (%)',
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
fill: false,
borderColor: 'black',
backgroundColor: 'black',
data: calculateEfficiencyFactor(),
borderWidth: 1,
yAxisID: 'effID'
},
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
{
Phone layout updates
2020-10-21 04:10:02 +00:00
label: 'R-radiation (\u03A9)',
First check in
2020-10-17 04:04:13 +00:00
fill: false,
borderColor: 'red',
backgroundColor: 'red',
data: calculateRadiationResistance(),
borderWidth: 1,
yAxisID: 'mohmsID'
},
{
Tidy up legend and tooltip
2020-10-18 23:42:27 +00:00
label: 'Reactance (j\u03A9)',
First check in
2020-10-17 04:04:13 +00:00
fill: false,
borderColor: 'blue',
backgroundColor: 'blue',
data: calculateInductiveReactance(),
borderWidth: 1,
yAxisID: 'ohmsID'
},
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
{
Phone layout updates
2020-10-21 04:10:02 +00:00
label: 'R-loss (\u03A9)',
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
fill: false,
borderColor: 'orange',
backgroundColor: 'orange',
data: calculateLossResistance(),
borderWidth: 1,
yAxisID: 'mohmsID'
},
{
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
label: 'Q',
Phone trial
2020-10-18 06:16:51 +00:00
fill: false,
borderColor: 'purple',
backgroundColor: 'purple',
data: calculateQualityFactor(),
borderWidth: 1,
yAxisID: 'qID'
Added capacitor voltage
2020-10-18 13:15:40 +00:00
},
{
Tidy up legend and tooltip
2020-10-18 23:42:27 +00:00
label: 'V cap (kV)',
Added capacitor voltage
2020-10-18 13:15:40 +00:00
fill: false,
borderColor: 'rgb(150, 150, 0)',
backgroundColor: 'rgb(150, 150, 0)',
data: calculateCapacitorVoltage(),
borderWidth: 1,
yAxisID: 'vID'
First check in
2020-10-17 04:04:13 +00:00
}]
},
options: {
Update magloop.html
2020-10-21 04:20:10 +00:00
responsive: true,
Phone layout updates.
2020-10-20 01:19:12 +00:00
maintainAspectRatio: false,
First check in
2020-10-17 04:04:13 +00:00
scales: {
xAxes: [{
type: 'linear',
position: 'bottom',
display: true,
scaleLabel: {
display: true,
labelString: 'Frequency (MHz)'
}
}],
yAxes: [{
type: 'linear',
Update magloop.html Made axes 'auto' so they only display when relevant data is available.
2020-10-19 01:37:15 +00:00
display: 'auto',
First check in
2020-10-17 04:04:13 +00:00
scaleLabel: {
display: true,
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
labelString: 'Efficiency %',
fontColor: 'black',
First check in
2020-10-17 04:04:13 +00:00
fontStyle: 'bold'
},
Phone layout updates.
2020-10-20 01:19:12 +00:00
ticks: {
min: 0,
max: 100,
},
First check in
2020-10-17 04:04:13 +00:00
position: 'left',
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
id: 'effID'
},{
First check in
2020-10-17 04:04:13 +00:00
type: 'linear',
Update magloop.html Made axes 'auto' so they only display when relevant data is available.
2020-10-19 01:37:15 +00:00
display: 'auto',
First check in
2020-10-17 04:04:13 +00:00
scaleLabel: {
display: true,
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
labelString: 'BW kHz',
fontColor: 'brown',
First check in
2020-10-17 04:04:13 +00:00
fontStyle: 'bold'
},
position: 'left',
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
id: 'bwID'
First check in
2020-10-17 04:04:13 +00:00
},{
type: 'linear',
Update magloop.html Made axes 'auto' so they only display when relevant data is available.
2020-10-19 01:37:15 +00:00
display: 'auto',
First check in
2020-10-17 04:04:13 +00:00
scaleLabel: {
display: true,
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
labelString: '\u03A9',
fontColor: 'red',
First check in
2020-10-17 04:04:13 +00:00
fontStyle: 'bold'
},
position: 'right',
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
id: 'mohmsID',
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
},{
type: 'linear',
Update magloop.html Made axes 'auto' so they only display when relevant data is available.
2020-10-19 01:37:15 +00:00
display: 'auto',
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
scaleLabel: {
display: true,
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
labelString: 'pF',
fontColor: 'green',
Phone test Added efficiency and R loss.
2020-10-18 04:03:54 +00:00
fontStyle: 'bold'
},
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
position: 'left',
id: 'pfID'
Phone trial
2020-10-18 06:16:51 +00:00
},{
type: 'linear',
Update magloop.html Made axes 'auto' so they only display when relevant data is available.
2020-10-19 01:37:15 +00:00
display: 'auto',
Phone trial
2020-10-18 06:16:51 +00:00
scaleLabel: {
display: true,
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
labelString: 'j\u03A9',
fontColor: 'blue',
Phone trial
2020-10-18 06:16:51 +00:00
fontStyle: 'bold'
},
position: 'right',
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
id: 'ohmsID'
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
},{
type: 'linear',
Update magloop.html Made axes 'auto' so they only display when relevant data is available.
2020-10-19 01:37:15 +00:00
display: 'auto',
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
scaleLabel: {
display: true,
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
labelString: 'Q',
fontColor: 'purple',
Clean ups. Added Q and BW.
2020-10-18 11:41:31 +00:00
fontStyle: 'bold'
},
Max circumference in 20pc of lambda
2020-10-18 12:27:18 +00:00
position: 'right',
id: 'qID'
Added capacitor voltage
2020-10-18 13:15:40 +00:00
},{
type: 'linear',
Update magloop.html Made axes 'auto' so they only display when relevant data is available.
2020-10-19 01:37:15 +00:00
display: 'auto',
Added capacitor voltage
2020-10-18 13:15:40 +00:00
scaleLabel: {
display: true,
Tidy up legend and tooltip
2020-10-18 23:42:27 +00:00
labelString: 'kV',
Added capacitor voltage
2020-10-18 13:15:40 +00:00
fontColor: 'rgb(150, 150, 0)',
fontStyle: 'bold'
},
position: 'right',
id: 'vID'
First check in
2020-10-17 04:04:13 +00:00
}]
},
showLines: true
}
});
</script>
Initial commit
2020-10-08 07:21:58 +00:00
</html>