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

Question

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

normal.PNG

resized.PNG

FeikeKramer2_1-1635781944759.png

FeikeKramer2_0-1635781615420.png

cosophy · Answer

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:.

Anonymous User · Answer

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

cosophy · Answer

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: .