Custom Waypoint Symbol Transparency Issue

Discussion related to GPSrChive 'How To...' pages
nahannidog
Posts: 7
Joined: Wed Sep 14, 2022 4:44 am

Custom Waypoint Symbol Transparency Issue

Unread post by nahannidog »

Hi,
Been working through the great tutorial on doing this https://www.gpsrchive.com/Shared/Custom ... mbols.html. Thanks to whoever put this together.

I'm having problems with one particular step however. Trying to make symbols with transparent backgrounds, i.e. map shows behind the symbol 32x32grid, except where there are symbol pixels. I tried first with No background, pls see images #1 & #2. Result was Basecamp showed with a solid white background. So, I went back to the tutorial and saw that he preferred way is to use magenta background, which Garmin Basecamp & GPSr translates to transparent. Pls see images #3 & #4. For some reason now, the bottom edge of my symbols have a smudge of magenta in the bottom of the symbol.

Here are 4 example images of what is described above:
1. Symbol w/o magenta, only red and green vectors, as seen in PaintShop Pro image editor

Gate with checkerboard background.bmp



2. How #1 image appears in Basecamp, a screenshot from Basecamp. Has a white background for some reason

Gate with Checkerboard background, screenshot of as viewed in Basecamp.jpg

3. Symbol with added Magenta flooded in background, as seen in PaintShop

Gate32-02-Vector + Raster Paint with 100pixel brush-move gate up.bmp

4. How #3 image appears in Basecamp, a screenshot. Mostly transparent except magenta smudge on the bottom edge

Gate with flooded Magenta background, screenshot as viewed in Basecamp.jpg

Any ideas how to get a clean transparent background?

