Skip to content
This repository has been archived by the owner on Jan 10, 2025. It is now read-only.

Commit

Permalink
Merge branch '2023' into nonlinear-constrained-optimizatoin
Browse files Browse the repository at this point in the history
  • Loading branch information
@Tom-van-Woudenberg
Tom-van-Woudenberg committed Apr 25, 2024
2 parents d809ec5 + 0cd0e7f commit 65b10e8
Show file tree
Hide file tree
Showing 6 changed files with 309 additions and 116 deletions.
3 changes: 3 additions & 0 deletions book/_static/books.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -115,6 +115,9 @@
button.innerHTML = "Evaluate";
button.onclick = eval;
outputContainer.appendChild(button);

// Call func with initial values
eval();
</script>
</body>
</html>
147 changes: 147 additions & 0 deletions book/_static/curve.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,147 @@
<!DOCTYPE html>
<html>
<head>
<title>Profit Calculation</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/numeric/1.2.6/numeric.min.js"></script>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<style>
.slider {
display: block;
margin-bottom: 10px;
width: 100%;
}
.slider-container {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 10px;
width: 100%;
}
.output {
margin-top: 20px;
padding: 10px;
border: 1px solid #ccc;
border-radius: 5px;
background-color: #f9f9f9;
}
.output p {
margin: 5px 0;
}
.output .emoji {
font-size: 20px;
margin-right: 5px;
}
</style>
</head>
<body>
<div id="sliderContainer" class="slider-container"></div>
<div id="outputContainer" class="output"></div>

<script>
function func(a, b, c) {
var xi = [0.97, 0, 0.5, 0.85, 0.7, 0.19, 0.41, 0.78];
var yi = [0.97, 0.06, 0.7, 0.74, 0.2, 0.34, 0.29, 0.94];
var x_range = numeric.linspace(0.0001, 1, 100);

var y_est = numeric.add(numeric.mul(a, numeric.pow(xi, b)), c);
var error = numeric.sum(numeric.pow(numeric.sub(yi, y_est), 2));
var title = 'Total error squared = ' + error.toFixed(4);

var data = [
{
x: xi,
y: yi,
type: 'scatter',
mode: 'markers',
name: 'Data points'
},
{
x: x_range,
y: numeric.add(numeric.mul(a, numeric.pow(x_range, b)), c),
type: 'scatter',
mode: 'lines',
name: 'Curve fit'
}
];

var layout = {
xaxis: {
title: 'x',
range: [0, 1]
},
yaxis: {
title: 'y',
range: [0, 1]
},
showlegend: true,
title: {
text: title,
font: {
size: 16
}
}
};

Plotly.newPlot('outputContainer', data, layout);

// Add arrows to the plot
for (var i = 0; i < xi.length; i++) {
var arrow = {
x: [xi[i], xi[i]],
y: [yi[i], Math.max(Math.min(a * xi[i] ** b + c, 1), 0)],
mode: 'lines',
line: {
color: 'red',
width: 1,
dash: 'dash'
},
showlegend: false
};
data.push(arrow);
}

Plotly.update('outputContainer', data, layout);
}

var sliderContainer = document.getElementById("sliderContainer");
var sliders = [
{ id: "a", min: 0, max: 5, value: 2, step: 0.01, description: "a" },
{ id: "b", min: 0, max: 5, value: 2, step: 0.01, description: "b" },
{ id: "c", min: 0, max: 1, value: 0, step: 0.01, description: "c" }
];

sliders.forEach(function(slider) {
var input = document.createElement("input");
input.type = "range";
input.min = slider.min;
input.max = slider.max;
input.value = slider.value;
input.step = slider.step;
input.id = slider.id;
input.oninput = function() {
document.getElementById(slider.id + "_value").textContent = this.value;
func(parseFloat(document.getElementById("a").value), parseFloat(document.getElementById("b").value), parseFloat(document.getElementById("c").value));
};
input.classList.add("slider");

var label = document.createElement("label");
label.innerHTML = slider.description;
label.setAttribute("for", slider.id);
label.style.textAlign = "right";

var valueDisplay = document.createElement("span"); // Create a span element for value display
valueDisplay.id = slider.id + "_value"; // Set the id for value display
valueDisplay.textContent = slider.value; // Set the initial value

sliderContainer.appendChild(label);
sliderContainer.appendChild(input);
sliderContainer.appendChild(valueDisplay); // Append the value display element
});

var outputContainer = document.getElementById("outputContainer");
outputContainer.style.height = "400px";

// Call func with initial values
func(parseFloat(document.getElementById("a").value), parseFloat(document.getElementById("b").value), parseFloat(document.getElementById("c").value));
</script>
</body>
</html>
138 changes: 138 additions & 0 deletions book/_static/maps.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,138 @@
<!DOCTYPE html>
<html>
<head>
<title>Profit Calculation</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/numeric/1.2.6/numeric.min.js"></script>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<style>
.slider {
display: block;
margin-bottom: 10px;
width: 100%;
}
.slider-container {
display: grid;
grid-template-columns: repeat(6, 1fr);
grid-gap: 10px;
width: 100%;
}
.output {
margin-top: 20px;
padding: 10px;
border: 1px solid #ccc;
border-radius: 5px;
background-color: #f9f9f9;
}
.output p {
margin: 5px 0;
}
.output .emoji {
font-size: 20px;
margin-right: 5px;
}
</style>
</head>
<body>
<div id="sliderContainer" class="slider-container"></div>
<div id="outputContainer" class="output"></div>

