Canvas

Canvas Subsystem

Started in	05/2012
Description	Dynamic 2D drawing at runtime using the property tree and scripting (for instruments, HUDs, GUIs)
Maintainer(s)	TheTom
Contributor(s)	User:TheTom (since 02/2012),
Status	Under active development as of 02/2013
Folders	$FG_SRC/Canvas $SG_SRC/simgear/canvas
Topic branches:
$FG_SRC	(main repository, next branch)
fgdata	(main repository, master branch; https://gitorious.org/~tomprogs/fg/toms-fgdata/commits/canvas-gui-demo)
Subforum	http://flightgear.org/forums/viewforum.php?f=71

Canvas - the FlightGear 2D drawing API
Canvas - Main Page Canvas News - for the latest developments Shiva Alternatives - ongoing work for Core Profile support Canvas Efforts - projects using the Canvas system Canvas FAQs - frequently asked questions Canvas - Getting started Canvas Development (core) Canvas Troubleshooting (core) Canvas Sandbox (core) PUI2Canvas (PUI/XML Parser) Canvas GUI Canvas Widgets Canvas Maps Canvas Snippets
RFC
Canvas Instancing Howto:New Canvas Execution Model Canvas SVG Canvas Popout Windows Canvas Scenery Overlays
Frameworks
Canvas Map API (soon deprecated!) Canvas MapStructure Canvas MapStructure Layers MapStructure Snippets Canvas Radar Canvas Animation Framework (WIP) Canvas Plotting Framework (WIP) Canvas MFD Framework Canvas ND Framework Canvas PFD Framework Canvas MCDU Framework Canvas EFB Framework Canvas Wrappers Canvas Glass Cockpit Efforts
Tutorials
Howto:Getting started with Canvas Howto: Canvas Troubleshooting Howto:Adding a canvas to a GUI dialog (PUI!) Howto:Creating a Canvas GUI dialog file (New) Howto:Dynamic Liveries via Canvas (new) Howto:Creating a Canvas GUI Widget Howto:Add a 2D canvas instrument to your aircraft Howto:Parsing 2D Instruments using the Canvas Howto:Creating fullscreen Canvas applications Howto:Use SVG inside a Canvas Howto:Extend the Canvas SVG module Howto:Serializing a Canvas to SVG Howto:Canvas applications as Nasal submodules Howto:Using raster images and nested canvases Canvas HUD Howto:Project 3D to 2D coordinates on desktop canvas
Reference
Canvas Element Group Image Map Path Text Canvas Nasal API MessageBox Layout System Canvas GUI API Canvas draw library Event Handling
Related
Canvas Properties Unifying the 2D rendering backend via canvas Howto:Use a Camera View in an Instrument Howto:Extending Canvas to support rendering 3D models Howto:Extending Canvas to support MathGL
To be ported
Navigation display Map FGCanvas Canvas Nasal/JavaScript Subset
Deprecated by Canvas
Complex Glass Cockpit Avionics
(click on headings to toggle)

Intro

The "Canvas" system is a fairly new feature, added in 06/2012 to FlightGear - first available in FlightGear 2.8

In FlightGear, a "canvas" is a dynamically created texture that can be modified (drawn to) at runtime by using the property tree, i.e. via the built-in scripting language Nasal. Canvas textures can be used for a number of different purposes, such as creating fully scripted avionics (airliner/bizjet -style glass cockpits) but also custom HUDs and eventually also custom GUI textures or even fully interactive GUI widgets (scheduled for FG 3.0+).

The canvas subsystem is entirely implemented on top of the FlightGear Property Tree, it makes use of property listeners to watch a sub tree of the property tree for canvas-related events, so that textures can be dynamically instantiated and modified by setting properties in the property tree. This method is not specific to Nasal scripting, the same system can be used by other subsystems (such as the Telnet or HTTP daemons) to create and modify textures without directly using Nasal.

As of 08/2012, the Canvas system is still under active development and nothing is set in stone yet. See Canvas Properties for further information.

A first prototype of the canvas system is available in FlightGear 2.8, this lacks some features currently under development (notably the Nasal API)- it is expected that a more feature-rich version will be available in the following release, i.e. FlightGear 3.0+ - possibly replacing the entire GUI with a fully Canvas-driven implementation in scripting space (one of the long-term goals).

Future FlightGear versions will contain reimplementations of currently hard-coded instruments such as the wxradar, tcas or navdisplay using the canvas system, so that these can be easily maintained as part of the base package, and so that the same backend code can be also used for creating complex dialogs using the Canvas system, such as ATC displays like ATC-FS.

Among other advantages, this will also provide for an opportunity to run Canvas-based instruments and GUI elements in another process, or even on another computer, analogous to FGPanel (see FGCanvas).

Also, there's currently work ongoing to port the old 2D panel and HUD systems to the new Canvas system, using custom Nasal wrappers reimplementing the old behavior and turning the textures into canvas properties.

Gallery

A short video demonstrating a possible usecase (C-130J AMU):

By using alphablending it can also be used to render the contents of a HUD:

In my branch there is now also support for using the canvas in a gui widget:

Using the Canvas as a GUI widget

With the new map element it is also very easy to draw maps:

Simple Map of KSFO

Using the new canvas.parsesvg function to use an SVG file to simulate an EICAS display:

Demonstrating how the new Canvas GUI wrapper can be used to create entirely custom, scripted GUI widgets using XML, SVG and Nasal:

Experimenting with selecting text and positioning a cursor inside the text. The visualization is all done using Nasal.

Since 07/2012, the canvas system also provides support for full window-drawing:

Omega95 has reimplemented the CDU of the ATR72 using the Canvas system:

Another video demonstrating window stacking and nested canvases:

Using Canvas mouse events to create animation of slider, wheel and knob