title: Bing Maps v8 - Infobox does not appear in the expected location when the map is zoomed out
body: <p>I'm trying to use an infobox as a tooltip. I want the infobox to appear at the pushpin the mouse hovers above.</p>
  
  <p>This functionality seems to work fine when the map is sufficiently zoomed in. However when the map is zoomed out - the infobox sometimes appears off the view-port (the infobox behaves as if the map has been translated horizontally).</p>
  
  <p><a href="http://i.stack.imgur.com/wC8hS.png" rel="nofollow">see here</a></p>
  
  <p>It's my suspicion that the map is simply wrapping on itself, because it's zoomed out almost all the way. Perhaps this means there are duplicate coordinates on the map canvas, though they're not shown in the view-port.</p>
  
  <p>Pushpins with coordinates that appear only once on the map canvas show the infobox in the correct location.</p>
  
  <p>Can anybody shed some light on this? Any help is appreciated.</p>
  
  <p>I've included a basic version of my code below.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var map;
  function loadMapScenario() {
      map = new Microsoft.Maps.Map(document.getElementById('myMap'), {
          credentials: 'api key',
          maxZoom: 2,
          enableSearchLogo: false,
          disableBirdseye: true,
          showDashboard: false,
          showMapLabel: true,
          showScalebar: false,
          disablePanning: true,
          disableZooming: true,
          disableKeyboardInput: true,
          disableMouseInput: false,
          disableTouchInput: true,
          disableUserInput: false
      });
  
      var pushpins = Microsoft.Maps.TestDataGenerator.getPushpins(10, map.getBounds());
  
      var infoBox = new Microsoft.Maps.Infobox(pushpins[0].getLocation(), { title: 'title',
      description: 'description', showCloseButton: false });
  
      infoBox.setMap(map);
  
      for (var i = 0; i &lt; pushpins.length; i++) {
          var pushpin = pushpins[i];
  
          Microsoft.Maps.Events.addHandler(pushpin, "mouseover", function (e) {
              infoBox.setLocation(e.target.getLocation());
          });
      }
  
      map.entities.push(pushpins);
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;title&gt;Bing Maps Full Width&lt;/title&gt;
          &lt;meta http-equiv='Content-Type' content='text/html; charset=utf-8'/&gt;
      &lt;/head&gt;
      &lt;body&gt;
          
          &lt;div id='myMap' style='width: 100%; height: 500px;'&gt;&lt;/div&gt;
          &lt;script type='text/javascript' src='js/maps.js'&gt;&lt;/script&gt;
          &lt;script type='text/javascript' src='http://www.bing.com/api/maps/mapcontrol?branch=release&amp;callback=loadMapScenario' async defer&gt;&lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p><strong>EDIT</strong></p>
  
  <p>Removing the TestDataGenerator in favour of hard coded coordinate values yields the same problem.</p>
  
  <p><a href="http://i.stack.imgur.com/qBEON.png" rel="nofollow">See here.</a></p>
  
  <p>Updated JS:</p>
  
  <pre><code>map = new Microsoft.Maps.Map(document.getElementById('myMap'), {
      credentials: 'api key',
      maxZoom: 2,
      disableBirdseye: true,
      showDashboard: false,
      showMapLabel: true,
      showScalebar: false,
      disablePanning: true,
      disableZooming: true
  });
  
  var pushpins = [
      new Microsoft.Maps.Pushpin(new Microsoft.Maps.Location(-28.14, -79.08), null),
      new Microsoft.Maps.Pushpin(new Microsoft.Maps.Location(-28.14, 108.51), null),
      new Microsoft.Maps.Pushpin(new Microsoft.Maps.Location(-28.14, 95.03), null),
      new Microsoft.Maps.Pushpin(new Microsoft.Maps.Location(-28.14, -134.58), null)
  ];
  </code></pre>