[Chameleon] Resizing MapDHTML widget without submittingpage...possible?

Delfos, Jacob jacob.delfos at maunsell.com
Thu Nov 3 18:29:36 EST 2005


Hi Mike,

I think that's a great effort you did. I think Chameleon moving to a
non-submit mode is very useful and relevant. 

In our pages, we have a tool which creates printouts to scale. To do
this, I had to create duplicates of the original map-image in a popup,
but at a different size. For this, I override the original height and
width, using the nWidth and nHeight variables that exist in drawmap.php.
So basically, you can take the url, and simply paste something like
"nWidth=870&nHeight=580" behind it. So something like:

document.images['MapLayerDivImg'].src =
document.images['MapLayerDivImg'].src + "&nWidth=" + mapwidth +
"&nHeight=" + mapheight

So as far as I can see, this can be done dynamically without
resubmitting.

One other thought I had..... What if Chameleon were modularised to the
extent that it had a completely independent mapping application (KaMap?)
running inside an Iframe, that would listen to commands like
"changeLayers(...)" and "changeExtent(...)"? This way, people could
write wrappers allowing any application to be used inside Chameleon.....
It would make resizing instataneous too, without the mapimage
disappearing. But that's just me dreaming....

Regards,

Jacob


> -----Original Message-----
> From: chameleon-bounces at lists.maptools.org 
> [mailto:chameleon-bounces at lists.maptools.org] On Behalf Of Mike Leahy
> Sent: 4 November 2005 07:03
> To: chameleon at lists.maptools.org
> Subject: [Chameleon] Resizing MapDHTML widget without 
> submittingpage...possible?
> 
> Hello list,
> 
> I've been working on a Chameleon application that uses an AJAX-like
> approach to submit the main form, and updates the current page by
> parsing the responseText that is recieved and applying properties to
> most of the form inputs and some JavaScript variables, as well as
> substituting innerHTML for appropriate div tags.  I have 
> posted a sample
> at http://gaia.uwaterloo.ca/mgl/ if anybody wants to take a look at it
> (feedback is welcome).  I know what I've done here is somewhat
> reinventing what the JSAPI mode does in Chameleon, but it 
> fits with the
> context of our project, and works reasonably well (so far).
> 
> Essentially, we're trying to make an application that never 
> reloads the
> page like in JSAPI, so that we can seamlessly include other 
> tools we are
> developing that are also based on AJAX in the same page as 
> the Chameleon
> map.  We essentially have acheived this goal...but various 
> widgets will
> not work in this environment, like the MapSize widget, which would
> re-submit the page even when JSAPI mode is enabled.
> 
> This brings me to the problem we are currently facing, and 
> for which I'm
> hoping to get some advice.  I'm trying to change the size of the map
> widget during a window.onresize event without actually reloading the
> page.  I have some sample JavaScript code below where I am 
> attempting to
> do this based on the (hypothetical) presence/existence of a 
> panel at the
> bottom of the web page (indicated by a boolean variable).  While I can
> resize the layers associated with the map widget, the actual 
> visible map
> image continues to be clipped to its original height (even though the
> image itself is visibly stretched to the extents, and the clip extents
> appear to be correct while panning).  I haven't yet started reloading
> the image to properly fill the map layer after being resized, 
> but that's
> sort-of moot at this point (I think), since the bottom part 
> of the image
> continues to be cut-off.
> 
> You can view a live-demo of this (both the AJAX reloading method, and
> our resizing problem) at http://gaia.uwaterloo.ca/mgl/resizetest/ so
> that you can get a visual of what I'm describing.  You should 
> find that
> on the initial load, you can zoom/pan/etc, but if you resize 
> the browser
> window, the map image is not visible beyond it's original 
> height of 300
> pixels (even though you can see that the image object has 
> been resized).
> 
> So...I'm hoping somebody might have some suggestions or can 
> point me in
> the right direction to move ahead with this.  I imagine this has
> something to do with some parameters or functions that are set during
> the usual onLoad sequence of the Chameleon application, but 
> I'm at a bit
> of a loss as to where I should look in the Chameleon code.  Maybe
> there's a much simpler way to do this, or an existing 
> function that I've
> overlooked...?  I looked through the Chameleon list, and didn't find
> 
> Thanks in advance for any help,
> Mike
> 
> 
> ~~~~~~ snippet of LayerSetSizeInit() called during onresize 
> event ~~~~~~
> 
> var oMainMapImage = CWCDHTML_GetImage( 'mapimage' );
> var oMainMapLayer = CWCDHTML_GetLayer( 'MainMapLayer' );
> var oMainMapDivImg = CWCDHTML_GetImage( 'MapLayerDivImg' );
> 
> if (bShowBottom)
> {
>  //bottom panel has contents...stretch other panels
>  //to the top of the bottom panel
> 
>   gMapWiHeight = (aWH[1] - 57) - parseInt(oBottomPanel.style.height);
>   oMainMapLayer.height = gMapWiHeight;
>   oMainMapImage.height = gMapWiHeight;
>   oMainMapDivImg.height = gMapWiHeight;
>   gRulercMapHeight = gMapWiHeight;
>   document.forms[0].MAP_HEIGHT.value = gMapWiHeight;
> 
>   //my current hack/best-guess at resizing the map 
> image...need help...
>   maplayer = new DynLayer("MapLayerDiv");
>   drag.remove(maplayer);
>   maplayer.clipTo(0,400,gMapWiHeight,0);
>   drag.add(maplayer);
> 		
> }
> else
> {
> 	
>   //bottom panel has no contents...stretch other
>   //panels to fill in the screen
> 
>   gMapWiHeight = (aWH[1] - 57);
>   oMainMapLayer.height = gMapWiHeight;
>   oMainMapImage.height = gMapWiHeight;
>   oMainMapDivImg.height = gMapWiHeight;
>   gRulercMapHeight = gMapWiHeight;
>   document.forms[0].MAP_HEIGHT.value = gMapWiHeight;
> 
>   //my current hack/best-guess at resizing the map 
> image...need help...
>   maplayer = new DynLayer("MapLayerDiv");
>   drag.remove(maplayer);
>   maplayer.clipTo(0,400,gMapWiHeight,0);
>   drag.add(maplayer);
> }
> 
> 
> _______________________________________________
> Chameleon mailing list
> Chameleon at lists.maptools.org
> http://lists.maptools.org/mailman/listinfo/chameleon
> 



More information about the Chameleon mailing list