Hello all!
I am using some Cognex cameras that store (through FTP) images and SVG files in the same computer Ignition is installed on. Cognex configuration program allows to choose the image format between .bmp and jpg.
The SVG file saved, is somehow referencing to the image with the same name in the same folder. The SVG contains some coloured and arrows squares that indicate status and position about the inspections. Please see an example below of opening the SVG file in the browser:
I want to show this SVG (image + overlayed graphics) in a Perspective view, dynamically via script. Currently, I am successfully able to show an image in an Image component using this script:
import base64
import os
mainFolder = system.tag.readBlocking("[NOMAD_TAGS]main_dir")[0].value
fileName = "CAM4_Omega6.bmp" #It also works for png and jpg formats
path = os.path.join(mainFolder, fileName)
path
if os.path.exists(path):
bytes = system.file.readFileAsBytes(path)
base64EncodedStr = base64.b64encode(bytes)
b64Image = "data:imagef;base64,"+ base64EncodedStr
system.tag.writeBlocking("[NOMAD_TAGS]Borrar", [b64Image]) #this tag is binded to the source prop of the Image component
else:
print("Path does not exist.")
But I am struggling to show the SVG file similarly. Please find attached two files as an example (SVG and its corresponding bmp image).
One interesting thing is that, if I open the SVG with notepad (seems XML) and insert a comment where the image is referenced (line 3), the view is just exactly the graphics:
What can I do to correctly process through script the SVG file and show it in a perspective component?
I am in contact with support (@Dechen_Chuteng ) and we are not finding a solution for now. But I am sure there must be some workaround, that is why we agreed to ask the forum.
Approaches we have tried/thought:
-
Use the same script above, but pointing directly to the .svg file. Nothing shown in the Image component, although something is written into the tag.
-
Use a third-party library like CairoSVG, pyvips, inkscape, wand, svglib. Please see link1 and link2. Dee only checked CairoSVG library, and she discovered that it is not valid for Ignition. The idea here may be to save/export a temporary file that it is the PNG/JPG conversion result of the SVG file, and run the same script pointing to this temporary file. Or even better, from any function of above libraries, get the data and transform in something that can be shown directly in a perspective view (similarly of what I have done with base64 encoding), so I do not have to play with files.
-
Throwing the SVG (with or without the line comment above mentioned) manually into a perspective view (creates a "Drawing") results in the following:
- Importing manually the SVG file, into the Image Management Tool, and updating the source prop in the Image component:
*Please note the graphics look different than 3.
- Importing manually the SVG file with the line comment, into the Image Management Tool, and updating the source prop in the Image component:
*Please note the graphics look different than 3.
- Check webdev module trial.
Looking at points 5 and 6, is there a way to upload files into the Image Management Tool through script?
Could anybody more experienced carry out some tests or give us some tips?
Thank you so much in advance!
But no problem anymore, as long as the svg and the image have the same name. It is very clear visually.
