Discussing the article: "MQL5 Trading Tools (Part 13): Creating a Canvas-Based Price Dashboard with Graph and Stats Panels"
You are missing trading opportunities:
- Free trading apps
- Over 8,000 signals for copying
- Economic news for exploring financial markets
Registration
Log in
You agree to website policy and terms of use
If you do not have an account, please register
Check out the new article: MQL5 Trading Tools (Part 13): Creating a Canvas-Based Price Dashboard with Graph and Stats Panels.
In this article, we develop a canvas-based price dashboard in MQL5 using the CCanvas class to create interactive panels for visualizing recent price graphs and account statistics, with support for background images, fog effects, and gradient fills. The system includes draggable and resizable features via mouse event handling, theme toggling between dark and light modes with dynamic color adjustments, and minimize/maximize controls for efficient chart space management.
The canvas-based price dashboard framework leverages the CCanvas class in MQL5 to create custom graphical panels for displaying real-time price data and account metrics, offering a compact, interactive alternative to standard chart indicators for users needing quick visual overviews without cluttering the main chart. It consists of a main graph panel plotting recent bar closes as a line with filled areas and fog effects for depth, an optional stats panel showing account details like balance/equity and current bar OHLC, both supported by background images with opacity blending, gradient or solid fills, and double borders for aesthetics.
Enhancements include mouse-driven dragging for repositioning, resizing via border hovers and grips with icons for feedback, minimize/maximize toggles to collapse panels, theme switching between dark/light modes for color adjustments, and real-time updates on new bars to reflect the latest prices and stats.
These features use event handling for mouse interactions, bicubic scaling for smooth image resizing, alpha blending for overlays like fog, and ARGB color management for transparency, ensuring the dashboard is responsive and customizable without native MQL5 objects, which was our main goal since we have used the native objects a couple of times now; we change the approach this time round and fully explore the canvas features instead.
Our plan is to include the canvas library, define inputs for positions/sizes/colors/opacities/modes, load and scale a background image resource, create separate canvases for header/graph/stats with creation checks, implement drawing functions for headers with icons/tooltips/borders, graphs with price plotting/filling/time labels/resize icons, and stats with themed text/gradients/darkened borders, add helper functions for color interpolation/darkening/blending/ARGB extraction, and handle chart events for hovers/drags/resizes/toggles with clamping/minimum sizes, updating on ticks for new data. In brief, here is a visual representation of our objectives.
Author: Allan Munene Mutiiria