This is a migrated thread and some comments may be shown as answers.

Map zoom out

4 Answers 266 Views
Map
This is a migrated thread and some comments may be shown as answers.
prasanth
Top achievements
Rank 1
prasanth asked on 28 Aug 2017, 11:17 AM

Hi,

When I fix minZoom as 2 and center as [0, 0] then the map fits properly, but If I zoom in the right side of the map and zoom out immediately, the space is filled with white color. If I do mouse click in any region of map, then fits again properly.  Would you please let me know how to fix it? I've attached the screenshot for your reference. 

4 Answers, 1 is accepted

Sort by
0
Stefan
Telerik team
answered on 30 Aug 2017, 06:13 AM
Hello Prasanth,

Thank you for the information.

Please have in mind that the minZoom property is affecting the minimum zoom level which I can assume is hit when zooming out. The initial state of the map depends on the value of the zoom property. In this scenario I can suggest if setting a higher minZoom property will fix the issue, as in my testing scenario I was able to observe it only if the minZoom value was too low:

http://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/map#configuration-minZoom

http://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/map#configuration-zoom

If the issue still occurs, please send a runnable example reproducing it, and I will gladly investigate further.

Regards,
Stefan
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
prasanth
Top achievements
Rank 1
answered on 30 Aug 2017, 06:38 AM

Hi Stefan, 

Thank you for your response. Unfortunately, the issue is still reproducible. 

Please look on this example

https://dojo.telerik.com/uQolaf

Steps to reproduce:

1) Zoom in the map to view the country detail.

2) Pan to right side and go to the country New Zealand.

3) Click on New Zealand.

4) Zoom out to initial state by scrolling the mouse

5) You can see the background yellow color.

Ive attached the screenshot. Please let me know if you fail to reproduce the issue.

Regards
Prasanth

0
prasanth
Top achievements
Rank 1
answered on 30 Aug 2017, 06:45 AM

Hi Stefan,

You may refer this example as well,

https://dojo.telerik.com/AVEFej

You can clearly see the yellow region on loading the example itself. Once you do a mouse click on the map, then you may see that the map fits properly.

Regards
Prasanth

0
Stefan
Telerik team
answered on 31 Aug 2017, 11:19 AM
Hello Prasanth,

Thank you for the runnable examples.

Regarding the examples:

1) After inspecting the scenario and consulting with the developer's team, this is expected as the map is centred on zoom based on the mouse location otherwise it will lead to unexpected issues.

2) In the second example, the issue occurs because of the coordinates passed to center the Map.

The only workaround in this scenario will be to set the wraparound property to true, but this may create an undesired result when using a bubble layer.

https://dojo.telerik.com/uQolaf/3

http://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/map#configuration-wraparound

Apologies for the inconvenience this may cause you.

Regards,
Stefan
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Map
Asked by
prasanth
Top achievements
Rank 1
Answers by
Stefan
Telerik team
prasanth
Top achievements
Rank 1
Share this question
or