virtual-labs-archive · prekshap24 · May 11, 2019 · May 11, 2019 · May 11, 2019 · May 11, 2019
diff --git a/Project-1 Issue Number 240/Codes/exp3.css b/Project-1 Issue Number 240/Codes/exp3.css
@@ -0,0 +1,139 @@
+* {
+
+box-sizing: border-box;
+
+}
+
+
+body {
+
+margin: 0;
+
+}
+
+
+/*Graphs Layout */
+.graph {
+
+float: left;
+
+width: 50%;
+
+padding: 15px;
+
+max-width: 800px;
+
+margin: 50px auto;
+
+}
+
+
+
+.row:after {
+
+content: "";
+
+display: table;
+
+clear: both;
+
+}
+
+
+@media screen and (max-width:600px) {
+
+.graph {
+
+width: 100%;
+
+}
+
+}
+
+
+/* 1st row Input Output Layout */
+.column-0 {
+
+float: left;
+
+padding: 10px;
+
+}
+
+
+.column-0.side {
+
+width: 37.5%;
+
+}
+
+
+.column-0.right {
+
+width: 25%;
+
+}
+
+
+@media screen and (max-width: 600px) {
+
+.column-0.side, .column-0.right {
+
+width: 100%;
+
+}
+
+}
+
+
+.button{
+	margin:5px;
+}
+
+
+/* 2nd row Input Output Layout */
+.column-1 {
+
+float: left;
+
+width: 37.5%;
+
+padding: 15px;
+
+}
+
+
+.row:after {
+
+content: "";
+
+display: table;
+
+clear: both;
+
+}
+
+
+@media screen and (max-width:600px) {
+
+.column-1 {
+
+width: 100%;
+
+}
+
+}
+
+
+#input-data-from-user-class1{
+
+visibility: hidden;
+
+}
+
+
+#input-data-from-user-class2{
+
+visibility: hidden;
+
+}
diff --git a/Project-1 Issue Number 240/Codes/exp3.html b/Project-1 Issue Number 240/Codes/exp3.html
@@ -0,0 +1,115 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+
+	<title>Pattern Recognition: Experiment 3- Perceptron</title>
+	<meta charset="utf-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+	<script src="https://cdn.jsdelivr.net/npm/chart.js@2.8.0"></script>
+   	<script src="https://www.chartjs.org/dist/2.8.0/Chart.js"></script>
+	<script src="https://www.chartjs.org/samples/latest/utils.js"></script>
+	<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.6.0/Chart.js"></script>
+	<link rel="stylesheet" href="exp3.css">
+
+</head>
+<body> 
+
+
+<!-- Graphs Layout -->
+<div class="row">           
+	<div class="graph">
+		<canvas id="graph-1" width="1600" height="900"></canvas>
+	</div>
+
+	<div class="graph">
+		<canvas id="graph-2" width="1600" height="900"></canvas>
+	</div>
+</div>
+
+
+<!-- 1st row Input Output Layout -->
+<div class="row">
+
+	<div class="column-0 right">
+    	<h3>Learning Parameter</h3>
+    	<select id="learning-parameter">
+  			<option value="1">1</option>
+  			<!--<option value="1/0.05">1/k</option>
+  			<option value="1/0.05^2">1/k^2</option>
+  			<option value="1/2^0.05">1/2^k</option>-->
+  			<option value="0.05">k</option>
+		</select>
+	</div>
+
+
+  	<div class="column-0 side">
+	    <h3>Add Data</h3>
+	    <div class="w3-container">
+	  		<button class="button" onclick="addClass1()">Add Class 1</button>
+	  		<button class="button" onclick="addClass2()">Add Class 2</button>
+			<button class="button" id="clear">Clear</button>
+		</div>
+  	</div>
+
+  	<div class="column-0 side">
+    <h3>Steps</h3>
+	    <div class="w3-container">
+	  		<button class="button" id ="start" onclick="start()">Start</button>
+
+	  		<button class="button" id = "step" onclick="changeStatusStep()">Step</button>
+			<button class="button" id = "step-100" onclick="changeStatusStep100()">Step 100</button>
+		</div>
+  	</div>
+
+</div>
+
+
+<!-- 2nd row Input Output Layout -->
+<div class="row">
+	<div class="column-1">
+		<h3>Status</h3>
+		<div id="column-1"></div>
+		<div id="column-2"></div>
+	</div>
+
+	<div class="column-1">
+		<h3>Value of Weights</h3>
+	    <p id="weights-return">[]</p>
+	</div>
+</div>
+
+
+<div class="row">
+	<div class= column-1 id="input-data-from-user-class1">
+		<p>
+			X Value- Class 1:
+    		<input id="xValue1" type="number" step="any" placeholder="Enter X-Value class 1">
+    		<button onclick="addDataPoints1x()">Add Data Point</button>
+    	</p>
+    	<p>
+    	  	Y Value- Class 1:
+    		<input id="yValue1" type="number" step="any" placeholder="Enter Y-Value class 1">
+    		<button onclick="addDataPoints1y()">Add Data Point</button>
+    		<!--<button id="add-Data-Point">Draw Graph</button>-->
+    	</p>
+    </div>
+    <div class= column-1 id="input-data-from-user-class2">
+		<p>
+			X Value- Class 2:
+    		<input id="xValue2" type="number" step="any" placeholder="Enter X-Value class 2">
+    		<button onclick="addDataPoints2x()">Add DataPoint</button>
+    	</p>
+    	<p>
+    		Y Value- Class 2:
+    		<input id="yValue2" type="number" step="any" placeholder="Enter Y-Value class 2">
+    		<button onclick="addDataPoints2y()">Add Data Point</button>
+    	</p>
+    </div>
+</div>
+
+
+<!-- Script file -->
+<script type="text/javascript" src="exp3.js"></script>
+
+</body>
+</html>