Another Look at Bing Maps

Almost five years ago I was working on a project that used Bing Maps. And now, years later, I’m working on a new project that involves mapping.

There’s always a little anxiety when trying to relearn a technology after even a few months, much less several years. Technology changes so quickly that in your heart you’re sure that all your old knowledge is useless. But not quite — even though the technology changes, the general principles remain the same for the most part.

Anyway, I did a Web search for Bing Maps and ended up at a nice getting-started page at By nice I mean it had a “Hello World” example instead of endless blathering. Thank you anonymous documentation person!

The first step was to get a Bing Maps key. I went to, then logged in with my hotmail / Microsoft account and got a key. The only thing that worried me was when the dialog asked for my application URL. I entered http://localhost/NodeAtlasTest and it was accepted (my new project is called Node Atlas).


Next I created a NodeAtlasTest folder at C:\inetpub\wwwroot. Then I opened Notepad with administrator privileges and copy/pasted the Hello World code (with my Bing Maps key and a couple of tiny changes) in, and saved as default.html.

I launched Internet Explorer and navigated to http://localhost.NodeAtlasTest/default.html and voila! Success.


When ramping up with a new (or unused-for-years) technology, getting started is always the hard part. Now it’s just a question of relearning all the mapping tricks I once knew.

Here’s the Web page source code, with less-than and greater-than characters replace by (lt) and (gt) so my blog software doesn’t do crazy.

(lt)!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  (lt)!-- code from --(gt)
    (lt)meta http-equiv="Content-Type"
        content="text/html; charset=utf-8"/(gt)

    (lt)script type="text/javascript"

    (lt)script type="text/javascript"(gt)
function GetMap()
var map = new Microsoft.Maps.Map(document.getElementById("mapDiv"), 
{credentials: "AmUck2V2bRaI2T2p5BhDzaIV(etc)79mWTEGRiSYtAbUjSCm",
center: new Microsoft.Maps.Location(45.5, -122.5),
mapTypeId: Microsoft.Maps.MapTypeId.road,
zoom: 8});
   (lt)body onload="GetMap();"(gt)
      (lt)div id='mapDiv' style="position:relative;
        width:1000px; height:600px;"(gt)(lt)/div(gt)       
This entry was posted in Miscellaneous. Bookmark the permalink.