title: Converting DOM pixel coordinates to latlng coordinates
body: <p>I am trying to get the latlng coordinates of the bottom left and top right corners of an svg element (orange box in the picture) I overlayed on top of the map. However, the latlng coordinates I am getting from transforming the pixel coordinates is off by a wide margin.</p>
  <p>Coordinates I should be getting from this view:</p>
  <p>BL: [-18.9, -39.1],
  TR: [48.8, 39.3]</p>
  <p>Coordinates I am actually getting:</p>
  <p>BL: [-30.3, 127.0],
  TR: [40.9, 205.9]</p>
  <p><a href="https://i.stack.imgur.com/Fus5k.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Fus5k.png" alt="The orange box is the overlayed svg element" /></a></p>
  <p>This is the code I am using to determine the pixel position:</p>
  <pre><code>this.navigation.on('moveend zoomend', () =&gt; {
    const bounds = L.DomUtil.get(&quot;compBorder&quot;)!.getBoundingClientRect();
  
    const bl1 = L.point(bounds.left, bounds.bottom)
    const tr1 = L.point(bounds.right, bounds.top)
  
    const bl = this.navigation.layerPointToLatLng(bl1);
    const tr = this.navigation.layerPointToLatLng(tr1);
  
    this.cs.setBlTr([bl.lat, bl.lng], [tr.lat, tr.lng]);
    this.cs.setCenter(this.navigation.getCenter());
    this.cs.setZoom(this.navigation.getZoom());
  });
  </code></pre>
  <p>From what I am seeing it doesn't seem to make a difference whether I use the layerPointToLatlng() or the containerPointToLatlng() function.</p>