Update app (controls)
This commit is contained in:
10
app.qmd
10
app.qmd
@@ -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)
|
||||
|
||||
Reference in New Issue
Block a user