ThinkGeo.com    |     Documentation    |     Premium Support

Javascript error in Map file

Hello,


I have downloaded the latest build "WebEditionEvaluation4.5.16.0DllPackage.zip" from the helpdesk and included it in my reference. After the new DLL i got the runtime error regarding "WindowsBase.DLL" and i search the forum and got the solution that i have to manually add the dll from some folder in "Program Files". I have added the DLL and it runs fine now.


Now the problem is, In my app i have implemented one toggle switch which is used to show thinkgeo map and thinkgeo google overlay map. Now map is set on auto refresh. But sometime i got this javascript error while page reloads, this error comes few postback and sometime on the first page load it occurs. I have attached the screenshot for more details



 



 


Attached a zip file containing both the above image in higher resolution...



Desktop.zip (408 KB)

 


Hi Badal,
Thanks for reporting the problem. To make sure we can recreate it, I have two questions to show you:
1.       Do you means that there are two maps in one .aspx page? If it is, can you let us know how you organize them, in different Tabs or different DIVs?
2.       How does the switch work? Make the first map invisible and another display, or just switch the different tabs?
Sorry that I’m unable to give you the help just based on the description now and waiting for your further information. Thanks.
Johnny

 Hi Johnny,


Please find my answer below.
 
1. No, i am using only single map. I have put my map in user control (ascx, working in asp.net) and place only one user control on the page.
2. So whenever user perform switch,  recreate all the labels, images by adding google overlay of thinkgeo. you can find the psuedo code of it below. You need any extra info then let me know
 
 

