<!DOCTYPE html>
<html>
<script src="../scripts/myperceptron.js"></script>
<script src="../scripts/myplotlib.js"></script>
<body>
<canvas id="myCanvas" width="400px" height="400px" style="width:100%;max-width:400px;border:1px solid black"></canvas>
<script>
// Ініціалізація значень
const numPoints = 500;
const learningRate = 0.00001;
// Створити плотер
const plotter = new XYPlotter("myCanvas");
plotter.transformXY();
const xMax = plotter.xMax;
const yMax = plotter.yMax;
const xMin = plotter.xMin;
const yMin = plotter.yMin;
// Створити рандомні XY точки
const xPoints = [];
const yPoints = [];
for (let i = 0; i < numPoints; i++) {
xPoints[i] = Math.random() * xMax;
yPoints[i] = Math.random() * yMax;
}
// Лінійна функція
function f(x) {
return x * 1.2 + 50;
}
// Накреслити лінію
plotter.plotLine(xMin, f(xMin), xMax, f(xMax), "black");
// Обчислити бажані відповіді
const desired = [];
for (let i = 0; i < numPoints; i++) {
desired[i] = 0;
if (yPoints[i] > f(xPoints[i])) {desired[i] = 1}
}
// Створити перцептрон
const ptron = new Perceptron(2, learningRate);
// Тренувати перцептрон
for (let j = 0; j <= 10000; j++) {
for (let i = 0; i < numPoints; i++) {
ptron.train([xPoints[i], yPoints[i]], desired[i]);
}
}
// Тест проти невідомих даних
const counter = 500;
for (let i = 0; i < counter; i++) {
let x = Math.random() * xMax;
let y = Math.random() * yMax;
let guess = ptron.activate([x, y, ptron.bias]);
let color = "black";
if (guess == 0) color = "blue";
plotter.plotPoint(x, y, color);
}
</script>
</body>
</html>