buuing/lucky-canvas
Lucky Canvas
Lucky Canvas is a canvas-based lottery component library that enables developers to build interactive prize wheels, grid-based lottery games, and slot machines for web and mobile applications. The project provides a rendering engine that draws directly on HTML Canvas elements, with automatic device pixel ratio scaling to ensure crisp displays on high-DPI mobile screens.
The library packages each lottery type as a self-contained plugin with its own configuration and rendering logic, and wraps the core canvas functionality in framework-specific bindings for Vue, React, Taro, and UniApp without duplicating game logic. Developers can assign configurable probability weights to each prize, control spin speed and acceleration through animation physics parameters, and attach callback functions that fire before a draw starts and after a prize is awarded.
The project supports creating configurable prize wheels with customizable segments, grid-based lottery games with custom cell positions and appearances, and slot machine games with configurable reels and spin direction. Each widget type offers programmatic draw triggers, prize odds configuration, and styling options for text and images within prize segments. The library can be installed via package managers and embedded into projects built with Vue, React, or Taro-based mobile apps.