Map resized and repositioned while graphics on map not ! �?�In Ext�??

711
4
06-29-2010 03:20 AM
cosophy
New Contributor
After the Map Div has been resized, i resized and repositioned the map, but the graphics on the map were not repositioned, why? Anyone knows?
How should i do ? Thanks a lot!

Here are my snapshots (look at the position of graphics):

Before Resized


After Resized
0 Kudos
4 Replies
by Anonymous User
Not applicable
Original User: ajpfister06

so you are calling the .reposition() and .resize() methods?  can you post a complete code sample? using the CODE tags?
0 Kudos
cosophy
New Contributor
so you are calling the .reposition() and .resize() methods?  can you post a complete code sample? using the CODE tags?


I'm using Ext JavaScript, and i extend a plugin for panel, which can render the map object to the panel.

Here is the init function of the plugin, i just call them after the default 'onResize' event handler.

    init: function(panel) {
        Ext.apply(panel, {
            onRender: panel.onRender.createSequence(function(ct, pos) {
                  var id = panel.body.dom.id ? panel.body.dom.id : panel.id;
                  dojo.addOnLoad(this.initEsriMap.createDelegate(this, [id]));
            } .createDelegate(this))
     , onResize: panel.onResize.createSequence(function(w, h) {
            var width = panel.getInnerWidth();
     var height = panel.getInnerHeight();
     if (this.map) {
     this.map.width = width;
     this.map.height = height;
     this.map.resize();
     this.map.reposition();
     }
       } .createDelegate(this))
        })
    }


So, if i resize the panel, the map can be resized and repositioned, the only problem is graphics do not respond accordingly:confused:.
0 Kudos
by Anonymous User
Not applicable
Original User: ajpfister06

i don't think you need to explicitly set the map height and width.  i believe the map.resize() should do that for you.

   init: function(panel) {
        Ext.apply(panel, {
            onRender: panel.onRender.createSequence(function(ct, pos) {
                  var id = panel.body.dom.id ? panel.body.dom.id : panel.id;
                  dojo.addOnLoad(this.initEsriMap.createDelegate(this, [id]));
            } .createDelegate(this))
     , onResize: panel.onResize.createSequence(function(w, h) {
            var width = panel.getInnerWidth();
     var height = panel.getInnerHeight();
     if (this.map) {
     //this.map.width = width;
     //this.map.height = height;
     this.map.resize();
     this.map.reposition();
     }
       } .createDelegate(this))
        })
    }


if the problem is still there try using the timer approach: http://help.arcgis.com/en/webapi/javascript/arcgis/help/jsapi_start.htm#jsapi/map.htm#resize
0 Kudos
cosophy
New Contributor
i don't think you need to explicitly set the map height and width.  i believe the map.resize() should do that for you.

   init: function(panel) {
        Ext.apply(panel, {
            onRender: panel.onRender.createSequence(function(ct, pos) {
                  var id = panel.body.dom.id ? panel.body.dom.id : panel.id;
                  dojo.addOnLoad(this.initEsriMap.createDelegate(this, [id]));
            } .createDelegate(this))
     , onResize: panel.onResize.createSequence(function(w, h) {
            var width = panel.getInnerWidth();
     var height = panel.getInnerHeight();
     if (this.map) {
     //this.map.width = width;
     //this.map.height = height;
     this.map.resize();
     this.map.reposition();
     }
       } .createDelegate(this))
        })
    }


if the problem is still there try using the timer approach: http://help.arcgis.com/en/webapi/javascript/arcgis/help/jsapi_start.htm#jsapi/map.htm#resize


Yes, you are right, now everything is okay! Thank you so much, ajpfister06:cool:.
0 Kudos