The
vector graphic is one of the basic methods of image data storage. It is based on a mathematic description of curves, colors and color fillings, ensuring high quality reproduction independent on dimension.
In the
vector graphic the image consists of individual graphic elements (line, triangle, circle, filling, color gradients).
For example charts, schemes, logos, etc. can be stored in vector form. The vector format is not suitable for saving photo images.
There are many vector graphic formats, but the most promising these days seems to be the
SVG format, which is storing the data as a
XML file.
SVG is the abbreviation of
Scalable Vector Graphics. It is possible to edit the source code the same way as
HTML. The complete syntax of the
SVG-XML language can be found at
http://www.w3.org/TR/SVG11.
The
SVG objects are drawed subsequently in the order of creation. It can be grouped, formatted by means of the attributes or
CSS styles and positioned using general space transformations.
SVG support in the PROMOTIC system
The PROMOTIC system uses the
SVG graphics in the
PmaPanel object (in objects
PmgRasterImage,
PmgButton,
PmgButtonState, as stream animation in the
PmgPipe object, etc.)
It can be used a logically structured
preset technological images palette (in the
SVG format) for graphic selection in the PROMOTIC system. The preset palette contains preview and description of each image. The preset images are divided into logical groups (e.g. boilers, engines, pumps, electronics, ...).
The
full SVG format syntax is not supported in the PROMOTIC system. Following
SVG features are not usable in the PROMOTIC system:
- raster images (raster images)
- text objects
- scripts
- animations
- filters
- some tags (<desc>, <title>, <metadata> ...)
- some tag properties (viewBox, stroke-dasharray, ...)
SVG editors
Simple SVG graphic projects can be created by means of the common
notepad. Some basic
SVG syntax knowledge is presumed. It is possible to get inspired by the preset images located in the
\Promotic\PmVXXYY\Resource\Img folder.
There are multiple SVG vector graphic editors available on the Internet.
The commercial products are usually available as limited (demo) versions (
Illustrator,
Freehand,
CorelDraw, or
Xara X).
As for non-commercial products you can find for example the
FIGMA editor (
https://www.figma.com),
Inkskape editor (
http://www.inkscape.org), or
svg-edit (
http://code.google.com/p/svg-edit), that can be used without installation directly in the Web browser.
Handy hints for SVG graphics creation:
- The PROMOTIC system includes some limitations that have to be considered while creating SVG graphics. It is useful to check the project by viewing it through the
PmaPanel object of the PROMOTIC system.
- The programs are usually processing the source syntax transformations when moving the graphic objects. It is useful to check Optimalization in the Transformation, Save transformation: section of the Inkskape program. In another programs it is for example Apply transformation, ...
- Some programs keep the project semifinished when saved usually (signs, editing notes). When saving the final version of the project in Inkskape it is necessary to choose Plain SVG(*.svg) in the File/Save as ... section.
- The source code of images created in svg-edit and FIGMA is very well arranged. There are no needless transformations created when the position of the graphic objects is modified and the resulting image is correctly usable in the PROMOTIC system. This tool is recommended for creating SVG images for the PROMOTIC system.