Skip Navigation

[Resolved] MAP ZOOM LEVEL AND HEIGHT ON MOBILE WITH MARKER LAYOUT ISSUE

This support ticket is created 4 years, 6 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 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Karachi (GMT+05:00)

This topic contains 4 replies, has 2 voices.

Last updated by manishB-2 4 years, 6 months ago.

Assisted by: Waqar.

Author
Posts
#1611629
mobile view.png
desktop-view.png

Hi
I am trying to adjust the map zoom level and height on the mobile. And If I decrease the height using CSS then the zoom level doesn't change and it still shows content as per desktop zoom level and markers get hidden behind the screen. So I need help to control the zoom level of the map for mobile screens as well.

So Please let me know how I can do this.

#1613367

Hi,

Thank you for contacting us and I'd be happy to assist.

To suggest the best way forward, I'll need to see exactly how this view is set up in the admin area.

Can you please share temporary admin login details, in reply to this message?

Note: Your next reply will be private and please make a complete backup copy, before sharing the access details.

regards,
Waqar

#1613771

And Most Importantly, I wanna know, the reason, Why the map is loading too slow. I want to make it load immediately.

#1616877

Hi,

Thank you for sharing the admin access.

By default, when no "general_zoom" attribute is provided in the "wpv-map-render" shortcode (with "fitbounds" set to "off"), the zoom level of 5 is set.
( ref: https://toolset.com/documentation/user-guides/maps/maps-shortcodes/#wpv-map-render )

To change this zoom level to a different zoomed out value when viewed on smaller screens, you can include the following custom script in the view's "JS editor" section:
( screenshot: hidden link )


jQuery(document).on('js_event_wpv_addon_maps_init_map_completed', function() {
	if(jQuery(window).width() <= 649){
		var options = {'zoom': 4};
		WPViews.view_addon_maps.get_map('home-map').setOptions( options );
	}
});

This will set the zoom level to 4, on screens with a width 649 px or lower.

As for the map's speed, it seems to load fine for me, but there is a 404 error in the console for a missing file, which can slow down the overall page loading time.
( missing file: {yourwebsite.com}/wp-content/themes/hello-elementor/js/ekko-lightbox.min.js?ver=1.1 )

I hope this helps and please let me know how it goes.

regards,
Waqar

#1621363

My issue is resolved now. Thank you!