🧠 Connect 4 AI
Just a simple but fast connect four AI made using HTML, CSS, JS.
How To Play:
The aim of the game is to get four of your counters (red) in row, this can be diagonally, horizontally or vertically. Each move click on one of the seven columns to drop your counter into that column.
How It Works:
- Each potential place the AI can place a counter is scored based on the amount of counters around that place and the length of the segments around it also.
- The move above is also checked to make sure that by moving to that position that the AI doesn't cause the player to win, or for the AI to sacrifice a potentially good move, if this is true then the score of that move becomes 0.
- If there is one distinct highest score, that one is chosen, else the AI just picks a random move from the highest scoring moves.
I found a way to always win :P
Start at the center column.
Fill in both columns left and right of the center.
Then fill in the rightmost and leftmost column.
You should win every time :p
This file cannot be displayed: https://storage.googleapis.com/replit/images/1551145368776_bf73202506952ca5666c766e8abf33aa.pn
This file cannot be displayed: https://storage.googleapis.com/replit/images/1551145372206_a7855b5b739f56ee9971c1cb809ee64f.pn
Also found an edge case where there is a very obvious placement for the AI, but it goes in the wrong spot. Maybe something to investigate:
This file cannot be displayed: https://storage.googleapis.com/replit/images/1550686398701_e5ecd5575f32214a857b02a1a0d3e574.pn
@spagmeat I've fixed the issue, apparently the last move it took was so much "better" than where it should go, that it went there. The problem was that it raised the length of the segments it found to the power of five, which in this case added to bigger than 100 / 101 which indicated in order a red win or a blue win. It was probably a bad idea to do set numbers to indicate a winning move.
@LucHutton - I had a break. :)
What's particularly interesting about this one is that I couldn't get the same results when I shift the whole thing by one to the right or when I try to mirror it. I'll take a look at the code later if I have time to try to see whats up. :)
This file cannot be displayed: https://storage.googleapis.com/replit/images/1550771457037_39b806deb192654b9c09b506fd41444d.pn
Nicely done. However I found myself able to create this win very consistently.
This file cannot be displayed: https://storage.googleapis.com/replit/images/1550685932353_b751ef3178214121799cd3dd64000eea.pn
It was a very good AI, but in the end, humans will win
This file cannot be displayed: https://storage.googleapis.com/replit/images/1550630567154_782dfbdc92f6cc74e0b37876b2b0c043.pn
This file cannot be displayed: https://storage.googleapis.com/replit/images/1548187240986_5a2dd5aa4462b9ce5c79904325a75311.pn
This file cannot be displayed: https://storage.googleapis.com/replit/images/1548187635084_c5631a7323715fcbdabc4f7d384c898f.pn
^-^ I'm gonna use this strategy on my friends next! corner first :D