Canvas concepts - An introduction

From FlightGear wiki
Jump to navigation Jump to search
This article is a stub. You can help the wiki by expanding it.

Objective

Introduce important Canvas concepts and terminology, inspired by Thorsten's thread on the forum [1]

Canvas knows text elements, line segments (potentially combined into shapes filled with a color) and raster images. They may or may not form groups. Each element/group can be translated, rotated, scaled, hidden or clipped. For instance an airspeed tape is a filled rectangle shape with lines as the scale and text added, ideally combined into a group. The whole group is translated with an airspeed-dependent factor and placed into a clipping rectangle, so that only the portion just visible appears. An alphanumerical gauge is a text element placed at a screen position for which the text is set to the value of a property in every update cycle. A compass arrow is a filled closed path of lines which is translated from the compass center and then rotated with the heading. That's the idea of canvas in a nutshell. You can define all these elements in canvas directly, or you can create them on as SVG and read the SVG and then reference the elements by their name in the SVG file - after the parser stage, it's pretty much all the same, SVG elements end up being canvas elements.[2]

Background


What is a Canvas

Here's the main concept (found by googling "canvas 2D"): https://en.wikipedia.org/wiki/Canvas_element

In FlightGear, things are a bit different, mainly in that [3]:

  • a Canvas represents an actual off-screen OpenGL texture (2D) (FBO/RTT)
  • is hardware-accelerated
  • is using OSG for most of its features
  • there is an actual scenegraph
  • uses Nasal instead of ECMAScript/JavaScript

What is a Canvas element

References

References