[Resolved] Map marker size for better quality map marker
This thread is resolved. Here is a description of the problem and solution.
Problem:
Resize PNG and SVG markers for a better quality. On mobile view, the PNG marker is displayed pixelated. Solution:
I checked it and the SVG markers are always resized to 32x32
There's a workaround to avoid it. You'll find the code line that controls this at line #565, in the file: "/toolset-maps/resources/js/wpv_addon_maps.js":
var scaledSize = new google.maps.Size(32, 32);
You could change the size value in the actual plugin file if needed, but since this part of code is not filterable, it is not possible to change it with a hook for example, you'd have to edit the file itself. ( please note that you'll need to keep track of this edit, as future plugin updates will overwrite any changes )
I also checked that PNG files are shown in the map with the same size they've been uploaded, it is necessary to work with the image and upload the final version to use it.
This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.
Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.
Tell us what you are trying to do?
I try to use an SVG or PNG-image for a map marker.
The problem is, that if I use a PNG the quality is bad so it's displayed a bit pixelated. If I try to upload a PNG bigger than 32px (for having better quality) it didn't work neither.
So I would like to upload a png bigger than 32px for having a better quality but only shown in 32px.
Alternatively I would like to upload a svg and be able to estimate the size of it.
Hi, thank you for reply.
It's not a problem to upload svg for me.
Maybe I should explain it better.
Right now I use a png-Map marker-icon and a svg-marker-icon on hover.
Problem is when I use a "normal "svg map marker-icon" and a svg-marker icon on hover it changes the size on hover so everytime I hover over it the size is getting smaller.
It would be fine if it would get bigger but it's not working like this.
So I thought maybe better to use a "normal png- map marker-icon". But the problem is that the quality is not that good in 32x32
Thank you for providing me with that extra information.
I checked it and the SVG is indeed resized by default to 32 x 32 px. I checked this but I'm afraid that this is not customizable as of now.
You'll find the code line that controls this at line #565, in the file: "/toolset-maps/resources/js/wpv_addon_maps.js":
var scaledSize = new google.maps.Size(32, 32);
You could change the size value in the actual plugin file if needed, but since this part of code is not filterable, it is not possible to change it with a hook for example, you'd have to edit the file itself. ( please note that you'll need to keep track of this edit, as future plugin updates will overwrite any changes )
Regarding the PNG having a bad quality, I tried to reproduce it but so far I wasn't able to. Are you able to provide me with an example of a PNG file that you're using so I can debug this and try to come out with a solution? You can upload it to your site for example and share the link here. This will help me investigate this issue.
I've checked it and I can confirm that when you use a PNG marker, it will retain the same size as when you originally uploaded it to the media. Therefore, you need to use a high quality icon and resize the PNG marker outside WordPress and upload the final version. There's a feature request to include a resizing option in future versions, but currently, there's no way to programmatically change the size of the PNG marker, not even with CSS rules.
Until this feature is implemented, the workaround available would be to either use SVG icons or upload the PNG markers in their intended size.
While this feature has been requested, I'm afraid I can't provide an ETA for its release.
