CoderFunda
  • Home
  • About us
    • Contact Us
    • Disclaimer
    • Privacy Policy
    • About us
  • Home
  • Php
  • HTML
  • CSS
  • JavaScript
    • JavaScript
    • Jquery
    • JqueryUI
    • Stock
  • SQL
  • Vue.Js
  • Python
  • Wordpress
  • C++
    • C++
    • C
  • Laravel
    • Laravel
      • Overview
      • Namespaces
      • Middleware
      • Routing
      • Configuration
      • Application Structure
      • Installation
    • Overview
  • DBMS
    • DBMS
      • PL/SQL
      • SQLite
      • MongoDB
      • Cassandra
      • MySQL
      • Oracle
      • CouchDB
      • Neo4j
      • DB2
      • Quiz
    • Overview
  • Entertainment
    • TV Series Update
    • Movie Review
    • Movie Review
  • More
    • Vue. Js
    • Php Question
    • Php Interview Question
    • Laravel Interview Question
    • SQL Interview Question
    • IAS Interview Question
    • PCS Interview Question
    • Technology
    • Other

11 November, 2023

Optimization dots&line game

 Programing Coderfunda     November 11, 2023     No comments   

i just built dots and line game with minimax algorithm where user could play with AI, but unfortunately it is too slow even in just depth 4. so any optimization technique?


