Imported PNG symbol not rendering properly
Ciel
Traveler
Ahoy mappers!
So recently, I imported a symbol into my big map project that I've been making for years using the "Modern Political" annual style from 2010. MP comes with an airport symbol, it's basically a red silhouette of a plane at an angle, but I preferred the look of a symbol where the plane silhouette is inside a box. I found this neat icon here:
I used Symbol Manager > PNG import to get it into my map. I had to re-import it a few different times to play with the import settings, but regardless,there's an issue. See how the icon is surrounded by a black outline? Well, when I render the whole map as a PNG, that outline doesn't come through correctly:
This image is a small part of the map cropped from a large PNG (exported at 9000 x 8000 resolution) of the entire map. So while the image of the whole map is 9000 x 8000, this cropped piece by itself is only 372 x 301.
On the new airport symbol (the one on the left), see how the black outline isn't fully there? It's correct only on the left side. There's a bit of it in the upper right and lower right corners, but it's missing from the top, right, and bottom.
After seeing this, I made another PNG using the "export a rectangular section" option in CC3+, in order to produce an image focused on this same area, but at a higher resolution than the cropped image above (6000 x 5000). In THAT image, the outlines are all properly rendered and visible around the edge on all sides:
So is this a resolution problem? CC3+ is unable to properly render these outlines unless the res is extremely high (even higher than 9000 x 8000 for the full map, which I can't go above - I get a "not enough memory" error if I try to go higher than that)? I find that odd, since it has no trouble properly rendering other symbols that have an outline, such as the round multi-colored dots which mark cities (which you can see several of in this image). When importing the Airport symbol, I tried it with the "Hide picture outline" box both checked and unchecked. It didn't seem to make any difference.
So how could I go about fixing this so that that black outline is properly displayed when the full map is rendered? Is it possible I did something wrong when importing the PNG as a symbol? Thanks for any and all help!
So recently, I imported a symbol into my big map project that I've been making for years using the "Modern Political" annual style from 2010. MP comes with an airport symbol, it's basically a red silhouette of a plane at an angle, but I preferred the look of a symbol where the plane silhouette is inside a box. I found this neat icon here:
I used Symbol Manager > PNG import to get it into my map. I had to re-import it a few different times to play with the import settings, but regardless,there's an issue. See how the icon is surrounded by a black outline? Well, when I render the whole map as a PNG, that outline doesn't come through correctly:
This image is a small part of the map cropped from a large PNG (exported at 9000 x 8000 resolution) of the entire map. So while the image of the whole map is 9000 x 8000, this cropped piece by itself is only 372 x 301.
On the new airport symbol (the one on the left), see how the black outline isn't fully there? It's correct only on the left side. There's a bit of it in the upper right and lower right corners, but it's missing from the top, right, and bottom.
After seeing this, I made another PNG using the "export a rectangular section" option in CC3+, in order to produce an image focused on this same area, but at a higher resolution than the cropped image above (6000 x 5000). In THAT image, the outlines are all properly rendered and visible around the edge on all sides:
So is this a resolution problem? CC3+ is unable to properly render these outlines unless the res is extremely high (even higher than 9000 x 8000 for the full map, which I can't go above - I get a "not enough memory" error if I try to go higher than that)? I find that odd, since it has no trouble properly rendering other symbols that have an outline, such as the round multi-colored dots which mark cities (which you can see several of in this image). When importing the Airport symbol, I tried it with the "Hide picture outline" box both checked and unchecked. It didn't seem to make any difference.
So how could I go about fixing this so that that black outline is properly displayed when the full map is rendered? Is it possible I did something wrong when importing the PNG as a symbol? Thanks for any and all help!
Comments
Alternatively, you could remove the black outline in the png and add a vector outline in the CC3+ symbol.
Edit: Or even better yet, redraw that symbol completely as a vector symbol - it's a fairly simple shape and would then better match the other symbols of the Modern Political style.
I did a few calculations based on the actual symbol you sized, and the size which it is represented in the cropped image. This shows that at that size, the black line around the symbol is going to be 0.4 pixels wide. Now, images only operate in whole pixels, so when something is less than a pixel, a decision needs to be made if the size should be rounded up or down to the nearest whole pixel (0 or 1 in this case). Of course, since the pixel count in any image is finite, whenever you round up somewhere, you need to round down somewhere else, so you cannot simply round up everything. Something less than half a pixel is therefore a good candidate for rounding down. Different techniques are used by image renders to somehow offset this problem, but due to the pixels being a limiting factor, it can't always come out perfect.
This is a problem that ALWAYS happens when you render things out to an image from any program, it is just more noticeable when it happen to be a clear line like this. You can see a similar thing happen with the roads in your two samples.
Vector symbols have the advantage that CC3+ treats all their constituent parts as separate entities when rendering, making it less likely that a line or path will "vanish" in the rendering process. Try the attached symbol as an alternative and see how it renders.
One other thing, in case I find more PNG symbols I want to use down the road: It seems that "CC3 works better when the imported symbols are vectors rather than PNGs" is REALLY true, considering that change alone seemed to be enough to make this problem go away. A brief google search tells me I can use Inkscape to convert a PNG to a vector rather easily, so is that pretty much it? Make that change and then it's ready to be imported into CC3+?
And while inkscape can convert things, it is not a one-step process, as it can't create an image directly in the CC3+ vector format, you'll have to export it as an autocad file, and then import that into CC3+, which will net you all the outlines you need, but there is still quite some work left using these to recreate the original look of the image. And as Sue said, these outlines are also way too detailed.
I'll cross that bridge (the potential complexity or difficulty of trying to convert a PNG to a vector for use in CC3+) when and if I come to it.
And even though I already did, I'm going to thank Ralf again for just doing that whole conversion thing for me, lol. I still feel bad that I didn't see it until 4 months later, I somehow didn't notice that this thread I had made had new replies in it. So yeah, thank you again!