Flex: UMap WMS Custom Provider Demo

Aint it the way. You wait for one map demo and three come along at once. I have been trying out the UMap component from AFComponents. Here is the latest demo.

IFrame Map App

The first thing to note is that this is not using Google or Microsoft to provide the map tiles. I have implemented a custom tile provider class ‘WMSTileProvider’ which talks to a mapping server using the WMS protocol.

The map is supplied from here.

This tiles are from here and have been generated by scanning out-of-copyright Ordnance Survey maps and stitching them together. Very clever.

The AS3 UMap component provides a means to hook your own custom tile provider into the underlying map mechanism. There is a partial explanation of this on the forum here and here.

The forum posts are more of a signpost as to how you could go about plugging in a Custom provider for the map. There was no downloadable code, until now.

I have spent a fair bit of time trying to get this working and I have adopted one technique. There may be others. The main trick is to override all the overridable methods in your ‘Provider’ subclass.


public class WMSTileProvider extends Provider
{
public function WMSTileProvider(defaultData:Boolean = false,
settings:URLRequest = null,
language:URLRequest = null,
copyright:URLRequest = null)
{
super(defaultData, settings, language, copyright);
}

override public function getDefaultLanguage():String
{
return “EN”;
}

override public function getDefaultCopyright():String
{
return “(c) – OS NPE (1940s) – Public Domain”;
}

override protected function parseSettings(data:String):Boolean
{
return true;
}

override protected function parseLanguage(data:String):Boolean
{
return true;
}

override protected function parseCopyright(data:String):void
{
trace(data);
}

}

The next trick is to supply dummy requests for the language and copyright strings. Normally these would be php requests but I just changed them into xml files. As long as you override all the methods in the Provider subclass you won’t get any annoying exceptions.


var settings:URLRequest = new URLRequest("settings.xml?rand=" + Math.random());
var language:URLRequest = new URLRequest("language.xml?rand=" + Math.random())
var copyright:URLRequest = new URLRequest("copyright.xml?rand=" + Math.random());

_map.control.provider = new WMSTileProvider(false, settings, language, copyright);

You have to put something into language.xml and copyright.xml they can’t be empty.

The settings.xml file only need contain the minumum definition:



http://www.afcomponents.com/components/umap_as3/GoogleLogo.png

Not so complicated when you know how but not easy to work out from the UMap forum posts.

An additional hurdle for me was that the WMS feed required the boundaries of the tile view to be supplied in British National Grid (Easting and Northing) values. I had some old javascript kicking around (which I thought I’d lost) which implements WGS84 to OSGB conversions. I had half created a AS3 version of this a while back and now it became quite handy (this is bundled into the source code for those of you who might need it).

Truly a pure geeky rush when I saw the map tiles burst into life. It was worth all the hassle. Right-click to view the source.

There is a pretty long list of other WMS data providers here if you want to try creating a different WMS tile layer. If you do it would be good form to post it up onto the UMap forum.

Bugs

– Resizing the map window sometimes makes the tile disappear. No idea as of now what’s going on but I think it’s linked to the resize.

About the dataset

The Avebury data is supplied as a KML file. This is fetched and parsed by the application and then displayed on the map and in the right-hand data grid. The data was downloaded from here.

This is the original drawing William Stukeley made of the Avebury complex.

IFrame Map App

His drawing shows the main complex and the two avenues to the left and right before time and other thieves destroyed most of it. You can see most of the same features on the map view.

For some more information head here.

Update #1

Update #2

Comments

10 Responses to “Flex: UMap WMS Custom Provider Demo”

  1. jatorre on April 7th, 2008 10:29 pm

    Cool! Great work. It is a pity there is no better documentation for Umap and you have to discover all these things by yourself. So it is great that you share all these discovers. I will try to post all the code I have done with my WMS provider in order to share other tricks. For example I also had to do the transformations to use EPSG:900913 to better align with Google Maps.

    So thanks again for sharing the code and keep the good work, you have a new rss subscriber 🙂

  2. bluedream198096 on July 18th, 2008 10:26 am

    Is use the lastest version Umap in the demo?

    com.afcomponents.umap.abstract.Provider

    is not exist in the umap1.1

    How do it in the umap1.1

  3. Administrator on July 18th, 2008 8:23 pm

    bluedream,

    I haven’t updated the UMap demos with the latest version yet. I will hopefully get around to it this weekend.

    Al.

  4. bluedream198096 on July 21st, 2008 3:40 am

    Oh,Cool! Thanks again to you for these great demo,

    they give me much help, i am expecting to update this demo.

  5. Administrator on July 25th, 2008 12:09 am

    I’m off on holiday for a week tomorrow (22nd). Didn’t manage to get the demo updated in time I’m afraid. I will look at it again when I come back (1st Aug). Hope this isn’t holding you up.

    Al.

  6. bluedream198096 on August 1st, 2008 10:50 am

    oh ,thanks for you answer.

    have a good holiday!

  7. Administrator on August 2nd, 2008 5:10 pm

    I have updated the demo. Post about it here:

    http://www.netthreads.co.uk/?p=190

    Al.

  8. bluedream198096 on August 8th, 2008 7:56 am

    oh, I see the updated demo, I will try it

    thanks for you great job

  9. Bill_BsB on August 27th, 2008 9:19 pm

    Really nice demo! UMap really needed some great quality and complex demo apps with source available!

    Keep up the good work!

    ps: I´ve seen you are quite experienced both in UMap and GMaps API for AS3. May you post some comparison charts of features, advantages and disadvantages between them? I´m really looking for a good analysis.

    THanks!

  10. Lolita Matro on October 23rd, 2010 9:57 am

    Long time viewer / first time poster. Really enjoying reading the blog, keep up the good work. Will most definitely start posting more in the near future.

Leave a Reply