kopia lustrzana https://github.com/miguelvaca/vk3cpu
First check in
rodzic
ca2d6a6043
commit
e7f04c0807
|
@ -0,0 +1,15 @@
|
|||
{
|
||||
// Use IntelliSense to learn about possible attributes.
|
||||
// Hover to view descriptions of existing attributes.
|
||||
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
|
||||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
{
|
||||
"type": "pwa-chrome",
|
||||
"request": "launch",
|
||||
"name": "Launch Chrome against localhost",
|
||||
"url": "http://localhost:8080",
|
||||
"webRoot": "${workspaceFolder}"
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,265 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>VK3CPU Magloop Solver</title>
|
||||
<link rel="stylesheet" href="magloop.css">
|
||||
</head>
|
||||
<body>
|
||||
<header>Miguel VK3CPU - Magloop Antenna Calculator</header>
|
||||
<canvas id="3Dantenna" height="200px">
|
||||
3D Antenna Radiation Pattern Canvas
|
||||
</canvas>
|
||||
<canvas id="chartCanvas" height="200px">
|
||||
2D Chart Canvas
|
||||
</canvas>
|
||||
<section class="controls">
|
||||
<div>
|
||||
<label for="loop_diameter_slider">Loop diameter (2a):</label>
|
||||
<input type="range" id="loop_diameter_slider" min="0.5" max="3.0" value="1.0" step="0.1">
|
||||
<span id="loop_diameter_value"></span> (m)
|
||||
</div>
|
||||
<div>
|
||||
<label for="conductor_diameter_slider">Conductor diameter (2b):</label>
|
||||
<input type="range" id="conductor_diameter_slider" min="5" max="30" value="19" step="1">
|
||||
<span id="conductor_diameter_value"></span> (mm)
|
||||
</div>
|
||||
<div>
|
||||
<label for="loop_turns_slider">Loop turns:</label>
|
||||
<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>
|
||||
<label for="transmit_power_slider">Transmit Power:</label>
|
||||
<input type="range" id="transmit_power_slider" min="25" max="1500" value="400" step="25">
|
||||
<span id="transmit_power_value"></span> (W)
|
||||
</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>
|
||||
</section>
|
||||
<footer>
|
||||
<p>Footer</p>FFF
|
||||
</footer>
|
||||
</body>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>
|
||||
<script>
|
||||
const frequencies = [
|
||||
1.8, 3.5, 7.0, 10.1, 14.0, 18.068, 21.0, 24.89, 28.0
|
||||
];
|
||||
|
||||
var loop_diameter_slider = document.getElementById("loop_diameter_slider");
|
||||
var loop_diameter_value = document.getElementById("loop_diameter_value");
|
||||
loop_diameter_value.innerHTML = loop_diameter_slider.value;
|
||||
|
||||
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;
|
||||
|
||||
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;
|
||||
|
||||
var heightAboveGround_slider = document.getElementById("heightAboveGround_slider");
|
||||
var heightAboveGround_value = document.getElementById("heightAboveGround_value");
|
||||
heightAboveGround_value.innerHTML = heightAboveGround_slider.value;
|
||||
|
||||
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;
|
||||
}
|
||||
|
||||
function calculateRadiationResistance() {
|
||||
var retval = [];
|
||||
const n_turns = loop_turns_slider.value;
|
||||
const k = 20.0 * (Math.PI ** 2.0);
|
||||
frequencies.forEach(freq => {
|
||||
const wavelength = 3e8 / (freq * 1e6);
|
||||
const l = (Math.PI * loop_diameter_slider.value) / wavelength;
|
||||
if (l <= 0.25) {
|
||||
const rr = (n_turns ** 2.0) * k * (l ** 4.0);
|
||||
retval.push({x:freq, y:rr});
|
||||
}
|
||||
});
|
||||
return retval;
|
||||
}
|
||||
|
||||
function calculateInductiveReactance() {
|
||||
var retval = [];
|
||||
const inductance = getInductance();
|
||||
frequencies.forEach(freq => {
|
||||
const wavelength = 3e8 / (freq * 1e6);
|
||||
const l = (Math.PI * loop_diameter_slider.value) / wavelength;
|
||||
if (l <= 0.25) {
|
||||
const reactance = 2.0 * Math.PI * (freq * 1e6) * inductance;
|
||||
retval.push({x:freq, y:reactance});
|
||||
}
|
||||
});
|
||||
return retval;
|
||||
}
|
||||
|
||||
function calculateTuningCapacitor() {
|
||||
var retval = [];
|
||||
const inductance = getInductance();
|
||||
frequencies.forEach(freq => {
|
||||
const wavelength = 3e8 / (freq * 1e6);
|
||||
const l = (Math.PI * loop_diameter_slider.value) / wavelength;
|
||||
if (l <= 0.25) {
|
||||
const reactance = 2.0 * Math.PI * freq * 1e6 * inductance;
|
||||
const capacitor = 1e12 / (2.0 * Math.PI * freq * 1e6 * reactance);
|
||||
retval.push({x:freq, y:capacitor});
|
||||
}
|
||||
});
|
||||
return retval;
|
||||
}
|
||||
|
||||
function calculateLossResistance() {
|
||||
var retval = [];
|
||||
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;
|
||||
const k = (n_turns * a_coil_radius / b_conductor_radius);
|
||||
const cu_sigma = 58e6;
|
||||
frequencies.forEach(freq => {
|
||||
const Rs = Math.sqrt(Math.PI * freq * 1e6 * mu0 / cu_sigma);
|
||||
// TODO *** finish this! Find eqn for Rp / R0;
|
||||
retval.push({x:freq, y:capacitor});
|
||||
});
|
||||
return retval;
|
||||
}
|
||||
|
||||
function calculateQualityFactor() {
|
||||
var retval = [];
|
||||
return retval;
|
||||
}
|
||||
|
||||
loop_diameter_slider.oninput = function() {
|
||||
loop_diameter_value.innerHTML = this.value;
|
||||
myChart.data.datasets[0].data = calculateRadiationResistance();
|
||||
myChart.data.datasets[1].data = calculateInductiveReactance();
|
||||
myChart.data.datasets[2].data = calculateTuningCapacitor();
|
||||
myChart.update();
|
||||
}
|
||||
|
||||
conductor_diameter_slider.oninput = function() {
|
||||
conductor_diameter_value.innerHTML = this.value;
|
||||
myChart.data.datasets[0].data = calculateRadiationResistance();
|
||||
myChart.data.datasets[1].data = calculateInductiveReactance();
|
||||
// myChart.data.datasets[2].data = calculateTuningCapacitor();
|
||||
myChart.update();
|
||||
}
|
||||
|
||||
loop_turns_slider.oninput = function() {
|
||||
loop_turns_value.innerHTML = this.value;
|
||||
myChart.data.datasets[0].data = calculateRadiationResistance();
|
||||
myChart.data.datasets[1].data = calculateInductiveReactance();
|
||||
myChart.data.datasets[2].data = calculateTuningCapacitor();
|
||||
myChart.update();
|
||||
}
|
||||
|
||||
transmit_power_slider.oninput = function() {
|
||||
transmit_power_value.innerHTML = this.value;
|
||||
}
|
||||
|
||||
heightAboveGround_slider.oninput = function() {
|
||||
heightAboveGround_value.innerHTML = this.value;
|
||||
}
|
||||
|
||||
const chartCanvasContext = document.getElementById("chartCanvas").getContext('2d');
|
||||
console.log(chartCanvasContext);
|
||||
|
||||
var myChart = new Chart(chartCanvasContext, {
|
||||
type: 'line',
|
||||
data: {
|
||||
datasets: [{
|
||||
label: 'Radiation Resistance \u03A9',
|
||||
fill: false,
|
||||
borderColor: 'red',
|
||||
backgroundColor: 'red',
|
||||
data: calculateRadiationResistance(),
|
||||
borderWidth: 1,
|
||||
yAxisID: 'mohmsID'
|
||||
},
|
||||
{
|
||||
label: 'Inductive Reactance \u03A9',
|
||||
fill: false,
|
||||
borderColor: 'blue',
|
||||
backgroundColor: 'blue',
|
||||
data: calculateInductiveReactance(),
|
||||
borderWidth: 1,
|
||||
yAxisID: 'ohmsID'
|
||||
},
|
||||
{
|
||||
label: 'Tuning Capacitance',
|
||||
fill: false,
|
||||
borderColor: 'green',
|
||||
backgroundColor: 'green',
|
||||
data: calculateTuningCapacitor(),
|
||||
borderWidth: 1,
|
||||
yAxisID: 'pfID'
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
scales: {
|
||||
xAxes: [{
|
||||
type: 'linear',
|
||||
position: 'bottom',
|
||||
display: true,
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'Frequency (MHz)'
|
||||
}
|
||||
}],
|
||||
yAxes: [{
|
||||
type: 'linear',
|
||||
display: true,
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'Ohms \u03A9',
|
||||
fontColor: 'blue',
|
||||
fontStyle: 'bold'
|
||||
},
|
||||
position: 'left',
|
||||
id: 'ohmsID'
|
||||
},
|
||||
{
|
||||
type: 'linear',
|
||||
display: true,
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: '\u03A9',
|
||||
fontColor: 'red',
|
||||
fontStyle: 'bold'
|
||||
},
|
||||
position: 'left',
|
||||
id: 'mohmsID'
|
||||
},{
|
||||
type: 'linear',
|
||||
display: true,
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'pF',
|
||||
fontColor: 'green',
|
||||
fontStyle: 'bold'
|
||||
},
|
||||
position: 'right',
|
||||
id: 'pfID'
|
||||
}]
|
||||
},
|
||||
showLines: true
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</html>
|
|
@ -0,0 +1,57 @@
|
|||
body {
|
||||
background: rgb(196, 122, 77);
|
||||
margin: 0px;
|
||||
}
|
||||
header {
|
||||
background: black;
|
||||
color: white;
|
||||
font-family: 'Courier New', Courier, monospace;
|
||||
text-align: center;
|
||||
}
|
||||
canvas {
|
||||
background: white;
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
margin: auto;
|
||||
border: 3px solid #ff0000;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
section.spreadsheet {
|
||||
background: grey;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
section.spreadsheet div {
|
||||
background: lightblue;
|
||||
display: inline-block;
|
||||
margin: auto;
|
||||
margin-top: 0%;
|
||||
width: auto;
|
||||
text-align: center;
|
||||
}
|
||||
section.spreadsheet div.first-col {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
section.controls div {
|
||||
background:yellow;
|
||||
}
|
||||
|
||||
section.controls div label {
|
||||
background:rgb(94, 245, 94);
|
||||
display: inline-block;
|
||||
width: 180px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
section.controls div input {
|
||||
background:lightsalmon;
|
||||
display: inline-block;
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
footer {
|
||||
background: white;
|
||||
}
|
327
magloop.html
327
magloop.html
|
@ -1,66 +1,265 @@
|
|||
<!doctype html>
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>jQuery UI Slider - Multiple sliders</title>
|
||||
<link rel="stylesheet" href="../jquery-ui-1.12.1/jquery-ui.css">
|
||||
<script src="../jquery-ui-1.12.1/external/jquery/jquery.js"></script>
|
||||
<script src="../jquery-ui-1.12.1/jquery-ui.js"></script>
|
||||
<style>
|
||||
#eq > span {
|
||||
height:120px; float:left; margin:15px
|
||||
}
|
||||
</style>
|
||||
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
|
||||
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
|
||||
<script>
|
||||
$( function() {
|
||||
// setup master volume
|
||||
$( "#master" ).slider({
|
||||
value: 60,
|
||||
orientation: "horizontal",
|
||||
range: "min",
|
||||
animate: true
|
||||
});
|
||||
// setup graphic EQ
|
||||
$( "#eq > span" ).each(function() {
|
||||
// read initial values from markup and remove that
|
||||
var value = parseInt( $( this ).text(), 10 );
|
||||
$( this ).empty().slider({
|
||||
value: value,
|
||||
range: "min",
|
||||
animate: true,
|
||||
orientation: "vertical"
|
||||
});
|
||||
});
|
||||
} );
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<p class="ui-state-default ui-corner-all ui-helper-clearfix" style="padding:4px;">
|
||||
<span class="ui-icon ui-icon-volume-on" style="float:left; margin:-2px 5px 0 0;"></span>
|
||||
Master volume
|
||||
</p>
|
||||
|
||||
<div id="master" style="width:260px; margin:15px;"></div>
|
||||
|
||||
<p class="ui-state-default ui-corner-all" style="padding:4px;margin-top:4em;">
|
||||
<span class="ui-icon ui-icon-signal" style="float:left; margin:-2px 5px 0 0;"></span>
|
||||
Graphic EQ
|
||||
</p>
|
||||
|
||||
<div id="eq">
|
||||
<span>88</span>
|
||||
<span>77</span>
|
||||
<span>55</span>
|
||||
<span>33</span>
|
||||
<span>40</span>
|
||||
<span>45</span>
|
||||
<span>70</span>
|
||||
</div>
|
||||
|
||||
|
||||
</body>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>VK3CPU Magloop Solver</title>
|
||||
<link rel="stylesheet" href="magloop.css">
|
||||
</head>
|
||||
<body>
|
||||
<header>Miguel VK3CPU - Magloop Antenna Calculator</header>
|
||||
<canvas id="3Dantenna" height="200px">
|
||||
3D Antenna Radiation Pattern Canvas
|
||||
</canvas>
|
||||
<canvas id="chartCanvas" height="200px">
|
||||
2D Chart Canvas
|
||||
</canvas>
|
||||
<section class="controls">
|
||||
<div>
|
||||
<label for="loop_diameter_slider">Loop diameter (2a):</label>
|
||||
<input type="range" id="loop_diameter_slider" min="0.5" max="3.0" value="1.0" step="0.1">
|
||||
<span id="loop_diameter_value"></span> (m)
|
||||
</div>
|
||||
<div>
|
||||
<label for="conductor_diameter_slider">Conductor diameter (2b):</label>
|
||||
<input type="range" id="conductor_diameter_slider" min="5" max="30" value="19" step="1">
|
||||
<span id="conductor_diameter_value"></span> (mm)
|
||||
</div>
|
||||
<div>
|
||||
<label for="loop_turns_slider">Loop turns:</label>
|
||||
<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>
|
||||
<label for="transmit_power_slider">Transmit Power:</label>
|
||||
<input type="range" id="transmit_power_slider" min="25" max="1500" value="400" step="25">
|
||||
<span id="transmit_power_value"></span> (W)
|
||||
</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>
|
||||
</section>
|
||||
<footer>
|
||||
<p>Footer</p>FFF
|
||||
</footer>
|
||||
</body>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>
|
||||
<script>
|
||||
const frequencies = [
|
||||
1.8, 3.5, 7.0, 10.1, 14.0, 18.068, 21.0, 24.89, 28.0
|
||||
];
|
||||
|
||||
var loop_diameter_slider = document.getElementById("loop_diameter_slider");
|
||||
var loop_diameter_value = document.getElementById("loop_diameter_value");
|
||||
loop_diameter_value.innerHTML = loop_diameter_slider.value;
|
||||
|
||||
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;
|
||||
|
||||
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;
|
||||
|
||||
var heightAboveGround_slider = document.getElementById("heightAboveGround_slider");
|
||||
var heightAboveGround_value = document.getElementById("heightAboveGround_value");
|
||||
heightAboveGround_value.innerHTML = heightAboveGround_slider.value;
|
||||
|
||||
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;
|
||||
}
|
||||
|
||||
function calculateRadiationResistance() {
|
||||
var retval = [];
|
||||
const n_turns = loop_turns_slider.value;
|
||||
const k = 20.0 * (Math.PI ** 2.0);
|
||||
frequencies.forEach(freq => {
|
||||
const wavelength = 3e8 / (freq * 1e6);
|
||||
const l = (Math.PI * loop_diameter_slider.value) / wavelength;
|
||||
if (l <= 0.25) {
|
||||
const rr = (n_turns ** 2.0) * k * (l ** 4.0);
|
||||
retval.push({x:freq, y:rr});
|
||||
}
|
||||
});
|
||||
return retval;
|
||||
}
|
||||
|
||||
function calculateInductiveReactance() {
|
||||
var retval = [];
|
||||
const inductance = getInductance();
|
||||
frequencies.forEach(freq => {
|
||||
const wavelength = 3e8 / (freq * 1e6);
|
||||
const l = (Math.PI * loop_diameter_slider.value) / wavelength;
|
||||
if (l <= 0.25) {
|
||||
const reactance = 2.0 * Math.PI * (freq * 1e6) * inductance;
|
||||
retval.push({x:freq, y:reactance});
|
||||
}
|
||||
});
|
||||
return retval;
|
||||
}
|
||||
|
||||
function calculateTuningCapacitor() {
|
||||
var retval = [];
|
||||
const inductance = getInductance();
|
||||
frequencies.forEach(freq => {
|
||||
const wavelength = 3e8 / (freq * 1e6);
|
||||
const l = (Math.PI * loop_diameter_slider.value) / wavelength;
|
||||
if (l <= 0.25) {
|
||||
const reactance = 2.0 * Math.PI * freq * 1e6 * inductance;
|
||||
const capacitor = 1e12 / (2.0 * Math.PI * freq * 1e6 * reactance);
|
||||
retval.push({x:freq, y:capacitor});
|
||||
}
|
||||
});
|
||||
return retval;
|
||||
}
|
||||
|
||||
function calculateLossResistance() {
|
||||
var retval = [];
|
||||
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;
|
||||
const k = (n_turns * a_coil_radius / b_conductor_radius);
|
||||
const cu_sigma = 58e6;
|
||||
frequencies.forEach(freq => {
|
||||
const Rs = Math.sqrt(Math.PI * freq * 1e6 * mu0 / cu_sigma);
|
||||
// TODO *** finish this! Find eqn for Rp / R0;
|
||||
retval.push({x:freq, y:capacitor});
|
||||
});
|
||||
return retval;
|
||||
}
|
||||
|
||||
function calculateQualityFactor() {
|
||||
var retval = [];
|
||||
return retval;
|
||||
}
|
||||
|
||||
loop_diameter_slider.oninput = function() {
|
||||
loop_diameter_value.innerHTML = this.value;
|
||||
myChart.data.datasets[0].data = calculateRadiationResistance();
|
||||
myChart.data.datasets[1].data = calculateInductiveReactance();
|
||||
myChart.data.datasets[2].data = calculateTuningCapacitor();
|
||||
myChart.update();
|
||||
}
|
||||
|
||||
conductor_diameter_slider.oninput = function() {
|
||||
conductor_diameter_value.innerHTML = this.value;
|
||||
myChart.data.datasets[0].data = calculateRadiationResistance();
|
||||
myChart.data.datasets[1].data = calculateInductiveReactance();
|
||||
// myChart.data.datasets[2].data = calculateTuningCapacitor();
|
||||
myChart.update();
|
||||
}
|
||||
|
||||
loop_turns_slider.oninput = function() {
|
||||
loop_turns_value.innerHTML = this.value;
|
||||
myChart.data.datasets[0].data = calculateRadiationResistance();
|
||||
myChart.data.datasets[1].data = calculateInductiveReactance();
|
||||
myChart.data.datasets[2].data = calculateTuningCapacitor();
|
||||
myChart.update();
|
||||
}
|
||||
|
||||
transmit_power_slider.oninput = function() {
|
||||
transmit_power_value.innerHTML = this.value;
|
||||
}
|
||||
|
||||
heightAboveGround_slider.oninput = function() {
|
||||
heightAboveGround_value.innerHTML = this.value;
|
||||
}
|
||||
|
||||
const chartCanvasContext = document.getElementById("chartCanvas").getContext('2d');
|
||||
console.log(chartCanvasContext);
|
||||
|
||||
var myChart = new Chart(chartCanvasContext, {
|
||||
type: 'line',
|
||||
data: {
|
||||
datasets: [{
|
||||
label: 'Radiation Resistance \u03A9',
|
||||
fill: false,
|
||||
borderColor: 'red',
|
||||
backgroundColor: 'red',
|
||||
data: calculateRadiationResistance(),
|
||||
borderWidth: 1,
|
||||
yAxisID: 'mohmsID'
|
||||
},
|
||||
{
|
||||
label: 'Inductive Reactance \u03A9',
|
||||
fill: false,
|
||||
borderColor: 'blue',
|
||||
backgroundColor: 'blue',
|
||||
data: calculateInductiveReactance(),
|
||||
borderWidth: 1,
|
||||
yAxisID: 'ohmsID'
|
||||
},
|
||||
{
|
||||
label: 'Tuning Capacitance',
|
||||
fill: false,
|
||||
borderColor: 'green',
|
||||
backgroundColor: 'green',
|
||||
data: calculateTuningCapacitor(),
|
||||
borderWidth: 1,
|
||||
yAxisID: 'pfID'
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
scales: {
|
||||
xAxes: [{
|
||||
type: 'linear',
|
||||
position: 'bottom',
|
||||
display: true,
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'Frequency (MHz)'
|
||||
}
|
||||
}],
|
||||
yAxes: [{
|
||||
type: 'linear',
|
||||
display: true,
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'Ohms \u03A9',
|
||||
fontColor: 'blue',
|
||||
fontStyle: 'bold'
|
||||
},
|
||||
position: 'left',
|
||||
id: 'ohmsID'
|
||||
},
|
||||
{
|
||||
type: 'linear',
|
||||
display: true,
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: '\u03A9',
|
||||
fontColor: 'red',
|
||||
fontStyle: 'bold'
|
||||
},
|
||||
position: 'left',
|
||||
id: 'mohmsID'
|
||||
},{
|
||||
type: 'linear',
|
||||
display: true,
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'pF',
|
||||
fontColor: 'green',
|
||||
fontStyle: 'bold'
|
||||
},
|
||||
position: 'right',
|
||||
id: 'pfID'
|
||||
}]
|
||||
},
|
||||
showLines: true
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</html>
|
Ładowanie…
Reference in New Issue