Spaces:
Running
Running
File size: 2,849 Bytes
c745dff | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 | <!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>DDW Interface - Sigmoid Function</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<header class="site-header">
<div>
<p class="kicker">Data Driven World</p>
<h1>Sigmoid Function Playground</h1>
</div>
<nav>
<a href="index.html">Home</a>
<a href="simple-sigmoid.html">Simple Sigmoid</a>
<a href="confusion-matrix.html">Confusion Matrix (Page 3)</a>
<a class="active" href="sigmoid.html">Sigmoid Function</a>
<a href="cost-visualization.html">Cost Function</a>
<a href="about.html">Notes</a>
</nav>
</header>
<main class="layout">
<section class="panel controls">
<h2>Model Controls</h2>
<label for="b0">b0 (intercept): <span id="b0Value">0.00</span></label>
<input id="b0" type="range" min="-10" max="10" step="0.1" value="0" />
<label for="b1">b1 (slope): <span id="b1Value">1.00</span></label>
<input id="b1" type="range" min="-5" max="5" step="0.1" value="1" />
<label for="t">threshold t: <span id="tValue">0.50</span></label>
<input id="t" type="range" min="0.05" max="0.95" step="0.01" value="0.5" />
<label for="probeX">probe x: <span id="probeValue">0.00</span></label>
<input id="probeX" type="range" min="-10" max="10" step="0.1" value="0" />
<div class="button-row">
<button id="resetBtn" type="button">Reset</button>
<button id="animateBtn" type="button">Animate Probe</button>
</div>
<label for="preset">Preset examples</label>
<select id="preset">
<option value="default">Default (b0=0, b1=1, t=0.5)</option>
<option value="steep">Steep classifier</option>
<option value="reversed">Reversed slope</option>
<option value="high-threshold">High threshold</option>
</select>
<div class="checkboxes">
<label><input id="showGrid" type="checkbox" checked /> Show grid</label>
<label><input id="showShade" type="checkbox" checked /> Shade positive region</label>
<label><input id="showDerivative" type="checkbox" /> Show derivative curve</label>
</div>
</section>
<section class="panel chart-panel">
<h2>p(x) = 1 / (1 + exp(-(b0 + b1x)))</h2>
<canvas id="plot" width="900" height="520" aria-label="Logistic curve chart"></canvas>
<div class="stats" id="stats"></div>
<p class="hint">Interactive option: click anywhere on the chart to add sample x points and see class labels using threshold t.</p>
</section>
</main>
<script src="app.js"></script>
</body>
</html>
|