Skip Navigation

[Resolved] Using snappy maps styles

This support ticket is created 7 years, 5 months ago. There's a good chance that you are reading advice that it now obsolete.

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.

Sun Mon Tue Wed Thu Fri Sat
- 9:00 – 18:00 9:00 – 18:00 9:00 – 18:00 9:00 – 18:00 9:00 – 18:00 -
- - - - - - -

Supporter timezone: Europe/Madrid (GMT+01:00)

This topic contains 4 replies, has 3 voices.

Last updated by Juan 7 years, 5 months ago.

Assisted by: Juan.

Author
Posts
#451594

Hi,

I added the new Toolset Maps. This is really amazing what it can do!

BUT, the only thing I wasn't able to do is styling the map. I would like to use styling from snazzymaps.com.

I tried adding their provided styles to the mapOptions in both the jquery.geocomplete.js and jquery.geocomplete.min.js and also tried putting it in the JS option of the ContentView as suggested in another post, none is working...

Don't know if styles : [code] is just not read/used, or if I need to add it somewhere else...

Would it be hard as a next update to add that option to the map interface? What can I do meanwhile?

Here's the code I tried to add to mapOptions:

styles : [{"featureType":"water","elementType":"geometry.fill","stylers":[{"color":"#d3d3d3"}]},{"featureType":"transit","stylers":[{"color":"#808080"},{"visibility":"off"}]},{"featureType":"road.highway","elementType":"geometry.stroke","stylers":[{"visibility":"on"},{"color":"#b3b3b3"}]},{"featureType":"road.highway","elementType":"geometry.fill","stylers":[{"color":"#ffffff"}]},{"featureType":"road.local","elementType":"geometry.fill","stylers":[{"visibility":"on"},{"color":"#ffffff"},{"weight":1.8}]},{"featureType":"road.local","elementType":"geometry.stroke","stylers":[{"color":"#d7d7d7"}]},{"featureType":"poi","elementType":"geometry.fill","stylers":[{"visibility":"on"},{"color":"#ebebeb"}]},{"featureType":"administrative","elementType":"geometry","stylers":[{"color":"#a7a7a7"}]},{"featureType":"road.arterial","elementType":"geometry.fill","stylers":[{"color":"#ffffff"}]},{"featureType":"road.arterial","elementType":"geometry.fill","stylers":[{"color":"#ffffff"}]},{"featureType":"landscape","elementType":"geometry.fill","stylers":[{"visibility":"on"},{"color":"#efefef"}]},{"featureType":"road","elementType":"labels.text.fill","stylers":[{"color":"#696969"}]},{"featureType":"administrative","elementType":"labels.text.fill","stylers":[{"visibility":"on"},{"color":"#737373"}]},{"featureType":"poi","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"poi","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"road.arterial","elementType":"geometry.stroke","stylers":[{"color":"#d6d6d6"}]},{"featureType":"road","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{},{"featureType":"poi","elementType":"geometry.fill","stylers":[{"color":"#dadada"}]}]

Thank you.

#451747

You should never edit Core Filed of the Plugin, but instead either enqueue a own CSS/JS file with the appropriate dependencies and priroties, or add this to the JS/CSS sections of the View.

You would need to traget the correct Classes and ID's using your CSS and JS. But those styles and JS codes are to change the otpions themseleves, and that is not as such possbile yet in Toolset Maps.

I will ask a Developer if there are plans in regard to this.

Meanwhile the only solution is to use Custom CSS and JS that applies to the proper classes and ID's in the View's JS/CSS sections.

#451967

Juan
Supporter

Timezone: Europe/Madrid (GMT+01:00)

Hi Nelson

Thanks for the feedback.

We have plans to include maps styling, coming from the offficial API, and provide support for the predefined map styles as seen in their official tool:
hidden link

However, this Snazzy Maps toolseems also interesting. I managed to download their free WordPress plugin from:
https://wordpress.org/plugins/snazzy-maps/
They claim that their WordPress plugin should work with any plugin using the JS Google Maps APi, liek we do, and I checked that it works properly for me. SImply install their plugin, select some map styles on their settings Explore tab, then Activate one of the themes and the Toolset Maps in the frontend will indeed use the selected style. Out of the box, no extra step or code needd.

If that is not your case, we might be facing a compatibility issue. Please describe the steps you followed and we will see what might b going wrong.

Hope it helps.

Regards.

#451974

Hi,

Thanks for the comments.

I didn't even know there was a snazzy WP plugin...! It works great!

Would still be good if you can integrate it, since:
1- Using their plugin requires the installation and setup of an additional plugin;
2- It seems like we need to pay if we want to use it on a commercial site...

But thanks for the tip meanwhile!

Nelson

#452002

Juan
Supporter

Timezone: Europe/Madrid (GMT+01:00)

Hi Nelson

Glad to see tha we were able to at least apply a workaround. And yes, our plan is to support native styling sets, so you can add your own set, store it, and apply it to any given map. We will include the native styles that Gogle created, and you will also be able to add your own.

But this feature is still on its early stages. Hope it does not cause any major issue on your side.

Regards.

This ticket is now closed. If you're a WPML client and need related help, please open a new support ticket.