Have you ever wondered if it’s possible to get high-PPI (high pixel density) map tiles from the Bing Maps AJAX Control? Wonder no more. By simply setting a parameter in your Bing Maps AJAX Control code for your application, users that are on high-PPI or Retina supported devices will automatically get high resolution map tiles. High-PPI maps provide larger map labels and street lucidity, which is especially helpful when viewing maps on mobile devices and tablets that have smaller screens.
Default map tile: High-PPI map tile:
To enable high-PPI tiles, you need to set the parameter enableHighDpi: true in your Bing Maps AJAX Control code (map constructor). Below is sample code that shows how to set this parameter:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><head><title></title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0&mkt=en-us"><script type="text/javascript"> function GetMap() {varmap = new Microsoft.Maps.Map(document.getElementById("mapDiv"), { credentials: "YourBingMapsKey",center: new Microsoft.Maps.Location(37.769831,-122.447004), mapTypeId: Microsoft.Maps.MapTypeId.road, zoom: 12, enableHighDpi: true, }); }</script></head><body onload="GetMap();"><div id='mapDiv' style="position:relative;width:700px;height:700px;"></div></body></html>
When high-PPI map tiles are returned, the map tile URL will include the value dpi=d1&device=mobile (in case you want to confirm high-PPI map tiles are being returned). Also, the device that the AJAX Control is being rendered on must return devicePixelRatio >= 2 in order to get the high-PPI map tiles. If the device does not return devicePixelRatio >= 2 then the default map tiles (not high-PPI tiles) will be returned to the user.
Happy mapping!
– Erik Lindeman, Bing Maps Program Manager