src/app/pages/algorithms/four-color/four-color.component.ts

@@ -330,10 +330,12 @@ export class FourColorComponent implements AfterViewInit {
         region.color = color;
         this.updateRegionColors(region);
 
-        if (this.backtrackSolve(regionIndex + 1)) return true;
+        if (this.backtrackSolve(regionIndex + 1)) {
+          return true;
+        }
 
         region.color = 0;
-        this.updateRegionColors(region);
+        //this.updateRegionColors(region);
       }
     }
     return false;
@@ -341,7 +343,9 @@ export class FourColorComponent implements AfterViewInit {
 
   private isColorValid(region: Region, color: number): boolean {
     for (const neighborId of region.neighbors) {
-      if (this.regions[neighborId].color === color) return false;
+      if (this.regions[neighborId].color === color){
+        return false;
+      }
     }
     return true;
   }

src/app/pages/algorithms/four-color/four-color.models.ts

@@ -2,7 +2,7 @@ export interface FourColorNode {
   row: number;
   col: number;
   regionId: number;
-  color: number; // 0: none, 1-4: colors
+  color: number;
 }
 
 export interface Region {
@@ -11,8 +11,8 @@ export interface Region {
   neighbors: Set<number>;
 }
 
-export const DEFAULT_GRID_ROWS = 30;
-export const DEFAULT_GRID_COLS = 30;
+export const DEFAULT_GRID_ROWS = 25;
+export const DEFAULT_GRID_COLS = 25;
 export const MIN_GRID_SIZE = 20;
-export const MAX_GRID_SIZE = 50;
+export const MAX_GRID_SIZE = 38;
 export const MAX_GRID_PX = 600;