Static webpage visiomatic example

[cdeil]

@ebertin - As mentioned via email, for my application I'd like to use Visiomatic for a static webpage.
No image server, just use it as a FITS WCS leaflet plugin, probably also the WCS control.

I have a demo here that can display the image:

• http://cdeil.github.io/slippy-astro-images/visiomatic/
• https://github.com/cdeil/slippy-astro-images/tree/gh-pages/visiomatic

The WCS trafos don't work because the L.map('map', {crs: L.CRS.wcs(header), ...}) call happens before header is loaded:
https://github.com/cdeil/slippy-astro-images/blob/gh-pages/visiomatic/main.js
I tried fixing it like this, but there I get no image (I'm a complete JS newbie):
https://github.com/cdeil/slippy-astro-images/blob/gh-pages/visiomatic/main2.js

Can you please help me to fix this example so that putting markers and circles at given world coordinates works?

Would you be interested to have such an example in the visiomatic repo?
I'd be happy to improve it and to document how it works in the docs, but such an application is not really the proper use case for Visiomatic, right?

[ebertin]

VisiOmatic provides a special utility function for managing AJAX calls (similar to jQuery.ajax(), but much more basic): http://visiomatic.readthedocs.org/en/latest/api.html#l-iiputils-requesturl
The link above provides an example. I think you may be able to modify the coordinate reference system of the map after it is initialized, simply by setting map.options.crs = L.CRS.wcs(hdr), as long as it is done before adding the layer.
I will try to find some time tomorrow to help.

[cdeil]

I think I've figured out the JS to first execute things in the proper order (wait for header to be loaded):
https://github.com/cdeil/slippy-astro-images/blob/gh-pages/visiomatic/main3.js

Now the issue is that the bounds are incorrect:

southWest:  o.LatLng {lat: -24.489190582312684, lng: 307.1740722657091}
northEast:  o.LatLng {lat: 8.33233469657575, lng: 74.6475971981302}

Don't know what I'm doing wrong ..