Interactive body heatmap component for visualizing muscle engagement. Available for both SwiftUI (iOS) and Web (HTML/JS).
Option 1: Swift Package Manager (Recommended)
// In Xcode: File → Add Package Dependencies
// Paste: https://github.com/chiejina/Body-Heatmap-Repo
import BodyHeatmap
struct ContentView: View {
var body: some View {
StandaloneBodyHeatmap()
}
}Option 2: Manual Installation
- See
swiftui-demo/folder - Copy files to your Xcode project
- Full instructions in swiftui-demo/README.md
- Open
web-demo/index.htmldirectly in a browser - Or run with a local server:
cd web-demo
python3 -m http.server 8000
# Open http://localhost:8000See web-demo/README.md for details.
Body-Heatmap-Repo/
├── swiftui-demo/ # SwiftUI version (iOS)
│ ├── StandaloneBodyHeatmap.swift
│ ├── Muscles-simplified.svg
│ └── README.md
├── web-demo/ # Web version (HTML/JS)
│ ├── index.html
│ ├── Muscles-simplified.svg
│ └── README.md
├── Sources/ # Swift Package Manager structure
│ └── BodyHeatmap/
├── Package.swift # SPM manifest
├── README.md # This file
└── INSTALLATION.md # Detailed installation guide
Modify colors in the updateMuscleColors() method:
let color = isToggled ? "rgba(255, 0, 0, 0.7)" : "__reset__"Modify CSS and JavaScript in web-demo/index.html:
element.style.fill = 'rgba(255, 100, 100, 0.8)';Both versions include 24 clickable muscle groups:
| Category | Muscles |
|---|---|
| Chest | Upper/Middle/Lower Pecs |
| Back | Upper Traps, Lower Traps, Rhomboids, Lats, Lower Back |
| Shoulders | Front/Side/Rear Deltoids |
| Arms | Biceps, Triceps, Forearms |
| Core | Upper Abs, Lower Abs, Obliques |
| Legs | Quadriceps, Hamstrings, Glutes, Calves |
| Other | Hip Adductors, Hip Abductors, Neck |
- iOS 15.0+
- Xcode 13.0+
- Swift 5.9+
- Modern web browser (Chrome, Firefox, Safari, Edge)
- No build tools or dependencies required
- INSTALLATION.md - Detailed installation for both platforms
- swiftui-demo/README.md - SwiftUI-specific guide
- web-demo/README.md - Web version guide
MIT License