Is it possible to import a graphic with a transparent background into Ignition and maintain the transparency? I tried simply importing one as a picture and it added a white background to it.
I believe the .png file format supports transparency, not sure about the other types. So if you have a .png w/ transparent parts, it should carry over.
If you have trouble with that, you might be able to use the “Color Swap Filter” property in the image component to set, say all white to a color with no alpha component.
Thanks for your suggestion @mrogers. I am having this same issue as well - using a transparent .png, and importing using the image management tool, the image appears with a white background.
I tried this suggestion you offered with the color swap filter, and it almost works for me! However, there are still some “white” pixels (I’m guessing not quite 255,255,255) remaining with the image I would like to use.
Do you think it would be possible to selectively filter using scripting if, say, the RGB values are greater than those in the “filter” set, instead of simply equal to those values?
actually I found a much simpler solution. Simply convert the PNG into a SVG and then drag and drop onto your designer it will work perfectly. there are free conversion tools online.
Thanks for your suggestion @afarzin. I have tried a number of different free converting tools - some of which lost color, and for those few which I could actually get it to “work” (i.e., appear to retain color and look the same), dragging and dropping the image into a Designer window appears to lock up the designer (i.e., I get the loading circle in place of the mouse icon).
I have tried doing this and received the same result for projects on two separate gateways as well. Did you experience anything like this?
I did not experience any loss of quality or change in anyway to the graphics. I use Gravit Designer for the conversion. It is free.
I did have one of my graphics glitch out in designer when dragging it in (loading circle), but it was extracted from the same source vector file as a bunch of other graphics which worked fine, so I figured it’s just a corruption somewhere in the conversion process and was going to try it again.
My weapon of choice for such things is GIMP. The Color-to-Alpha function works well, and has a settable threshold. I primarily use PNG files here.
But, on the days when a PNG just won’t do, I use Inkscape for SVG files
2 Likes
I don’t believe either of those programs can convert a PNG to SVG, but i do like both for editing.
I’ve been able to manage an almost-good conversion in Inkscape, where I can drag the resultant SVG in without issue. I was able to do a perfect conversion in Gravit Designer, but again, the same issue of not being able to drag it in. Strange. Both seem like great tools though, thanks for the suggestions all! I’ll have to revisit this next week.
Inkscape is SVG under the hood, but I came across Paul Lynch’s youtube video on how to convert a bitmap file to an Optimized SVG.
1 Like
Just wanted to follow up with what I tried and what I went through and what finally worked for me, allowing me to retain the transparency I had with the original PNG (a company logo, with 5 colors):
-
Using the Image Management tool in the Designer, transparency with the the PNG was not retained, only a white background (appeared in both the designer and when published)
-
“Converting adventure” - tried a number of different freely available tools for converting online, most converted the image to black and white, and with distortion.
-
Inkscape - downloaded this freely available software, and followed some different tutorials to convert bitmaps to SVG.
3.1) For one conversion, I obtained a less than perfect representation of the company logo, but overall pretty good.
3.2) Saved as an SVG, but only after I resized the page to the size of the image and THEN saved as an SVG was I able to drag it successfully into the designer. Interestingly, the file size of this image (the only converted one which would end up working) was about twice that of the other converted images I tried.
3.3) For other conversion attempts in Inkscape, would drag in the new SVG and experience the “loading” circle indefinitely, only stopped if I dragged in an SVG that worked (e.g., the SVG from 3.1) -
Gravit Designer Online - suggested above, I used this to try converting and to no avail, experienced the loading circle after dragging the new SVG into the designer
-
For grins, on a new day, figured I would try uploading the original PNG through the Designer’s Image Management tool again to try and reproduce the issue. I inserted an image component and chose this image’s path, same as before, and VIOLA - the transparency was retained this time around. No idea what was different other than the day. So, good luck to anyone else who experiences this… goes to show, coming back a another day may be all it takes.
This occurred on a new machine running Windows 7 and Ignition 7.8.
1 Like
