The Bing Maps Ajax v7 control doesn’t include support for adding a Mini Map. So, I decided to quickly work up a simple example of adding one. Below is the source code for it and a zip download of the code at the bottom of the post.
BingMapsAjax7QuickMiniMap <h3>Source Code</h3> <pre class="csharpcode"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""> «/span>html xmlns=""> «/span>head> «/span>meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> «/span>script src="" type="text/javascript" charset="UTF-8"></script> <script src=""></script> </head>

<div id="myMap" style="position: relative; width: 530px; height: 300px;"></div> <script type="text/javascript"> var bingMapsKey = "Your Bing Maps Key"; // Load the Main Map var map = new Microsoft.Maps.Map( document.getElementById("myMap"), { credentials: bingMapsKey, mapTypeId: Microsoft.Maps.MapTypeId.road, center: new Microsoft.Maps.Location(43, -87.9), zoom: 9 } ); var mapElem = $(map.getRootElement()); // Create DIV and add to Main Map var miniMapDiv = $('
'</span>). addClass('MiniMap'). appendTo(mapElem); // Position to the Top Right corner miniMapDiv.css({ position: 'absolute', top: 0, left: (mapElem.width() - miniMapDiv.width() - 2) }); // Initialize Mini Map var miniMap = new Microsoft.Maps.Map(miniMapDiv[0], { credentials: bingMapsKey, showCopyright: false, showDashboard: false, showLogo: false, showScalebar: false }); // Attach Event Handler to Sync Mini Map with Main Map var syncMiniMap = function () { miniMap.setView({ center: map.getCenter(), zoom: map.getZoom() - 4 }); window.status = map.getCenter(); }; Microsoft.Maps.Events.addHandler(map, "viewchange", syncMiniMap); // Sync Mini Map syncMiniMap(); </script> </body> </html></pre> Download: (1 KB)