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

problems with method viewToLocation

5 Answers 61 Views
Map
This is a migrated thread and some comments may be shown as answers.
Carlos Hass
Top achievements
Rank 1
Carlos Hass asked on 20 Jul 2016, 12:30 PM

In drag and drop markers method viewToLocation does not position the point in the right place, there is always an offset. Very little zoom point comes to be positioned in another country.

Here we can see an example of this problem http://docs.telerik.com/kendo-ui/controls/diagrams-and-maps/map/how-to/drag-and-drop-markers

5 Answers, 1 is accepted

Sort by
0
T. Tsonev
Telerik team
answered on 22 Jul 2016, 08:22 AM
Hi,

I've edited the demo to log the old and new locations in the console. The location seems to be correct after drag and drop at different zoom levels.

Do you have any specific instructions that I should follow to reproduce the issue?

Regards,
T. Tsonev
Telerik by Progress
 
Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
 
0
Jacobus
Top achievements
Rank 1
answered on 08 Apr 2019, 04:07 AM

Dear T Tsonev

We are having the same issue with the offset when dragging the pin. If you have a div preceding the map div, then this problem is clearly visible. Add the following div (just example) before the map div and you will notice the offset when the drag ends.

...

<body>
  <div > 
    <p> p1 </p>
    <p> p2 </p>
    <p> p3 </p>
    <p> p4 </p>
    <p> p5 </p>
    <p> p6 </p>
  </div>
<div id="map"></div>
<script>
    var markers = [

...

Regards

Kobus

0
Jacobus
Top achievements
Rank 1
answered on 08 Apr 2019, 04:35 AM

And the fix is to change the dragend function as follows to get the bounding rect of the map div for correct calculation of x and y position:

 

                // Update marker location
                dragend: function(e) {
                    e.sender.hint.hide();

                  var mapdiv = document.getElementById("map");
                  var rect = mapdiv.getBoundingClientRect();
                  
                    var loc = map.viewToLocation([e.x.client - rect.left, e.y.client - rect.top]);
                  console.log(marker.location().toString(), '->', loc.toString());
                    marker.dataItem.set("latlng", [loc.lat, loc.lng]);
                }

0
Matt
Top achievements
Rank 1
Veteran
answered on 10 May 2020, 09:08 AM
This is a bug that makes the Map control not behave like other Telerik controls. Please fix.
0
Georgi
Telerik team
answered on 12 May 2020, 12:50 PM

Hi Matt,

Are you able to replicate the behavior in the sample provided by T. Tsonev? The coordinates seem correct even after zoom. Could you please provide us with a sample where the issue can be reproduced?

Regards,
Georgi
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
Tags
Map
Asked by
Carlos Hass
Top achievements
Rank 1
Answers by
T. Tsonev
Telerik team
Jacobus
Top achievements
Rank 1
Matt
Top achievements
Rank 1
Veteran
Georgi
Telerik team
Share this question
or