Custom Node Icons Not Displaying Properly

[KAaron]

While building this tour, my custom node icons and control icons all displayed just fine in the output when viewing in Safari. I have a problems seeing with Chrome Pano2VR output and chrome. Haven't had a chance to investigate fully. I built a custom skin using sillhouette components.

But in the GGPKG Viewer many of the node icons don't display properly. They are svg files. Like the plus sign for zoom in, they are a small graphic on a color background. I've attached 2 screen shots, the first is from the GGPKG Viewer showing the problem, the second is from Safari where output works just fine.

In the GGPKG Viewer the nodes function properly. I move to the next pano, or display the information box, and the navigation buttons work. They just don't display the icon itself. And the zoom in button that displays was created exactly the same as all the others. PSD file the is exported to svg.

This same thing happens in Chrome when I view my output there, along with the slow performance.

I switched skins to silhouette_v6 just to see what happens and it displays just fine in the viewer. So why does the viewer (and chrome) have a problem with my SVG files, that have worked previously?

I'm on a Mac. Catalina, 2017 machine, lots of ram and storage. I'm on version 6.1.10 of Pano2VR, and version 1.3.0 of the viewer. These issue seem to have appeared with my update to Pano2VR before this project.

I can't send a link because this is not published for the public to view. These are home inventories that are delivered on a flash drive and use the viewer.

Help! I need to get this to my client.


UPDATE: I found a solution and am now just trying to understand why. In the Skin Editor I selected Change To Button under Properties > Image. Everything works fine.

Why did Change to Button solve my problem?
Why won't Pan2VR work with my svg files in Chrome and GGPLG Viewer, but will in Safari and Chrome?

[Hopki]

Hi ,
Not all SVGs are the same.
Some SVGs are actually PNG in an SVG wrapper.
Be wary of some websites that convert to SVG.
You can use pNG files, just make them twice the size you need, add to the skin then use the /2 button.
The idea is you can then have a PNG with twice as much information for High DPI displays.
Regards,