Update app (controls)

This commit is contained in:
2025-05-18 21:13:04 +02:00
parent 8c58fb857a
commit 56bd816568

10
app.qmd
View File

@@ -35,9 +35,11 @@ chart = {
let selectedMu = 0.5;
const filteredData = () => bsplineData.filter(d => selectedKnots == d.knots && Math.abs(selectedMu - d.mu) < 0.001);
const container = d3.create("div").style("margin-bottom", "20px");
const controlsContainer = container.append("div")
.style("display", "flex")
.style("gap", "20px");
// Knots slider control
const knotsControl = container
.append("div")
const knotsControl = controlsContainer.append("div")
.style("display","flex")
.style("align-items","center")
.style("gap","10px");
@@ -52,12 +54,10 @@ chart = {
.attr("max",maxKnots)
.attr("step",1)
.property("value",selectedKnots)
.style("width","100px") // narrower slider
.style("height","10px") // thinner track
.on("input", function() { selectedKnots = +this.value; knotsControl.select("span").text(selectedKnots); updateChart(filteredData()); });
knotsControl.append("span").text(selectedKnots).style("font-size","16px");;
// μ slider control
const muControl = container.append("div").style("display","flex").style("align-items","center").style("gap","10px");
const muControl = controlsContainer.append("div").style("display","flex").style("align-items","center").style("gap","10px");
muControl.append("label").text("μ:").style("font-size","16px");
muControl.append("input")
.attr("type","range").attr("min",minMu).attr("max",maxMu).attr("step",0.1)