LandCanvas — Land Plot Mapping Tool
Browser-based land plot mapping and property marketing canvas for Thai real estate
// Built with
sveltekit
typescript IndexedDB mapbox
vitest claude-code-cli01 Problem
Real estate agents in Thailand needed a tool to visually mark land plot boundaries on actual maps, annotate with Thai land area measurements (rai/ngan/talangwah), and produce branded property marketing materials (listing cards, banners, open house flyers) — without server dependency or subscription design tools.
03 Solution
Built a client-side SPA canvas editor using SvelteKit with IndexedDB for local document persistence. Supports map-backed pages (Mapbox street/satellite/terrain), geo-referenced layer positioning, and Thai land area unit calculation for closed outline shapes. Layer types: image, shape, outline, text, callout, group, marker. Style presets, template catalogue, and brand kit for repeatable property layouts. Full export pipeline: PNG, JPEG, PDF. Zero server dependency.
04 Outcomes
Qualitative
- Map-backed canvas with lat/lng geo-referenced layer positioning
- Thai land area calculation: rai, ngan, ngan, talangwah for closed outlines
- Haversine distance labels on outline edges
- Layer system: image, shape, outline, text, callout, group, marker
- Style preset library + template catalogue (property-card, listing-banner, open-house-flyer)
- Brand kit with colors, fonts, and preset references
- Export: PNG, JPEG, PDF with retina support