<script>
function func(n, truth) {
var n_range = numeric.linspace(0, 100, 100);
var profit = numeric.sub(numeric.mul(75, n_range), numeric.mul(numeric.sub(150, numeric.mul(0.01, numeric.pow(n_range, 2))), n_range));
var title = 'Negative profit for amount of bathmetry maps sold is € ' + (75 * n - (150 - 0.01 * Math.pow(n, 2)) * n).toFixed(2);

var data = [
{
x: n_range,
y: profit,
type: 'scatter',
mode: 'lines',
name: 'Objective function',
visible: truth ? true : 'legendonly'
},
{
x: [n],
y: [75 * n - (150 - 0.01 * Math.pow(n, 2)) * n],
type: 'scatter',
mode: 'markers',
name: 'Manual solution',
marker: {
size: 10 // Set the size of the marker to a larger value
}
}
];

var layout = {
title: title,
xaxis: {
title: 'Number of bathmetry maps n sold (-)',
range: [0, 100]
},
yaxis: {
title: 'Negative profit (€)',
range: [-3000, 3000]
},
showlegend: truth
};

Plotly.newPlot('outputContainer', data, layout);
}

var sliderContainer = document.getElementById("sliderContainer");
var sliders = [
{ id: "n", min: 0, max: 100, value: 20, step: 1, description: "#maps n sold" }
];

sliders.forEach(function(slider) {
var input = document.createElement("input");
input.type = "range";
input.min = slider.min;
input.max = slider.max;
input.value = slider.value;
input.step = slider.step;
input.id = slider.id;
input.oninput = function() {
document.getElementById(slider.id + "_value").textContent = this.value;
func(parseInt(this.value), document.getElementById("truth").checked);
};
input.classList.add("slider");

var label = document.createElement("label");
label.innerHTML = slider.description;
label.setAttribute("for", slider.id);
label.style.textAlign = "right";

var valueDisplay = document.createElement("span"); // Create a span element for value display
valueDisplay.id = slider.id + "_value"; // Set the id for value display
valueDisplay.textContent = slider.value; // Set the initial value

sliderContainer.appendChild(label);
sliderContainer.appendChild(input);
sliderContainer.appendChild(valueDisplay); // Append the value display element
});

var truthCheckbox = document.createElement("input");
truthCheckbox.type = "checkbox";
truthCheckbox.id = "truth";
truthCheckbox.checked = false;
truthCheckbox.onchange = function() {
func(parseInt(document.getElementById("n").value), this.checked);
};

var truthLabel = document.createElement("label");
truthLabel.innerHTML = "Show objective function";
truthLabel.setAttribute("for", "truth");
truthLabel.style.textAlign = "right";

sliderContainer.appendChild(truthLabel);
sliderContainer.appendChild(truthCheckbox);

var outputContainer = document.getElementById("outputContainer");
outputContainer.style.height = "400px";

// Call func with initial values
func(parseInt(document.getElementById("n").value), document.getElementById("truth").checked);
</script>
</body>
</html>
44 changes: 5 additions & 39 deletions book/pages/Unconstrained_optimization_example_1.ipynb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -96,50 +96,16 @@
"cell_type": "markdown",
"metadata": {},
"source": [
"### Find best solution manually\n",
"\n",
"An approach to solve this problem might be to try out some values. You can do so in the applet below. The plot below shows the negative profit for some number of bathmetry maps sold.\n",
"\n",
":::{card}\n",
"Click {fa}`rocket` --> {guilabel}`Live Code` to enable this applet. Try and adjust the values for $n$, the number of bathmetry maps sold. How small can you get the negative profit?\n",
":::{card} Test yourself\n",
"Try and adjust the values for $n$, the number of bathmetry maps sold. How small can you get the negative profit?\n",
"<iframe src=\"../_static/maps.html\" style=\"overflow:hidden;height:500;width:100%\" height=\"500\" width=\"100%\"> frameborder=\"0\"></iframe>\n",
":::"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"thebe-remove-input-init"
]
},
"outputs": [],
"source": [
"from ipywidgets import widgets, interact\n",
"import numpy as np\n",
"import matplotlib.pylab as plt\n",
"%config InlineBackend.figure_formats = ['svg']\n",
"\n",
"n_range = np.linspace(0,100,100)\n",
"def func(n,truth):\n",
" fig, ax = plt.subplots(1, 1)\n",
" title = 'Negative profit for amount of bathmetry maps sold is € ' + str(round(75*n - (150 - 0.01 * n**2)*n,2))\n",
" ax.clear()\n",
" ax.set_title(title)\n",
" if truth:\n",
" ax.plot(n_range,75*n_range - (150 - 0.01 * n_range**2)*n_range)\n",
" ax.plot(n,75*n - (150 - 0.01 * n**2)*n,'o');\n",
" ax.set_xlim([0,100])\n",
" ax.set_xlabel('Number of bathmetry maps $n$ sold (-)')\n",
" ax.set_ylabel('Negative profit (€)')\n",
" ax.set_ylim([-3000,3000])\n",
" ax.spines['right'].set_color('none')\n",
" ax.spines['top'].set_color('none')\n",
" ax.spines['bottom'].set_position('zero')\n",
" ax.spines['left'].set_position('zero')\n",
" plt.show();\n",
"\n",
"interact(func, n = widgets.IntSlider(min=0, max=100, value=20, step=1, description=\"#maps n sold\"), truth = widgets.Checkbox(value=False, description='Show objective function', disabled=False));"
]
},
{
"cell_type": "markdown",
"metadata": {},
Expand Down
Loading

0 comments on commit 65b10e8

Please sign in to comment.