[Resolved] Map marker size for better quality map marker

[Author]

Posts

[sebastianB-7]

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.

Is there any documentation that you are following?
https://toolset.com/forums/topic/map-marker-size-can-they-be-made-larger-than-32px/

Thanks for helping out

[Mateus Getulio Supporter Languages: English (English ) Timezone: America/Sao_Paulo (GMT-03:00)]

Hello there,

If I understand it correctly, using SVG would suffice for you?

I tested it and while WordPress doesn't offer support to SVG by default you can add it with a third party plugin such as https://wordpress.org/plugins/svg-support/

After installing and enabling this plugin you will be able to add a custom SVG marker going to Toolset > Settings > Maps > Map markers

This marker will be available for you to use while creating your views/blocks.

Please give it a try and let us know if this solution is what you were looking for.

Best,
Mateus

[sebastianB-7]

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

[sebastianB-7]

I mean the size of the svg-map-marker also is too small. maybe you now how to "size it up"?

[Mateus Getulio Supporter Languages: English (English ) Timezone: America/Sao_Paulo (GMT-03:00)]

Hello there,

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.

Thank you, please let me know.
Mateus

[Mateus Getulio Supporter Languages: English (English ) Timezone: America/Sao_Paulo (GMT-03:00)]

Hello there,

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.

Best regards,
Mateus

[sebastianB-7]

Thank you for taking care about my problem.
I'm going to use the svg solution. Would be great to see a future update for resizing svg map marker 🙂