OCR Result Viewer

A single-file HTML tool to visually verify OCR results — image on the left, OCR data on the right. Designed for receipt/invoice OCR pipelines.

Drop an image and its OCR JSON file side by side, zoom in to check details, and see the data in a clean structured view.

Features

• Split view — image panel left, OCR data panel right
• Drag & drop — drop images and JSON files anywhere
• Zoom — mouse scroll wheel, + / − buttons, Ctrl+= / Ctrl+-
• Pan — drag when zoomed in
• Fit to screen — ⊞ button or Ctrl+0
• Structured OCR view — auto-detects invoice/receipt fields (supports both English and German formats)
• Raw JSON fallback — syntax-highlighted when unknown format
• 100% offline — single HTML file, no dependencies, no server, no build

Usage

1. Open index.html in any browser (or serve with python3 -m http.server)
2. Drag an image onto the left panel (or click 📷 Image)
3. Drag a JSON / .txt OCR result onto the right panel (or click 📄 OCR Data)
4. Zoom, pan, and inspect

Supported OCR formats

Format	Fields	Example
English (structured)	sender, recipient, line_items, amount_total	Generic invoice
German (structured)	absender_name, positionen, netto, brutto, rechnungstyp	German receipt pipeline
Raw JSON / text	Any other format	Syntax-highlighted fallback

Keyboard shortcuts

Key	Action
Ctrl+=	Zoom in
Ctrl+-	Zoom out
Ctrl+0	Fit to screen
Ctrl+O	Open image

License

MIT