Web K-Map Solver

A lightweight, dependency-free Karnaugh map solver that provides interactive visualization and Boolean function minimization for 2-4 variables. Features color-coded grouping, multiple solution display, and real-time synchronization between K-map and truth table views.

What is a Karnaugh Map?

A Karnaugh map (K-map) is a graphical method for Boolean function simplification that reduces the need for extensive computation. Developed by Maurice Karnaugh in 1953, it uses adjacent squares in a grid to represent Boolean variables arranged in Gray code order, where adjacent cells differ by only one bit. By identifying and grouping adjacent 1's in powers of 2, K-maps allow quick identification of the minimal Boolean expression in sum-of-products (SOP) form.

Sources:

1. Karnaugh, M. "The Map Method for Synthesis of Combinational Logic Circuits." Transactions of the American Institute of Electrical Engineers, Part I: Communications and Electronics 72, no. 5 (1953): 593-599.
2. Edward W. Veitch, "A Chart Method for Simplifying Truth Functions," Proceedings of the 1952 ACM Annual Meeting (Pittsburgh), pp. 127-133.
3. Willard Van Orman Quine, "The Problem of Simplifying Truth Functions," American Mathematical Monthly, Vol. 59, No. 8 (Oct. 1952), pp. 521-531.

Features

Core Functionality

• Interactive K-map grid with 2-4 variable support
• Real-time Boolean expression minimization
• Multiple solution display when available
• Don't care (X) condition support
• Synchronized truth table view
• Progressive Web App (PWA) support for offline use

Visualization

• Color-coded term grouping
• Dynamic SVG group visualization
• Wraparound group highlighting
• Gray code and binary layout options
• Light/Dark theme support

User Interface

• Intuitive cell state cycling (0 → 1 → X)
• Binary and decimal index display
• Tab-based view switching
• Mobile-responsive design
• PWA installation support for app-like experience
• One-click operations:
  • Set all cells to 1 or 0 (Clear)
  • Copy solution with proper notation
  • Toggle between K-map and Truth Table views
  • Toggle between Gray code and binary layouts
  • Toggle between light and dark themes
  • Toggle between zero value visibility in cells DISABLED

Usage Guide

1. Variable Selection

   • Choose 2-4 variables from the dropdown
   • Grid automatically adjusts to selected size
   • Variables are labeled A, B, C, D from most to least significant

2. Cell Manipulation

   • Click cells to cycle states: 0 → 1 → X

     A blank cell (ㅤ) is also 0

   • Use quick actions to set all cells or clear
   • Toggle visibility of zero values in cells DISABLED
   • Watch real-time solution updates

3. Solution Reading

   • Results shown in minimal SOP form
   • Overlined variables (A̅) represent negation
   • Multiple solutions shown when available
   • Click copy button for formatted output

4. Layout Options

   • Toggle between Gray code and binary layouts
   • Gray code optimizes for adjacency
   • Binary shows traditional ordering

Technical Details

• Built with vanilla HTML5, CSS3, and JavaScript
• No external dependencies
• Progressive Web App (PWA) capabilities:
  • Offline functionality with service worker caching
  • Installable on desktop and mobile devices
  • App-like experience
• Custom implementation of:
  • Quine-McCluskey algorithm for Boolean minimization
  • Gray code generation and handling
  • Prime implicant identification
  • Group visualization with SVG paths
• Real-time synchronization between K-map and Truth Table
• Vector-based UI elements for crisp display
• Responsive layout with CSS Grid and Flexbox
• Mobile-first design principles
• Theme system with CSS variables

Implementation Notes

The solver follows this process:

1. Generates optimal Gray code layouts for 2-4 variables
2. Identifies all possible prime implicant groups
3. Finds minimal solutions using Quine-McCluskey algorithm
4. Extracts Boolean expressions from group patterns
5. Visualizes groups using dynamic SVG paths
6. Presents results in minimal SOP format

Variable Notation

• Regular letter (A): Variable is 1 (TRUE)
• Overlined letter (A̅): Variable is 0 (FALSE)
• Blank cell (ㅤ): Also represents 0 (FALSE)
• Example: A̅BC̅D means A=0, B=1, C=0, D=1

Credits

Created by robonxt.

Assisted by Claude Sonnet 3.5 in Windsurf IDE.

Logic inspired by obsfx/kmap-solver-lib

Icon generated by Perchance

TODO:

• Try to get it working on browsers as old as Chrome 104+, Safari 12+. Compare working features here
• Get PWA working with a install button on mobile devices for a fullscreen, sandboxed webapp.
• Build working circuit diagram tab.
• Toggle visibility of zero values in cells DISABLED
• Modularize kmap-interface.js
• Fix K-map wraparound visualization for better edge and corner handling