JavaScript exception thrown and not caught

John Musbach · 12:56 AM

Hi, the following code produces the error:

Line: 2
Char: 441635
Error: Exception thrown and not caught
Code: 0

The problem being that there is no javascript on line 2 so I'm not sure where or why this error is occurring. Any ideas? What I'm trying to do is in addition to the Google Map, have Virtual Earth in the top right corner and have the movements between them sync'd, this webpage was originally created by GMap Creator but I added some parts to try and get Virtual Earth running and sync'd thus resulting in this error. I have bolded the portions I added. Thanks!

The webpage:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
  <head>
    <meta http-equiv="content-type" content="text/html/xml; charset=utf-8"/>
    <meta name="author" content="Centre for Advanced Spatial Analysis (CASA), University College London (UCL)">
    <meta name="description" content="Page automatically created by GMapCreator created by CASA">
    <meta name="keywords" content="GMapCreator, CASA, Google, Maps">

    <title>Test Map</title>

    <style type="text/css">
    @import url("http://www.google.com/uds/css/gsearch.css");
    @import url("http://www.google.com/uds/solutions/localsearch/gmlocalsearch.css");
    v\:* {
      behavior:url(#default#VML);
    }
    /* formatting for the title panel at the top containing the map title, CASA text and ucl logo */
    table.heading {
        color: #FFFFFF;
        background: #3a55a5;
        width: 100%;
        border-style: none;
        border-collapse: collapse;
    }
    table.heading td {
        border-style: none;
        padding: 0;
    }
    table.heading h1 {
        font-size: 20px;
	font-weight:bold;
	color:#FFFFFF;
        padding-left: 10px;
	font-family: Arial, Helvetica, sans-serif;
	padding-top: 8px;
    }
    /* the text in the title panel containing the map title and casa text */
    .section_header_white {
	font-size: 14px;
	font-weight:bold;
	color:#FFFFFF;
	padding-left: 25px;
	font-family: Arial, Helvetica, sans-serif;
	padding-top: 25px;
    }
    /* the bar that sits under the UCL logo and above the map and scale panels */
    .underucl {
        color: #000000;
        background: #000000;
    }
    /* the Google map itself */
    .map { width: 75%; height: 100%; table.border: 0; }
    /* text style on the scale panel */
    .scale {
        color: #FFFFFF;
        background: #3a55a5;
        width: 100%;
        height: 100%;
    }
    /* formatting of the coloured boxes on the scale panel */
    .scale_colour {
        border-color: #000000;
        border-style: none;
        border-width: 1px;
        width: 16px;
        height: 16px;
    }
    /* formating on panel containing fader buttons */
    .fader {
        color: #ffffff;
        background: #3a55a5;
        border-color: #808080;
        border-style: groove;
        border-width: 2px;
        text-align: center;
        padding-top: 3px;
        padding-bottom: 4px;
        margin-top: 8px;
    }

    </style>

<script src="http://dev.virtualearth.net/mapcontrol/v3/mapcontrol.js"></script>
    <script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAVvnv0zpl2H41dQ3i9tAy-RSf32p-Ei7CdmPKby-vKYiWeKT92hRonx8gUZtqBuqIhbUUiGt70rFieA"
            type="text/javascript"></script>
<script src="http://www.google.com/uds/api?file=uds.js&v=2&key=ABQIAAAAVvnv0zpl2H41dQ3i9tAy-RSf32p-Ei7CdmPKby-vKYiWeKT92hRonx8gUZtqBuqIhbUUiGt70rFieA"
      type="text/javascript"></script> <script src="http://www.google.com/uds/solutions/localsearch/gmlocalsearch.js"
      type="text/javascript"></script>
    <script type="text/javascript">
    //<![CDATA[

    var centreLat=37.759688999999995;
    var centreLon=-122.4445925;
    var initialZoomLevel=8;
    var n_buttonText="Map"; //Text that shows up on the button for the custom layer (n=normal, s=sat, h=hybrid)
    var s_buttonText="Satellite";
    var h_buttonText="Hybrid";
    var mapBounds=new GLatLngBounds(new GLatLng(37.707795,-122.509896),new GLatLng(37.811583,-122.379289));
    var map; //the GMap2 itself
    var opacity=0.5;
    var ve_map=null;
var lat3 = 44.96479793033101;
		var lon3 = -99.84375;
var init_zoom = 3;
var ve_firing = false;
	var ggl_firing = false;
	var firing = false;


    function customGetTileURL(a,b) {
      //converts tile x,y into keyhole string
      if (b>16) { return "SF/blank-tile.png"; };

      var c=Math.pow(2,b);
      var x=360/c*a.x-180;
      var y=180-360/c*a.y;
      var x2=x+360/c;
      var y2=y-360/c;
      var lon=x; //Math.toRadians(x); //would be lon=x+lon0, but lon0=0 degrees
      var lat=(2.0*Math.atan(Math.exp(y/180*Math.PI))-Math.PI/2.0)*180/Math.PI; //in degrees
      var lon2=x2;
      var lat2=(2.0*Math.atan(Math.exp(y2/180*Math.PI))-Math.PI/2.0)*180/Math.PI; //in degrees
      var tileBounds=new GLatLngBounds(new GLatLng(lat2,lon),new GLatLng(lat,lon2));

      if (!tileBounds.intersects(mapBounds)) { return "SF/blank-tile.png"; };
        var d=a.x;
        var e=a.y;
        var f="t";
        for(var g=0;g<b;g++){
            c=c/2;
            if(e<c){
                if(d<c){f+="q"}
                else{f+="r";d-=c}
            }
            else{
                if(d<c){f+="t";e-=c}
                else{f+="s";d-=c;e-=c}
            }
        }
        return "SF/"+f+".png"
    }

    function changeOpacity(op) {
	//this works as long as there are at least two map types
        var current=map.getCurrentMapType();
        if (current==map.getMapTypes()[0])
        	map.setMapType(map.getMapTypes()[1]);
	else
		map.setMapType(map.getMapTypes()[0]);
        opacity=op;
        map.setMapType(current); //was map.getMapTypes()[1]
    }


    function getWindowHeight() {
        if (window.self&&self.innerHeight) {
            return self.innerHeight;
        }
        if (document.documentElement&&document.documentElement.clientHeight) {
            return document.documentElement.clientHeight;
        }
        return 0;
    }

    function resizeMapDiv() {
        //Resize the height of the div containing the map.
        //Do not call any map methods here as the resize is called before the map is created.
    	var d=document.getElementById("map");
        var offsetTop=0;
        for (var elem=d; elem!=null; elem=elem.offsetParent) {
            offsetTop+=elem.offsetTop;
        }
        var height=getWindowHeight()-offsetTop-16;
        if (height>=0) {
            d.style.height=height+"px";
        }
    }

   function updateGMap(v_lat, v_lon, v_zoom)
    {
		if (! firing) {
    		v_lat = ve_map.GetCenterLatitude();
    		v_lon = ve_map.GetCenterLongitude();
    		v_zoom = ve_map.GetZoomLevel();
		firing = true;
		map.setCenter(new GLatLng(v_lat, v_lon), v_zoom);
		
		firing = false;
    	}
    }

    function updateMMap()
    {
		var v_lat, v_lon, v_zoom;
		debug("Updating VEMap");
		if (! firing) {
    		v_lat = map.getCenter().lat();
    		v_lon = map.getCenter().lng();
    		v_zoom = map.getZoom();
			debug(v_lat + "," + v_lon + "," + v_zoom);
			firing = true;
			ve_map.SetCenter(v_lat, v_lon);
    		if (!((v_zoom == 0) && (ve_map.GetZoomLevel() > 17))) {
    			ve_map.SetZoom(v_zoom);
    		}
			
			firing = false;
			
    	}
    }


    function load() {
      if (GBrowserIsCompatible()) {
        resizeMapDiv();
        
        var copyrightCollection = new GCopyrightCollection("GMapCreator");
        copyrightCollection.addCopyright(
          new GCopyright("CASA",
          new GLatLngBounds(new GLatLng(-90,-180), new GLatLng(90,180)),
          0,
          "<a href=\"http://www.casa.ucl.ac.uk\">CASA</a>")
        );

        //create a custom G_NORMAL_MAP layer
        var n_tileLayers = [ G_NORMAL_MAP.getTileLayers()[0], new GTileLayer(copyrightCollection , 0, 17)];
        n_tileLayers[1].getTileUrl = customGetTileURL;
        n_tileLayers[1].isPng = function() { return false; };
        n_tileLayers[1].getOpacity = function() { return opacity; };
        var n_customMap = new GMapType(n_tileLayers, new GMercatorProjection(n_tileLayers[0].maxResolution()+1), n_buttonText,
            {maxResolution:16, minResolution:0, errorMessage:"Data not available"});

        //create a custom G_SATELLITE_MAP layer
        var s_tileLayers = [ G_SATELLITE_MAP.getTileLayers()[0], new GTileLayer(copyrightCollection , 0, 17)];
        s_tileLayers[1].getTileUrl = customGetTileURL;
        s_tileLayers[1].isPng = function() { return false; };
        s_tileLayers[1].getOpacity = function() { return opacity; };
        var s_customMap = new GMapType(s_tileLayers, new GMercatorProjection(s_tileLayers[0].maxResolution()+1), s_buttonText,
            {maxResolution:16, minResolution:0, errorMessage:"Data not available"});
            
        //create a custom G_HYBRID_MAP layer
        var h_tileLayers = [ G_HYBRID_MAP.getTileLayers()[0], new GTileLayer(copyrightCollection , 0, 17),G_HYBRID_MAP.getTileLayers()[1]];
        h_tileLayers[1].getTileUrl = customGetTileURL;
        h_tileLayers[1].isPng = function() { return false; };
        h_tileLayers[1].getOpacity = function() { return opacity; };
        var h_customMap = new GMapType(h_tileLayers, new GMercatorProjection(h_tileLayers[0].maxResolution()+1), h_buttonText,
            {maxResolution:16, minResolution:0, errorMessage:"Data not available"});

        //Now create the custom map. Would normally be G_NORMAL_MAP,G_SATELLITE_MAP,G_HYBRID_MAP
        map = new GMap2(document.getElementById("map"),{mapTypes:[n_customMap,s_customMap,h_customMap]});
        map.addControl(new GLargeMapControl());
        map.addControl(new GMapTypeControl());
        map.addControl(new google.maps.LocalSearch());
        map.addMapType(G_SATELLITE_3D_MAP);
        map.enableContinuousZoom();
        map.enableScrollWheelZoom();
        map.setCenter(new GLatLng(centreLat, centreLon), initialZoomLevel, n_customMap);
GEvent.addListener(map, "moveend", function() 
		{
			timer = setTimeout("updateMMap()", 5);
		});
		GEvent.addListener(map, "zoomend", function()
		{
			timer = setTimeout("updateMMap()", 5);
		});
		GEvent.addListener(map, "maptypechanged", function()
		{
			debug("Changing map types");
			var type = map.getCurrentMapType();
			if (type == _HYBRID_TYPE) {
				ve_map.SetMapStyle('h');
			} else if (type == G_MAP_TYPE) {
				ve_map.SetMapStyle('r');
			} else if (type == G_SATELLITE_TYPE) {
				ve_map.SetMapStyle('a');
			} else {
				debug("Type changed to who knows");
			}
		});
      }
    }

    //]]>
    </script>
  </head>
  <body onresize="resizeMapDiv()" onload="load()" onunload="GUnload()">
    <table width="100%" class="heading">
      <tr>
        <td valign="top"><h1>Test Map</h1>
        
        </td>
        <td valign="baseline"><script type="text/javascript">var params = new Object();
   		params.latitude = lat3;
   		params.longitude = lon3;
   		params.zoomlevel = init_zoom;
   		params.mapstyle = VEMapStyle.Hybrid;
		params.showScaleBar = true;
		params.showDashboard = true;
		params.dashboardSize = Msn.VE.DashboardSize.Normal;
		params.dashboardX = 5;
		params.dashboardY = 5;
		ve_map = new VEMap('myMap', params);
 		ve_map.Init();
		
		
		ve_map.AttachEvent("onendcontinuouspan", updateGMap);
		ve_map.AttachEvent("onendzoom", updateGMap);
		ve_map.AttachEvent("onchangemapstyle", changeGMapType);</script>
        </td>
      </tr>
      <tr>
        <td colspan="2"><div class="underucl">&nbsp;</div>
        </td>
      </tr>
    </table>

    <table width="100%" border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td class="map"><div id="map"></div>
        </td>
        <td class="scale" valign="top">
<table>
<tr>
<td bgcolor="#0000ff" class="scale_colour">&nbsp;</td>
<td>First Colour</td>
</tr>
<tr>
<td bgcolor="#00ffff" class="scale_colour">&nbsp;</td>
<td>Second Colour</td>
</tr>
<tr>
<td bgcolor="#00ff00" class="scale_colour">&nbsp;</td>
<td>Third Colour</td>
</tr>
<tr>
<td bgcolor="#ffff00" class="scale_colour">&nbsp;</td>
<td>Fourth Colour</td>
</tr>
<tr>
<td bgcolor="#ff0000" class="scale_colour">&nbsp;</td>
<td>Fifth Colour</td>
</tr>
</table>

          <div class="fader">
            <input type="button" value="Map" onClick="changeOpacity(0)" />
            <input type="button" value="1/4" onClick="changeOpacity(0.25)" />
            <input type="button" value="1/2" onClick="changeOpacity(0.5)" />
            <input type="button" value="3/4" onClick="changeOpacity(0.75)" />
            <input type="button" value="Data" onClick="changeOpacity(1.0)" />
          </div>
        </td>
      </tr>
    </table>
  </body>
</html>

John Musbach · 03-Jul-2008, 06:46 PM #2

It would appear that before this error the following error actually occurs first:

Line: 99
Char: 1
Error: AJAX Search API Load Failure: Invalid version argument: 2
Code: 0

but line 99 is:

Code:

 var h_buttonText="Hybrid";

Search
Search in:
Show Threads Show Posts
Advanced Search

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)