[Chameleon] Resizing MapDHTML widget without submitting page...possible?

[Jason Fournier]

Mike,

Very nice!  An initial quick thought: As you have mentioned, the 
MapDHTML widget uses clipping to hide map data that exceeds the boundary 
of the current extents.  This should probably be changed so that the Map 
is placed in a container div and overflow:hidden is set on the container 
(let the browser do the work for clipping).

Best Regards,
Jason




Mike Leahy wrote:
> 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
> 

-- 
________________________
Jason Fournier

DM Solutions Group Inc.
jfournier at dmsolutions.ca
www.dmsolutions.ca
613.565.5056 x18