(Hopefully the 4 example images will show when posted, preview only shows the Image URL's)

[Gr] - Please Upload all Images using attachments tab below text edit window, do not hot link external images!
You do not have the required permissions to view the files attached to this post.
User avatar
GPSrChive
Site Admin
Posts: 3882
Joined: Fri Jan 20, 2017 11:29 pm

Re: Custom Waypoint Symbol Transparency Issue

Unread post by GPSrChive »

Glad to hear you are finding the GPSrChive Custom Waypoint Symbols tutorial helpful!

We almost immediately knew what we were going to discover that is causing your issue, and after inspecting your waypoint symbol images, we found a common mistake that is easy to correct.

At some point during your image creation process, you are performing a task that requires your image editing software to resample each pixel and blend them with surrounding pixels (almost always an image resize operation). This will almost always result in some magenta pixels being influenced by adjacent pixels, and while they will still look the same to the human eye, they do not look the same when processed by the Garmin GPSr.

Here is a pixel in the top half of your waypoint symbol - the color is RGB 255, 0, 255 (Hex FF00FF) - perfect Magenta.

Magenta 255 - 0 - 255.png


Here is a pixel from the lower band of the same image - the color is RGB 245, 10, 245 (Hex F50AF5) - almost but not quite perfect Magenta.

NOT Magenta 245 - 10 - 245.png


If you look closely, you will see that all of the red pixels that have adjacent magenta pixels are no longer the same red color as those without magenta pixels adjacent - this will lead to 'pinkish' edges in your final waypoint symbol, which may not be instantly apparent to the human eye here due to their close proximity to the desired color being displayed (in this case red).

Also, the top and bottom pixels of the green vertical bar are not the same color as the remaining pixels.

Any pixel that is not perfect Magenta (RGB 255,0,255) will not be displayed as transparent by the Garmin GPSr, so all you have to do is be very careful about what actions you are having your image editing software perform, and always double check all magenta pixels when you think you are finished with each symbol.

When I create custom symbols, I always work with a transparent background, similar to what you have in the first image, then I manually add the pure Magenta (RGB 255, 0, 255) as the final step. I will save two copies of each symbol, one before the Magenta is added (usually a PNG), and one after the Magenta is added (the required BMP).

I hope you find this information helpful and please do share with us your final results once you have made the final corrections!

And, please, upload your images using the 'Attachments' tab at the bottom of the screen while composing your post. Please do not hotlink to external images.

Thank You!
You do not have the required permissions to view the files attached to this post.
nahannidog
Posts: 7
Joined: Wed Sep 14, 2022 4:44 am

Re: Custom Waypoint Symbol Transparency Issue

Unread post by nahannidog »

GPSrChive wrote: Wed Sep 14, 2022 1:20 pm At some point during your image creation process, you are performing a task that requires your image editing software to resample each pixel and blend them with surrounding pixels (almost always an image resize operation). This will almost always result in some magenta pixels being influenced by adjacent pixels, and while they will still look the same to the human eye, they do not look the same when processed by the Garmin GPSr.

Here is a pixel from the lower band of the same image - the color is RGB 245, 10, 245 (Hex F50AF5) - almost but not quite perfect Magenta.
Thank you. I had a hunch that something like the blending you were describing was happening, but didnt have the skills or tools to prove it. May I now ask some very much more focused questions on the matter?

1. When you create a custom icon, do you start in 32x32 pixel size, so you dont have to downsample and risk the color blending?

2. Your attachments show the capability of inquiring of individual pixel properties. I'm not an expert on my image editor Paintshop Pro, but havent found such a capability. What image editor are you using, and would you think identification of individual pixels is a common capability of most image editors?
When I create custom symbols, I always work with a transparent background, similar to what you have in the first image, then I manually add the pure Magenta (RGB 255, 0, 255) as the final step.
3. When you say "manually add" are you referring to some capability to select the properties of each individual pixel? i.e. you don't flood the whole grid with magenta?
And, please, upload your images using the 'Attachments' tab at the bottom of the screen while composing your post. Please do not hotlink to external images.
Thanks, couldn't figure out how to do otherwise, missed the attachments tab.
User avatar
GPSrChive
Site Admin
Posts: 3882
Joined: Fri Jan 20, 2017 11:29 pm

Re: Custom Waypoint Symbol Transparency Issue

Unread post by GPSrChive »

nahannidog wrote: Wed Sep 14, 2022 7:49 pm 1. When you create a custom icon, do you start in 32x32 pixel size, so you dont have to downsample and risk the color blending?
When creating custom waypoint symbols for Garmin devices, this can be the most efficient method. However, you may want the specific icon you are working with to include some blended edges to achieve a more refined and less granular appearance, and this is why I always create the symbol with a fully transparent background first, resize as necessary, then fill the desired transparent portions of the finished product with Magenta before saving the BMP for use with my Garmin devices.

nahannidog wrote: Wed Sep 14, 2022 7:49 pm 2. Your attachments show the capability of inquiring of individual pixel properties. I'm not an expert on my image editor Paintshop Pro, but havent found such a capability. What image editor are you using, and would you think identification of individual pixels is a common capability of most image editors?
The image editing software I am using is listed near the beginning of the Garmin Custom Waypoint Symbols tutorial. I have been using the same software for so many years, I have no idea what others can or can not do, but this seems like a very basic feature.

nahannidog wrote: Wed Sep 14, 2022 7:49 pm 3. When you say "manually add" are you referring to some capability to select the properties of each individual pixel? i.e. you don't flood the whole grid with magenta?
Yes and No.

I will sometimes select an 'area' and fill with Magenta (255, 0, 255), while other times I find it necessary to fill individual pixels one at a time to achieve the results I desire. Since we are working with very small images, this option requires little additional time.

What you do not want to do is add a Magenta Layer below your waypoint symbol image that includes transparent pixels, and then combine them, as this will almost always result in the 'blending' issue referenced earlier.
nahannidog
Posts: 7
Joined: Wed Sep 14, 2022 4:44 am

Re: Custom Waypoint Symbol Transparency Issue

Unread post by nahannidog »

GPSrChive wrote: Wed Sep 14, 2022 8:06 pm
nahannidog wrote: Wed Sep 14, 2022 7:49 pm 3. When you say "manually add" are you referring to some capability to select the properties of each individual pixel? i.e. you don't flood the whole grid with magenta?
Yes and No.

I will sometimes select an 'area' and fill with Magenta (255, 0, 255), while other times I find it necessary to fill individual pixels one at a time to achieve the results I desire. Since we are working with very small images, this option requires little additional time.

What you do not want to do is add a Magenta Layer below your waypoint symbol image that includes transparent pixels, and then combine them, as this will almost always result in the 'blending' issue referenced earlier.
Cool! Your advice got me over a many hours long road-block in progress. With Paint Shop Pro, I had to set up a "grid" of resolution = 1pixel x 1pixel, then set my "paintbrush" and "eraser" size to 1 pixel and "snap resolution" to 1 pixel. Powerful program, and consequently very difficult to get started.

Speaking of roadblocks, I've attached a screenshot of how my symbol appears in Basecamp. It's meant to be a road blocked by a closed gate. Been running into alot of those in many contexts, lately.

Gate32-02-Vector + Raster Paint with 1 pixel brush, rectangular gate-screenshot as seen in Basecamp.jpg

And how it appears in Paintshop

Gate32-02-Vector + Raster Paint with 1 pixel brush, rectangular gate-Screenshot of appearance in PaintShop.jpg
You do not have the required permissions to view the files attached to this post.
User avatar
GPSrChive
Site Admin
Posts: 3882
Joined: Fri Jan 20, 2017 11:29 pm

Re: Custom Waypoint Symbol Transparency Issue

Unread post by GPSrChive »

Excellent! Those look much better!

What model Garmin GPSr are you using them with?

Thank you for sharing your results!
nahannidog
Posts: 7
Joined: Wed Sep 14, 2022 4:44 am

Re: Custom Waypoint Symbol Transparency Issue

Unread post by nahannidog »

GPSrChive wrote: Wed Sep 14, 2022 11:15 pm What model Garmin GPSr are you using them with?
Montana 650T. I hadn't spent much time on the Montana custom symbol side, and have found some weird problems...maybe you anticipated these problems and so asked about the GPSr? :o

When I connect the Montana to the PC, and view the Montana /Garmin/CustomSymbols directory, everything looks fine (after some leading zeros cleanup!). See screenshot

Montana 650T CustomSymbols file listing.jpg

But when I create a new or edit a waypoint in Montana, the palette of icons is in some not quite numerical order (and one doesnt show, that might be a different problem). So I tried erasing the contents of /Garmin/CustomSymbols, restarting Montana, reconnect to PC and reload the symbols. Now the palette is in numerical order, but starting at 33, 34-58, 1-32. Not too annoying, except when trying several variations of a symbol and not knowing for sure in which order the Montana palette is displaying. See Montana symbol palette screenshot, Upper left icon is Custom 33.bmp

Montana custom symbol screen capture after erase then reload entire folder-20220914..jpg

Any idea what's going on?
You do not have the required permissions to view the files attached to this post.
User avatar
GPSrChive
Site Admin
Posts: 3882
Joined: Fri Jan 20, 2017 11:29 pm

Re: Custom Waypoint Symbol Transparency Issue

Unread post by GPSrChive »

Each time the Garmin GPSr powers on, it indexes all data in device memory and microSD when present. Files missing since last index are removed, and new or modified files are added and updated.

The order in which all this occurs is not known, but it is known that existing data may not be indexed in the same order every time. So while your maps and GPX files and custom icons etc etc may be listed in a different order after a fresh indexing, they will still be available.

I have two pages of custom symbols on most of my devices, but I never really paid much attention to the order in which they are displayed. So long as they are present, I am happy.

Have you been able to determine why one of your custom symbols is not appearing yet?
nahannidog
Posts: 7
Joined: Wed Sep 14, 2022 4:44 am

Re: Custom Waypoint Symbol Transparency Issue

Unread post by nahannidog »

GPSrChive wrote: Thu Sep 15, 2022 2:32 pm
I have two pages of custom symbols on most of my devices, but I never really paid much attention to the order in which they are displayed. So long as they are present, I am happy.
Yes, order is important only when trying to debug an icon and install 3-4 variations and see how they differ.
GPSrChive wrote: Thu Sep 15, 2022 2:32 pm Have you been able to determine why one of your custom symbols is not appearing yet?
the missing one was weird. It was an old custom icon, that I may have created with a different image editor years ago. Found if I simply opened and resaved it in PaintShop, it became visible in Montana again. The Mysteries of LIfe!

Back to the custom icon transparency issue, I've stumbled on something interesting. So far, have only looked at this from the Basecamp perspective. It's in regard to the opaque white background created by basecamp (rather than transparent, and not seen in the image editor) . I accidentally saved an icon as 003.png, and in Basecamp (v4.7.4) there is no white background, it is transparent. There is no magenta mask. I saved the same image as 003.bmp and it now has an opaque white background in basecamp. Attached 003.png and 003.bmp, as well as screenshots of how each appears in basecamp. This MAY make painting in the magenta mask unnecessary. Not sure what the different GPSr might do with .png files.

003.png
003.bmp
003.png as seen in Basecamp Screenshot-its transparent.jpg
003.bmp as seen in Basecamp Screenshot.jpg
You do not have the required permissions to view the files attached to this post.
User avatar
GPSrChive
Site Admin
Posts: 3882
Joined: Fri Jan 20, 2017 11:29 pm

Re: Custom Waypoint Symbol Transparency Issue

Unread post by GPSrChive »

Yes, it appears BaseCamp can use PNG also, but the GPSr will require the BMP with Magenta.

Just finished a quick test to compare how some of my Garmin GPSr listed custom waypoint symbols with the exact same symbols loaded to each device. The four models I just tested all displayed them in different orders. Montana 750i and Montana 700 both displayed them randomly when compared to each other, there was no visible pattern. And when comparing a GPSMAP 66i vs GPSMAP 66sr, same thing, no discernable pattern to their display sequence, and nowhere near close to the same, even with the exact same symbols loaded.

So, yeah, it is a crap shoot how they are listed/displayed.
Post Reply

Return to “How To...”