Partager via


Add an interactive map to your web page

It’s pretty cool to play with the maps at https://Local.Live.com

You can zoom in to various locations, add pushpins, save sets of pushpins as Collections. Aerial, Bird’s Eye and 3D view are fun too!

When you sign in, your collections are visible from any browser on any computer.

This is great when I want to explain to my kids how the hours we spent driving to Canada are insignificant when compared to the whole world, and other geography facts.

I added pushpins at the various places I’ve lived: London, Kuala Lumpur, Honolulu, New Haven, Boston, Seattle.

It’s easy to get driving directions from one pushpin to another.

It’s hard to get driving directions from London to Seattle.

I can get an aerial view of my house, even on my phone with Virtual Earth Mobile

It’s really easy to embed a live map on any web page. Below is an interactive map with a Bird’s eye view of a building. See if you can figure out where I went to school

Right Click on Start button, choose Explore to open Explorer. Navigate to any folder, such as C:\

Choose File->New->Text Document.

“New Text Document.txt” is created. Hit enter on that to bring up notepad

Paste in the lines below (modified from https://www.viavirtualearth.com/MyVirtualEarth/v3/gettingstartedpt1.htm), then save the file.

Rename the file to anything with the extension “.htm”

Now hit enter or dbl-click on it.

If you get a warning about Content Blocked, just allow the blocked content.

You don’t have to be a rocket scientist to figure out where I went to school!

You can just as easily put maps on your web site too. You can add pushpins, routes, shading, shapes too.

Imagine your business database of addresses: A user goes to your web site, clicks on an address, and you can dynamically generate route maps to get to each location.

See also https://www.viavirtualearth.com/vve/Promos/GetStarted.ashx

Who needs to go to Italy when satellite views of tourist spots are available? https://www.mapseeing.com/category/locations/europe/italy/

<html>

    <head>

    <script src="https://dev.virtualearth.net/mapcontrol/v3/mapcontrol.js"></script>

    <script>

      function OnPageLoad()

      {

        map = new VEMap('myMap');

        map.LoadMap(new VELatLong(42.35996517335824, -71.09196868), 18 ,'o' , false);

        // zoom range 1-19

        // 'o' = oblique, 'a' = aerial, 'r' for road, 'h' for hybrid

      }

    </script>

</head>   

  <body onload="OnPageLoad();">

    My School

    <div id='myMap' ></div>

  </body>

</html>

 

 

End of code

Comments