google maps not working [modified]

User 4680292

Thank you for helping in advance, please see the code I attached below. I'm currently working on integrating google maps to get the customer address from database and then display/mark the address on the google maps. So what I did was get the whole address into a hidden label control and get the text value of the control from within the javascript. The current situation is if I hard coded some value to the var address, everything works perfectly (no error and google maps display the hard coded address correctly). however when I use the document.getElementById, some error occured. I tested the document.getElementById INSIDE the function with an alert, the alert message actually display the correct address value (as value in database), however an error ocurred IE: "Placemark.0 is null or not an object", so looks like the second function doesn't work properly. Please note that this message doesn't appear when I hard coded the var address value. I'm not sure why, but I have a feeling that I might need to convert the document.getElementById to something, so it will become something like a hard coded value. Can someone please advice?

	//var address="new york, usa";
	//var address = document.getElementById("<%=lblmap.ClientID%>").innerHTML;
	
	function load()
	{
		//var address = document.getElementById("<%=lblmap.ClientID%>").innerHTML;
		var address="new york, usa";
		map = new GMap2(document.getElementById("map"));
		geocoder = new GClientGeocoder();
		geocoder.getLocations(address, addToMap);
                                  //alert(address);
	}
	
	function addToMap(response)
	{
		place = response.Placemark\[0\];
		point = new GLatLng(place.Point.coordinates\[1\],place.Point.coordinates\[0\]);
		map.setCenter(point,13);
		marker = new GMarker(point);
		map.addOverlay(marker);
		marker.openInfoWindowHtml(place.address);
	}
		</script>
</HEAD>
<body onload="getTime();load();" onunload="GUnload()">

modified on Wednesday, July 29, 2009 9:39 AM

Abhishek Sur · modified on Wednesday, July 29, 2009 9:39 AM

I think the problem with this is Geocoder didnt found any point near to the address you specified. Thats why the callback to addToMap throws error. http://www.codeproject.com/KB/scripting/Use\_of\_Google\_Map.aspx This may help you... :rose:

Abhishek Sur My Latest Articles Working with Excel using MDAC
Basics on LINQ and Lambda Expressions
Create .NET Templates

Abhishek Sur · modified on Wednesday, July 29, 2009 9:39 AM

Also you place

var element = document.getElementById("map");
if(element)
map=new GMap2(element);

Instead of

Member 4683620 wrote:

map = new GMap2(document.getElementById("map"));

:thumbsup:

Abhishek Sur My Latest Articles Working with Excel using MDAC
Basics on LINQ and Lambda Expressions
Create .NET Templates

User 4680292

bingo, you are my star, it's working now. it's just because of my incorrect test data, it throws the error. I have a look at the given link sample, I would like to do something similar to your sample and catch the exception, and then I tried something like below:

	function load()
	{
		var address = document.getElementById("<%=lblmap.ClientID%>").innerHTML;
		//var address="new york, usa";
		var mapaddress = document.getElementById("map");
		if(mapaddress)
		map = new GMap2(mapaddress);
		geocoder = new GClientGeocoder();
		geocoder.getLocations(address, addToMap);
		//alert(address);
	}
	
	function addToMap(response)
	{
		place = response.Placemark\[0\];
		point = new GLatLng(place.Point.coordinates\[1\],place.Point.coordinates\[0\]);
		if (!point)
		{
			alert(address + " not found");
		}
		else
		{
			map.setCenter(point,13);
			marker = new GMarker(point);
			map.addOverlay(marker);
			marker.openInfoWindowHtml(place.address);
		}
	}

and of course, it didn't work. hope you could give me some idea, please.

Abhishek Sur

I think there must be something wrong with the innerHTML. Also check if(response.Placemark > 0) { place = response.Placemark[0]; point = new GLatLng(place.Point.coordinates[1],place.Point.coordinates[0]); } this will eliminate your runtime error. Other than that, put a breakpoint in the address line and see what its coming . If it is an HTML, you must strip html and get only the text address. :rose:

Abhishek Sur My Latest Articles Working with Excel using MDAC
Basics on LINQ and Lambda Expressions
Create .NET Templates

User 4680292

hmm...I'm not too sure what you mean by that, but maybe let me explain to you what i want to achieve. within this code, now I can get the correct address shows up on the google map, however if the address is invalid (e.g. 123 test street, new york). then the map will not show up. my question is how can i modify the code, so that when the address is invalid, it will popup an alert saying "address not found on map", or else it will show the correct address in the map.

	<script type="text/javascript" language=javascript>
	var geocoder;
	var map;
	
	function load()
	{
		var address = document.getElementById("<%=lblmap.ClientID%>").innerHTML;
		map = new GMap2(document.getElementById("map"));
		geocoder = new GClientGeocoder();
		geocoder.getLocations(address, addToMap);
	}
	
	function addToMap(response)
	{
			place = response.Placemark\[0\];
			point = new GLatLng(place.Point.coordinates\[1\],place.Point.coordinates\[0\]);
			map.setCenter(point,13);
			marker = new GMarker(point);
			map.addOverlay(marker);
			marker.openInfoWindowHtml(place.address);
	}
	</script>

I tried to learn from your sample3 to do the "IF" statement, but I don't know which value to use as condition. I can only imagine "IF" the address is invalid, alert the error message, else load the map correctly.

User 4680292

I tried this, but doesn't seems to be getting it right.

The result is it always get popup the alert, even if the address is valid. however the address never shown up on the map when the address is valid. what can i do to make the if statement work? Please kindly help.

User 4680292

finally, I sort of got it working, although I don't think it is the best practice. my next question is i want to create a button, when click the button, it passes the address and opens up a new page with google map ONLY and its controls. this is for user to have full control over the map. Can someone please show me how to achieve this?

</x-turndown>