add visualizing webpage
This commit is contained in:
52
map_gen.js
Normal file
52
map_gen.js
Normal file
@@ -0,0 +1,52 @@
|
|||||||
|
//import { Bezier } from "./bezierjs/src/bezier.js";
|
||||||
|
|
||||||
|
function map (a, a_min, a_max, b_min, b_max) {
|
||||||
|
return b_min + ((b_max - b_min) / (a_max - a_min)) * (a - a_min);
|
||||||
|
}
|
||||||
|
|
||||||
|
function fmt (x) {
|
||||||
|
return x.toLocaleString("en-US", {
|
||||||
|
minimumFractionDigits: 2,
|
||||||
|
maximumFractionDigits: 2,
|
||||||
|
useGrouping: false
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function duty_cycle_map (x) {
|
||||||
|
//const out = Math.log10(x + 1) * 50;
|
||||||
|
//const out = x;
|
||||||
|
x = x / 100;
|
||||||
|
//let y = 1 - Math.pow(1 - x, 5);
|
||||||
|
//let y = x < 0.5 ? 4 * x * x * x : 1 - Math.pow(-2 * x + 2, 3) / 2;
|
||||||
|
//let y = Math.sqrt(1 - Math.pow(x - 1, 2));
|
||||||
|
//let y = x < 0.5 ? 2 * x * x : 1 - Math.pow(-2 * x + 2, 2) / 2;
|
||||||
|
let y = Math.sin((x * Math.PI) / 2);
|
||||||
|
y = map(y, 0, 1, 47, 100);
|
||||||
|
return y
|
||||||
|
}
|
||||||
|
|
||||||
|
function freq_map (x) {
|
||||||
|
x = x / 100;
|
||||||
|
//let y = 1 - (1 - x) * (1 - x);
|
||||||
|
//let y = x === 1 ? 1 : 1 - Math.pow(2, -10 * x);
|
||||||
|
let y;
|
||||||
|
if (x < 0.05) {
|
||||||
|
x = map(x, 0, 0.05, 0, 1);
|
||||||
|
y = -(Math.cos(Math.PI * x) - 1) / 2;
|
||||||
|
y = map(y, 0, 1, 15000, 19000);
|
||||||
|
} else if (x < 0.5) {
|
||||||
|
x = map(x, 0, 0.5, 0, 1);
|
||||||
|
y = -(Math.cos(Math.PI * x) - 1) / 2;
|
||||||
|
y = map(y, 0, 1, 20000, 50000);
|
||||||
|
} else {
|
||||||
|
y = 100000;
|
||||||
|
}
|
||||||
|
|
||||||
|
return y;
|
||||||
|
}
|
||||||
|
|
||||||
|
function generate_command() {
|
||||||
|
return [...Array(100).keys()].map((x) => x + 1).map((x) => "D" + (x - 1) + " " + fmt(duty_cycle_map(x)) + " " + fmt(freq_map(x))).join("");
|
||||||
|
}
|
||||||
|
|
||||||
|
//console.log("M" + vals + "R");
|
||||||
34
map_gen.ts
34
map_gen.ts
@@ -1,34 +0,0 @@
|
|||||||
import { Bezier } from "./bezierjs/src/bezier.js";
|
|
||||||
|
|
||||||
function map (a: number, a_min: number, a_max: number, b_min: number, b_max: number): number {
|
|
||||||
return b_min + ((b_max - b_min) / (a_max - a_min)) * (a - a_min);
|
|
||||||
}
|
|
||||||
|
|
||||||
function fmt (x: number) {
|
|
||||||
return x.toLocaleString("en-US", {
|
|
||||||
minimumFractionDigits: 2,
|
|
||||||
maximumFractionDigits: 2,
|
|
||||||
useGrouping: false
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function duty_cycle_map (x: number) {
|
|
||||||
//const out = Math.log10(x + 1) * 50;
|
|
||||||
//const out = x;
|
|
||||||
x = x / 100;
|
|
||||||
//let y = 1 - Math.pow(1 - x, 5);
|
|
||||||
let y = x < 0.5 ? 4 * x * x * x : 1 - Math.pow(-2 * x + 2, 3) / 2;
|
|
||||||
y = map(y, 0, 1, 30, 100);
|
|
||||||
return fmt(y);
|
|
||||||
}
|
|
||||||
|
|
||||||
function freq_map (x: number) {
|
|
||||||
x = x / 100;
|
|
||||||
let y = 1 - (1 - x) * (1 - x);
|
|
||||||
y = map(y, 0, 1, 20000, 25000);
|
|
||||||
return fmt(y);
|
|
||||||
}
|
|
||||||
|
|
||||||
const vals = [...Array(100).keys()].map((x) => x + 1).map((x) => "D" + (x - 1) + " " + duty_cycle_map(x) + " " + freq_map(x)).join("");
|
|
||||||
|
|
||||||
console.log("M" + vals + "R");
|
|
||||||
16
map_viz.html
Normal file
16
map_viz.html
Normal file
@@ -0,0 +1,16 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<head>
|
||||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.5.0/chart.umd.js"></script>
|
||||||
|
<script src="map_gen.js"></script>
|
||||||
|
<script defer src="map_viz.js"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1>map viz</h1>
|
||||||
|
<button type="button" onclick="copy_command()"><h1>copy</h1></button>
|
||||||
|
<canvas id="graph">
|
||||||
|
</canvas>
|
||||||
|
<h2>command here</h2>
|
||||||
|
<div id="command" style="font-family: monospace">
|
||||||
|
command will be here!
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
61
map_viz.js
Normal file
61
map_viz.js
Normal file
@@ -0,0 +1,61 @@
|
|||||||
|
const graph_div = document.getElementById("graph");
|
||||||
|
const command_div = document.getElementById("command");
|
||||||
|
|
||||||
|
function reload_graph () {
|
||||||
|
console.log("yay");
|
||||||
|
const data = [...Array(100).keys()]
|
||||||
|
.map((x) => x + 1)
|
||||||
|
.map((x) => ({
|
||||||
|
lvl: x,
|
||||||
|
duty_cycle: duty_cycle_map(x),
|
||||||
|
freq: freq_map(x)
|
||||||
|
}));
|
||||||
|
|
||||||
|
const duty_cycles = data.map((row) => row.duty_cycle);
|
||||||
|
const freqs = data.map((row) => row.freq);
|
||||||
|
|
||||||
|
let config = {
|
||||||
|
type: "line",
|
||||||
|
data: {
|
||||||
|
labels: data.map((row) => row.lvl),
|
||||||
|
datasets: [
|
||||||
|
{
|
||||||
|
label: "duty cycle",
|
||||||
|
yAxisID: "y",
|
||||||
|
data: duty_cycles
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "freq",
|
||||||
|
yAxisID: "freq_scale",
|
||||||
|
data: freqs
|
||||||
|
}
|
||||||
|
],
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
scales: {
|
||||||
|
freq_scale: {
|
||||||
|
type: "linear",
|
||||||
|
position: "right",
|
||||||
|
min: Math.min(...freqs),
|
||||||
|
max: Math.max(...freqs)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
console.log(config);
|
||||||
|
|
||||||
|
const chart = new Chart(graph_div, config);
|
||||||
|
//graph_div.innerHTML = "reloaded";
|
||||||
|
command_div.innerHTML = "MC" + generate_command() + "ER";
|
||||||
|
}
|
||||||
|
|
||||||
|
function copy_command () {
|
||||||
|
const item = new ClipboardItem({
|
||||||
|
"text/plain": command_div.innerHTML
|
||||||
|
});
|
||||||
|
navigator.clipboard.write([item]);
|
||||||
|
}
|
||||||
|
|
||||||
|
reload_graph();
|
||||||
|
copy_command();
|
||||||
Reference in New Issue
Block a user