/// <summary>
    /// Add Google Layer in the thinkgeo map
    /// </summary>
    private void addGoogleLayer()
    {
//save all the current layer in variable
        LayerOverlay staticLayer = StaticOverlay;
        staticLayer.IsBaseOverlay = true;
        staticLayer.IsVisibleInOverlaySwitcher = true;
        LayerOverlay dynamicLayer = DynamicOverlay;
        LayerOverlay shapeLayer = ShapeOverlay;
        SimpleMarkerOverlay markerLayer = MarkerOverlay;
        SimpleMarkerOverlay streetOverLay = StreetMarkerOverlay;
        
        InMemoryFeatureLayer pointShapeLayer = (InMemoryFeatureLayer)DynamicOverlay.Layers["pointShapeLayer"];
        InMemoryFeatureLayer lineShapeLayer = (InMemoryFeatureLayer)DynamicOverlay.Layers["lineShapeLayer"];

        streetOverLay.IsVisibleInOverlaySwitcher = true;
        mainMap.CustomOverlays.Clear();
        //ProjectSession.SelectedMap = "GOOGLE";
        mainMap.MapUnit = GeographyUnit.Meter;
        GoogleOverlay google = new GoogleOverlay("Google Map");
        google.JavaScriptLibraryUri = new Uri("maps.google.com/maps?file=api&v=2&key=" + ProjectConfiguration.GoogleMapKey);
        //google.GoogleMapType = GoogleMapType.Normal;
      

        mainMap.CustomOverlays.Add(google);
        setGoogleMapType(ProjectSession.GoogleMapType);
        mainMap.ActiveBaseOverlay = google;

        prj4 = new Proj4Projection();
        prj4.InternalProjectionParametersString = Proj4Projection.GetEpsgParametersString(4326);
        prj4.ExternalProjectionParametersString = Proj4Projection.GetGoogleMapParametersString();
        if (!prj4.IsOpen)
            prj4.Open();

//convert the required layer as per the google standard
        for (int i = 0; i < lineShapeLayer.InternalFeatures.Count; i++)
        {
            lineShapeLayer.InternalFeatures[i] = prj4.ConvertToExternalProjection(lineShapeLayer.InternalFeatures[i]);
        }
        for (int i = 0; i < newLineShape.Vertices.Count; i++)
        {
            newLineShape.Vertices[i] = prj4.ConvertToExternalProjection(newLineShape.Vertices[i].X, newLineShape.Vertices[i].Y);
        }
        double distance = 0;
        TotalDistance = 0;
        for (int i = 0; i < pointShapeLayer.InternalFeatures.Count-1; i++)
        {
            PointShape spoint = new PointShape(newLineShape.Vertices[i]);
            PointShape epoint = new PointShape(newLineShape.Vertices[i+1]);
            distance = 0;
            
            distance = spoint.GetDistanceTo(epoint, GeographyUnit.Meter, DistanceUnit.Kilometer);
            
            TotalDistance += distance;

            Feature newPoint = pointShapeLayer.InternalFeatures[i+1];
            newPoint.ColumnValues["Name"] = TotalDistance.ToString("f2") + "km";
            pointShapeLayer.InternalFeatures[i] = prj4.ConvertToExternalProjection(pointShapeLayer.InternalFeatures[i]);
        }
        if(pointShapeLayer.InternalFeatures.Count >0)
            pointShapeLayer.InternalFeatures[pointShapeLayer.InternalFeatures.Count - 1] = prj4.ConvertToExternalProjection(pointShapeLayer.InternalFeatures[pointShapeLayer.InternalFeatures.Count - 1]);
       
       

        //mainMap.CurrentExtent = new RectangleShape(3118279.6210025, -3023552.6450561, 3122727.3005851, -3025903.0836755);
        mainMap.CustomOverlays.Add(staticLayer);
        mainMap.CustomOverlays.Add(shapeLayer);
        mainMap.CustomOverlays.Add(dynamicLayer);
        mainMap.CustomOverlays.Add(markerLayer);
        mainMap.CustomOverlays.Add(streetOverLay);

        StaticOverlay.Redraw();
        DynamicOverlay.Redraw();
        ShapeOverlay.Redraw();


Hi Badal,


It seems like there is something wrong with 'layer.div', please add the script below in your page and have a try again:


 

Thanks,



    <script language="javascript" type="text/javascript">


        OnMapCreating = function (map) {


            OpenLayers.Map.prototype.removeLayer = function (layer, setNewBaseLayer) {


                if (setNewBaseLayer == null) {


                    setNewBaseLayer = true;


                }


 


                if (layer.isFixed && layer.div) {


                    this.viewPortDiv.removeChild(layer.div);


                } else {


                    this.layerContainerDiv.removeChild(layer.div);


                }


                OpenLayers.Util.removeItem(this.layers, layer);


                layer.removeMap(this);


                layer.map = null;


 


                // if we removed the base layer, need to set a new one


                if (this.baseLayer == layer) {


                    this.baseLayer = null;


                    if (setNewBaseLayer) {


                        for (var i = 0, len = this.layers.length; i < len; i++) {


                            var iLayer = this.layers;


                            if (iLayer.isBaseLayer || this.allOverlays) {


                                this.setBaseLayer(iLayer);


                                break;


                            }


                        }


                    }


                }


 


                this.resetLayersZIndex();


 


                this.events.triggerEvent("removelayer", { layer: layer });


            }


        }


 



 Hello,


Thanks for the code but unfortunately it did not worked out. Still getting the same error.


Attached a zip file containing the error screen, also added few more watches for you to examine. If you need any more watch then let me know i will try to furnished it.


 


Thanks,



error.zip (199 KB)

 


Hi Badal,
Thanks a lot for your debug information. It seems like it runs another block, please try the update:
OnMapCreating = function (map) {
            OpenLayers.Map.prototype.removeLayer = function (layer, setNewBaseLayer) {
                if (setNewBaseLayer == null) {
                    setNewBaseLayer = true;
                }
 
                if (layer.div) {
                    if (layer.isFixed) {
                        this.viewPortDiv.removeChild(layer.div);
                    } else {
                        this.layerContainerDiv.removeChild(layer.div);
                    }
                }
                OpenLayers.Util.removeItem(this.layers, layer);
                layer.removeMap(this);
                layer.map = null;
 
                // if we removed the base layer, need to set a new one
                if (this.baseLayer == layer) {
                    this.baseLayer = null;
                    if (setNewBaseLayer) {
                        for (var i = 0, len = this.layers.length; i < len; i++) {
                            var iLayer = this.layers;
                            if (iLayer.isBaseLayer || this.allOverlays) {
                                this.setBaseLayer(iLayer);
                                break;
                            }
                        }
                    }
                }
 
                this.resetLayersZIndex();
 
                this.events.triggerEvent("removelayer", { layer: layer });
            }
        }
 
But it’s wired that the “layerContainerDiv” is undefined, can you give us a demo if the above script doesn’t take effect?
Thanks,
Johnny

hello Johny, 
          I try your last javascript code.But still i get same error.Here I am sending Url for test it. 
          
          oryxsystems.co.za/iTrack/admin/vehiclelist.aspx 
          For Login- User Name- badal 
                         Password-badal123 
  
     After login map page is displayed with vehicle images.If i am going to refresh the page ,I get that layercontainerdiv error.Let me know any further information needed from my side. 
  
 Thanks. 


 


Hi Badal,
I login the your website using the account and password, and then navigate to “Map” tab, there is one car on the map, I click the “Refresh Now” button to refresh the “Map”, after all have been done, the map shows normally and two cars are there. I tried clicking the button several times, but still all works fine. I’m not sure whether my operation is right, can you show me the steps? Or can you give us a demo to recreate it?
Thanks,
Johnny  

Hello Johnny, 
  
 Its a kind of random issue, but by below way it can be generated quickly. 
 I notice that its generated only in IE, i am using IE8 
  
 1. Once the "Map" page is loaded, you will find two arrors on the top right corner beside to map.  
 2. Now click on top arrow to open the right menu 
 3. Once opened, click the below arrow to close the menu 
 4. Now on top of the map, you will find one "Refresh Rate" drop down box, try to change the default 5 mins to other value and the error will pops up. 
  


 


Hi Badal,
Sorry that we are still unable to recreate it following your steps, I tried lots of times including the “check/uncheck” the items at top-right corner, but still runs fine. I’m not sure whether it related to the slow network when we visited your website. Can you create a demo for it? I did all the operations in IE8.
Thanks,
Johnny