here My code,
class Maze {
constructor(gridX, gridY, sideSize) {
this.board = Array.from({ length: gridY }, (a) => a = Array.from({ length: gridX }, (b) => b = Array.from({ length: 4 }, c => c = 0)));
this.visited = [];
this.gap = Math.floor(sideSize / 8);
this.x = gridX;
this.y = gridY;
this.winPointX = 0;
this.winPointY = 0;
this.row = gridX * this.gap;
this.column = gridY * this.gap;
this.sideSize = sideSize;

};
drawGrid(ctx) {
console.log(this.row, this.column)
ctx.clearRect(0, 0, canv.width, canv.height);
for (let x = 0; x < this.row; x += this.x)
for (let y = 0; y < this.column; y += this.y) {

ctx.fillStyle = 'red';
ctx.fillRect(x * this.gap, y * this.gap, this.gap, this.gap);

}

};
ai(depth, alpha, beta, player, advantage, y, x, tile_Y, tile_X) {
if (y !== undefined && x !== undefined) {
let winPoint = this.boxForm(y, x)
if (tile_X > -1 && tile_X < 8 && tile_Y > -1 && tile_Y < 8) {
winPoint = winPoint || this.boxForm(tile_Y, tile_X)
}

if (winPoint && player == 'O') {
player = 'X';

advantage += 10

}
else if (winPoint && player == 'X') {
player = 'O';

advantage -= 10;

// console.log('Human bonus',y,x)
}
}

if (depth === 0) {

return { score: advantage }
}

var pieceArr = [];

for (var i = 0; i < this.board.length; i++) {
for (var j = 0; j < this.board[0].length; j++) {

for (let b = 0; b < 4; b++) {
if (this.board[i][j][b]) {
continue;
};
let tileX = j;
let tileY = i;
let best = {}
this.change(i, j, b)
best.bestmove = [i, j, b];
let neghdir;
if (b == 2) {
neghdir = 0;
tileX++
} else if (b == 0) {
neghdir = 2;
tileX--
} else if (b == 3) {
neghdir = 1;
tileY--
} else {
neghdir = 3;
tileY++
};
if (tileX > -1 && tileX < 8 && tileY > -1 && tileY < 8) {
this.change(tileY, tileX, neghdir);
}
var g = this.ai(depth - 1, alpha, beta, player == 'X' ? 'O' : 'X', advantage, i, j, tileY, tileX);

/* if (tileX>-1&&tileX-1&&tileY alpha) {
alpha = best.score;
}
} else {

if (best.score < beta) {
beta = best.score
}
};
if (tileX > -1 && tileX < 8 && tileY > -1 && tileY < 8) {
this.board[tileY][tileX][neghdir] = 0;
}
this.board[i][j][b] = 0;
pieceArr.push(best)

if (alpha >= beta) {
break;

}

}

}
};
pieceArr.sort((a,b)=>{
return Math.random()-0.5;
})
var bestMove;
if (player === 'X') {
var bestScore = -10000;
for (var i = 0; i < pieceArr.length; i++) {
if (pieceArr[i].score > bestScore) {
bestScore = pieceArr[i].score;
bestMove = i;
}
}
} else {
var bestScore = 10000;
for (var i = 0; i < pieceArr.length; i++) {
if (pieceArr[i].score < bestScore) {
bestScore = pieceArr[i].score;
bestMove = i;
}
}
}
return pieceArr[bestMove];
};
rmSide(side, dir, col) {
let vertex;
if (dir == 'w') {
vertex = [side[0] * this.x, this.y * side[1]];
} else if (dir == 'e') {
vertex = [(side[0] + 1) * this.x, this.y * side[1]];
}
else if (dir == 'n') {
vertex = [this.x * side[1], (side[0]) * this.y];

} else if (dir == 's') {
vertex = [this.x * (side[1] + 1), (side[0]) * this.y];
}
if (!vertex) {
return null
}

let x = vertex[0];

for (let y = vertex[1] + 1; y < vertex[1] + this.y; y++) {

ctx.fillStyle = col;
if (dir == 'n' || dir == 's') {
ctx.fillRect((y) * this.gap, (x) * this.gap, this.gap, this.gap);
} else {
ctx.fillRect((x) * this.gap, (y) * this.gap, this.gap, this.gap);
}

};

}
change(y, x, dir, player) {

this.board[y][x][dir] = 'X';

}
boxForm(y, x) {

for (let i = 0; i < 4; i++) {
if (!this.board[y][x][i]) {
return false
}

};

return true
}
};
//dots and line
const canv = document.getElementById('canv');
const ctx = canv.getContext('2d');
const size = Math.min(window.innerWidth, window.innerHeight) * 0.7;
canv.width = size;
canv.height = size
const sideSize = size / 8;
console.log(sideSize)
let turn = 'X'

const maze = new Maze(8, 8, sideSize);

maze.drawGrid(ctx);
function mve(tileX, tileY, dir, player) {

if (tileX < 8 && tileY > -1 && tileX > -1 && tileY < 8) {

turn = player == 'O' ? 'X' : 'O'

let n = null;
if (dir == 'n') {
n = 3
} else if (dir == 's') {
n = 1
} else if (dir === 'e') {
n = 2
} else {
n = 0
}

/*
let cordX = e.clientX;
let cordY = e.clientY;
let dirCor = {
'n':[65+tileX*(100+20),75+(tileY)*(100+20)],
's':[65+tileX*(100+20),195+(tileY)*(100+20)],
'w':[45+tileX*(100+20),90+(tileY)*(100+20)],
'e':[165+tileX*(100+20),90+(tileY)*(100+20)]

};
console.log(cordX,cordY,dirCor);

// console.log(dirCor['n'][0]&&(dirCor['n'][0]+100)&&dirCor['n'][1]&&(dirCor['n'][0]+15))
if (cordX>=dirCor['n'][0]&&cordX=dirCor['n'][1]&&cordY=dirCor['s'][0]&&cordX=dirCor['s'][1]&&cordY=dirCor['e'][0]&&cordX=dirCor['e'][1]&&cordY=dirCor['w'][0]&&cordX=dirCor['w'][1]&&cordY -1 && tileX < 8 && tileY > -1 && tileY < 8) {
maze.change(tileY, tileX, neghdir);
if (maze.boxForm(tileY, tileX)) {
turn = player;
}
};
if (turn == "O") {
console.log(maze.board)
playAI()
}

}

}
}

function playAI() {

let aimove = maze.ai(4, -Infinity, Infinity, 'X', 0);
let dir1 = undefined;
if (aimove.bestmove[2] == 0) {
dir1 = 'w'
} else if (aimove.bestmove[2] == 1) {
dir1 = 's'
} else if (aimove.bestmove[2] == 2) {
dir1 = 'e'
} else {
dir1 = 'n'
};
console.log(aimove)
mve(aimove.bestmove[1], aimove.bestmove[0], dir1, 'O')

}

canv.addEventListener('click', (e) => {
const rect = canv.getBoundingClientRect()
let tileX = Math.floor((e.clientX - rect.x) / sideSize);
let tileY = Math.floor((e.clientY - rect.y) / sideSize);
let dir = prompt('direction');

mve(tileX, tileY, dir, 'X');

});
  • Share This:  
  •  Facebook
  •  Twitter
  •  Google+
  •  Stumble
  •  Digg
Email ThisBlogThis!Share to XShare to Facebook
Newer Post Older Post Home
View mobile version

0 comments:

Post a Comment

Thanks

Meta

Popular Posts

  • Crawl and Index Your Website with Laravel Site Search
      Laravel Site Search   is a package by Spatie to create a full-text search index by crawling your site. You can think of it as a private Go...
  • Sitaare Zameen Par Full Movie Review
     Here’s a  complete Vue.js tutorial for beginners to master level , structured in a progressive and simple way. It covers all essential topi...
  • Tailwindcss best practices for responsive design
    Tailwind CSS provides powerful utilities for responsive design out of the box. To use it effectively and maintain clean, scalable code, here...
  • Tailwind CSS Tutorial (Beginner to Master)
    Here's a simple and complete Tailwind CSS tutorial designed for students and beginners , progressing step-by-step from beginner to mast...
  • Create Reusable Blade Components in Laravel
    In Laravel, reusable Blade components provide a convenient way to encapsulate UI elements and logic for reuse across your application. Let...

Categories

  • Ajax (26)
  • Bootstrap (30)
  • DBMS (42)
  • HTML (12)
  • HTML5 (45)
  • JavaScript (10)
  • Jquery (34)
  • Jquery UI (2)
  • JqueryUI (32)
  • Laravel (1017)
  • Laravel Tutorials (23)
  • Laravel-Question (6)
  • Magento (9)
  • Magento 2 (95)
  • MariaDB (1)
  • MySql Tutorial (2)
  • PHP-Interview-Questions (3)
  • Php Question (13)
  • Python (36)
  • RDBMS (13)
  • SQL Tutorial (79)
  • Vue.js Tutorial (69)
  • Wordpress (150)
  • Wordpress Theme (3)
  • codeigniter (108)
  • oops (4)
  • php (853)

Social Media Links

  • Follow on Twitter
  • Like on Facebook
  • Subscribe on Youtube
  • Follow on Instagram

Pages

  • Home
  • Contact Us
  • Privacy Policy
  • About us

Blog Archive

  • July (4)
  • September (100)
  • August (50)
  • July (56)
  • June (46)
  • May (59)
  • April (50)
  • March (60)
  • February (42)
  • January (53)
  • December (58)
  • November (61)
  • October (39)
  • September (36)
  • August (36)
  • July (34)
  • June (34)
  • May (36)
  • April (29)
  • March (82)
  • February (1)
  • January (8)
  • December (14)
  • November (41)
  • October (13)
  • September (5)
  • August (48)
  • July (9)
  • June (6)
  • May (119)
  • April (259)
  • March (122)
  • February (368)
  • January (33)
  • October (2)
  • July (11)
  • June (29)
  • May (25)
  • April (168)
  • March (93)
  • February (60)
  • January (28)
  • December (195)
  • November (24)
  • October (40)
  • September (55)
  • August (6)
  • July (48)
  • May (2)
  • January (2)
  • July (6)
  • June (6)
  • February (17)
  • January (69)
  • December (122)
  • November (56)
  • October (92)
  • September (76)
  • August (6)

Loading...

Laravel News

Loading...

Copyright © CoderFunda | Powered by Blogger
Design by Coderfunda | Blogger Theme by Coderfunda | Distributed By Coderfunda