1

I'm trying to make my custom overlay for google maps. I use this this example. And I have problem with overlay width definition.

var sw = overlayProjection.fromLatLngToDivPixel(this.bounds_.getSouthWest());
var ne = overlayProjection.fromLatLngToDivPixel(this.bounds_.getNorthEast());

// Resize the image's div to fit the indicated dimensions.
var div = this.div_;
div.style.left = sw.x + 'px';
div.style.top = ne.y + 'px';
div.style.width = (ne.x - sw.x) + 'px';
div.style.height = (sw.y - ne.y) + 'px';

This code returns width less than one pixel for overlay with this latlonbox:

<LatLonBox>
<north>90.0</north>
<south>-90.0</south>
<east>180.0</east>
<west>-180.0</west>
</LatLonBox>

Has anyone encountered this problem? Maybe someone knows a solution. I would be grateful for any help.

geocodezip
  • 158,664
  • 13
  • 220
  • 245
user3390963
  • 2,313
  • 1
  • 13
  • 12

1 Answers1

1

As it seems this happens when the bounds intersect the prime-meridian.

Try this to calculate the width:

         ((ne.x - sw.x)
          +
          (((ne.x - sw.x)<0
            ||
          this.bounds_.getNorthEast().lng()
          -
          this.bounds_.getSouthWest().lng()>=360)
            ? overlayProjection.getWorldWidth()
            : 0))

Demo: http://jsfiddle.net/doktormolle/4vj37ecy/

Dr.Molle
  • 116,463
  • 16
  • 195
  • 201
  • Oh, thanks it's work! But now I see the problem with height too. As I understand, in google maps longitude can take values [-85, 85].But google earth kml contains values -90 and 90. So height and top walues are wrong too. How I can fix that? Demo: http://iwep.wc.lt/ (overlay seen with minimal zoom level) – user3390963 Nov 14 '14 at 10:15