Using Atlas to abstract drawing onto a Virtual Earth map

Posted at Sat, 12 Nov 2005 20:02:11 GMT by Wilco Bauwer

Today, I have spent most of my time working on a new Virtual Earth Atlas control. I wanted to add support for drawing shapes on top of a map, to make it easy to for example build a driving directions app. While the Virtual Earth control doesn't support this stuff directly, unlike Google Maps, I saw that the VE API provides pretty much all of the plumbing. As always, you will want to look at the results. It should work in at least IE and Firefox (I only tested those). Don't forget to check out the link to the source-code behind that page to get a sense of how much code was involved in putting that page together.

During the next few days I will probably extend the control a bit to actually add proper pushpin support, add a fancy map controller and a few other things. I may even write a proper demo if I could get some useful data. If there is interest, I could talk a bit more on how I put this thing together (client-side and server-side). Either way, I will try to make the binaries and source available within a few days.

Update:
You can now download the demo app, which includes client-side and server-side source code. Instead of writing an article about the whole thing, I'd like to ask you to leave behind a comment to let me know what it is you would like to know. This may range from the (current) server-side Atlas infrastructure to extending the Virtual Earth control.

Dear Friend,

Have support for VS2005 Final?
There is no designer support beyond what Atlas provides out of the box. It does work however using the VS2k5 final version.
I certainly have interest because of the power of the information that can be presented. I admit that I am hanging on by the fingertips so any info u can provide is appreciated. Also, is there a basic primer on the atlas structure?

Thanks Pauley
Hi Wilco,

Nice work! What I noticed it that panning the map (dragging it around) gets blocked sometimes until the boundaries layer is fully loaded. Do your render that area on the server and then deliver it as gif to the client and add it as a new layer? If yes, is it possible, that it doens't get cached by the client? Which makes the application very fast. You can achive this, when the url for the boundaries layer pic is unique (for at least the session).

Great work, though!

Cheers from New York,

Dani.
Daniel: Currently whenever the view on the map changes (ie. after panning/zooming), I "invalidate" all the shapes on the map. The current shapes invalidate themselves by converting the lat/long coordinates to x/y coordinates, and set the url of the overlay image for that shape accordingly. This url points to a webservice which dynamically generates the shape based on the arguments supplied (such as width/height of the map, coordinates and color).

The map doesn't seem to block here when I am panning. In Firefox, however, I do see the shape 'flicker' once, which is because the image is moved on the map, but the image is not retrieved from the server yet (theres a small delay there). For IE I use a DX transform, which is probably why it works very smooth when panning in IE.

Hopefully I'll find some time later this week to complete it and maybe write about how I've done certain things.
I'd like it so that I can insert my own maps. Will this be possible?
Steve: Not with this control. I guess the best way to use your own maps would be to replace the hard-coded urls in the MapControl.js (that you can get from virtualearth.msn.com). But even then I don't suspect that it'll be trivial to get it right.

What kind of maps do you have anyway?
Maps from a game log of a flight simulator where I show the status after a mission by placing object on a map, etc...

I currently use some C# GDI to draw bitmaps on a map, then I have to come back and add the area tags to show status.

ie. http://www.forgottenskies.com/ForgottenWars/WarMap.aspx

I'd like to use Atlas to do this
Right. I guess you could do something similar as I did 'to' VirtualEarth: add transparent images on top of the map (which could be dynamically generated on the server, like I do). In your case however you don't need to take panning/zooming into account, which should make it pretty trivial to do what you want to do.
I was wondering if u had your map in the local,could u insert the link into the javascipt? so that it can be run locally.

so have anyone tried it?
can it work?
Hi wilco,

I tried running the sample code for this demo using the lastest atlas release + visual studio.net.

But it would not compile giving me an error on the "<Bindings>" tags being unknown.

If have any clues about this?

Thanks :)
The latest versions of Atlas no longer contain the server-side Atlas controls (such as atlas:ListView, etc). This means that if you want to run most of the demos I've shown, you need to write client-side code (imperatively or declaratively) instead. You can take a look at the generated client-side source code in my demos to see how this code can be written.
Can it work?
Thanks :)
atlas is good :)
<a href="http://mydoctor.freewebpage.org/ ">Auto insurance</a>
<a href="http://medshop.freewebpage.org/ ">vicdin</a>
<a href="http://medteh.freewebpage.org/ ">phentermine</a>
<a href="http://loanonline.freewebpage.org/ ">loan on line</a>
<a href="http://casinosonline.100free.com/ ">casino</a>
<a href="http://freevideo.batcave.net/ ">free video</a>
<a href="http://propecia.125mb.com ">propecia</a>
<a href="http://cialisonline.tekcities.com/ ">cialis</a>
http://mydoctor.freewebpage.org
http://medshop.freewebpage.org
http://medteh.freewebpage.org
http://loanonline.freewebpage.org
http://casinosonline.100free.com
http://propecia.125mb.com
http://cialisonline.tekcities.com
http://freevideo.batcave.net
<a href="http://mydoctor.freewebpage.org/ ">Auto insurance</a>
<a href="http://medshop.freewebpage.org/ ">vicdin</a>
<a href="http://medteh.freewebpage.org/ ">phentermine</a>
<a href="http://loanonline.freewebpage.org/ ">loan on line</a>
<a href="http://casinosonline.100free.com/ ">casino</a>
<a href="http://freevideo.batcave.net/ ">free video</a>
<a href="http://propecia.125mb.com ">propecia</a>
<a href="http://cialisonline.tekcities.com/ ">cialis</a>
http://mydoctor.freewebpage.org
http://medshop.freewebpage.org
http://medteh.freewebpage.org
http://loanonline.freewebpage.org
http://casinosonline.100free.com
http://propecia.125mb.com
http://cialisonline.tekcities.com
http://freevideo.batcave.net
Good webmaster! Thanks
Hello! Good Site! Thanks you! thuglknyzuhf
Your message will be encoded/formatted when it is displayed. If you want to post code, please put the code inside [code=X][/code] tags, where X is the language of your code (C#, ASPX, SQL, etc).
Name:
Email:
(will be encoded using JavaScript to keep it functional and prevent it from being picked up by spammers)
Url:
 
Message:
3 + 3 =