2

I've four jQuery tabs, in second tab I'm showing map using the openlayers library then I'm getting following errors

Uncaught TypeError: Cannot call method 'clone' of null // onload error
Uncaught TypeError: Cannot read property 'w' of null // getting  this error when zooming-in and out

I thought my code went wrong in initializing the openlayers map object or somewhere,but it was actually trouble with jQuery tabs. If I'm placing map div in first tab then its showing map as expected.

I tried this but not solved the issue when placing map div in second tab.

Update Below Content:

If I write jQuery tabs code after the map object creation then its working fine in chrome but map destructing in firefox.

How can we call initialize jQuery tabs after execution of a user defined function?

Community
  • 1
  • 1
Mahesh.D
  • 1,691
  • 2
  • 23
  • 49
  • Perhaps this is related to the size of the div where the map is loaded, has it some preset size when the map is loaded ? Width and height must be greater than zero. – Christophe Roussy May 08 '13 at 15:48
  • I've checked width and height,both values are greater than zero.Its trouble with `jQuery tabs`, I think `display:none` is adding to the `map div`. – Mahesh.D May 09 '13 at 04:31

1 Answers1

1

you can initialize you map when enter to tab.

create you tabs like this:

 $( "#tabs" ).tabs({
     activate: function(event ,ui){
          if(ui.newTab.index() == 1)// tab number start from 0
           {
                    init(); // map initial function
           }
     }
 });

and define init() like this:

var map; //global variable
function init()
{
    if(map) //for create only one map
    { 
        return false; // if map exists it return and do not create another map
    }
    ...
    ...
}
Hasan Ramezani
  • 5,004
  • 24
  • 30
  • 1
    This works the first time but when you click again on the tab it will create a second map, click again creates a third map and so on.. – user1919 Mar 30 '15 at 13:10