See: the
PmgCanvas object.
The
PmgCanvas object
permanently contains the drawing area (raster image in the memory -
bitmap) the size of the
Pmg object. The drawing area (the
CanvasCtx object) is available in the
onDraw event (
JavaScript) by the
pEvent.GetCtx(state) method. When drawing the object physicaly into the PROMOTIC panel window the current remembered content of the drawing area is used, the
onDraw event is not used for redrawing the area.
The concept of foreground/background:
If the animated 2D content is complex, large and some portion of it is changing rapidly, then the CPU load could be quite high. The possible solution of such situation is to divide the complex
PmgCanvas object up into two overlaping
PmgCanvas objects. One portion being static complex
background and the second part being
dynamic simple
foreground. The
Pmg object representing the dynamic foreground is embedded in the static background, constituting one compound
Pmg object. This is the standard solution used for creating most of the preconfigured
PmgCanvas objects.
The embedded
Pmg object (foreground) can access
Vars variables of the parent object (background). If the
Vars variables of the object item (background) are modified, the refresh of embedded object (foreground) is provided. See the "
In onDraw the pEvent.GetParentVar() method will be used" configurator.
The
PmgCanvas object allows
automated triggering of the onDraw event for redrawing the draw area
CanvasCtx if needed:
1) If the drawing area is not initialised (empty)
after opening the panel or
after change the size of the
PmgCanvas object, or
after calling the
CtxReset method. In this case the drawing area is always empty (transparent).
2)
If the input variables (
Variables) of the
PmgCanvas object were changed. The drawing method may request an existing drawing area, see
pEvent.GetCtx(1), or more commonly non-initialized (empty) drawing area, see
pEvent.GetCtx(0).
3)
If the variables (
Variables) of the
parent Pmg object (background)
PmgCanvas were changed (valid for embedded object - foreground).
The drawing area is redrawn in the
onDraw event only if changed. If no change occurs, then it is not necessary to use the script for redrawing the area and the remembered appearance is used. The
onDraw event can access only the values of local variables (
Variables) of the
PmgCanvas object, that are currently used as data interface of the drawing function. It can also use the
Pm object and the drawing area object
CanvasCtx. The scripting interface of the
CanvasCtx object enables most of the methods and properties for 2D drawing used in
HTML5 in the
<canvas> tag.
Advantages:
- Drawing in the script allows conditioned drawing, repeated drawing, recounting, obtaining and formatting values, (statements
if...else,
for,
Pm object, local variables
Variables, etc.).
- It is functional also in the
Web panel, drawing directly in client computer browsers, most browsers are supported. The properties and methods for drawing are present in the
CanvasCtx object. A standard
HTML5 <canvas> tag that is commonly supported; there are many exemples, editors and testers online.
- Faster than
SVG in
PmgRasterImage (localy and on the Web) and supports text displaying.
- when editing the
PmgCanvas object including the
onDraw drawing event the object is displayed immediatelly in the development environment (
in the graphics editor).
- The designers can use and modify the preconfigured objects based on PmgCanvas.
- On the Web, the graphics (drawing scripts) are integral part of the panel, there is no need to download any aditional graphic files.