JavaScript - Using Latest Google Streetmap In My Api
here is my google maps code:
Code: <script type="text/javascript"> //<![CDATA[ if (GBrowserIsCompatible()) { var map = new GMap(document.getElementById("map")); map.addControl(new GLargeMapControl()); map.addControl(new GMapTypeControl()); map.setCenter(new GLatLng(51.520593197675446,-0.19775390625),16); // ====== Is the search string a UK Postcode ====== function ukPostcodeTest() { var search = document.getElementById("search").value; // take a copy and convert to upper case var s = search.toUpperCase(); // Replace punctuation and whitepsace by a single space s = s.replace(/\W+/g, " "); // Remove and trailing leading spaces s = s.replace(/^ /, ""); s = s.replace(/ $/, ""); // Perform the check var match = s.match(/^[A-Z]{1,2}[0-9R][0-9A-Z]? [0-9][ABD-HJLNP-UW-Z]{2}$/); if (!match) { // Its not a UK Postcode, so perform a standard GClientGeocoder call on the original search string showAddress(search); } else { // It is a UK Postcode, so call GDirections on the reformatted search string showPostcode(s); } } // ====== Code for handling search strings that are not UK Postcodes ======= // ====== Use the GClientGeocoder in the normal way ====== // ====== Create a Client Geocoder ====== var geo = new GClientGeocoder(); // ====== Array for decoding the failure codes ====== var reasons=[]; reasons[G_GEO_SUCCESS] = "Success"; reasons[G_GEO_MISSING_ADDRESS] = "Missing Address: The address was either missing or had no value."; reasons[G_GEO_UNKNOWN_ADDRESS] = "Unknown Address: No corresponding geographic location could be found for the specified address."; reasons[G_GEO_UNAVAILABLE_ADDRESS]= "Unavailable Address: The geocode for the given address cannot be returned due to legal or contractual reasons."; reasons[G_GEO_BAD_KEY] = "Bad Key: The API key is either invalid or does not match the domain for which it was given"; reasons[G_GEO_TOO_MANY_QUERIES] = "Too Many Queries: The daily geocoding quota for this site has been exceeded."; reasons[G_GEO_SERVER_ERROR] = "Server error: The geocoding request could not be successfully processed."; // ====== Geocoding ====== function showAddress(search) { // ====== Perform the Geocoding ====== geo.getLocations(search, function (result) { // If that was successful if (result.Status.code == G_GEO_SUCCESS) { // How many resuts were found document.getElementById("message").innerHTML = "Found " +result.Placemark.length +" results"; // Loop through the results, placing markers for (var i=0; i<result.Placemark.length; i++) { var p = result.Placemark[i].Point.coordinates; var marker = new GMarker(new GLatLng(p[1],p[0])); document.getElementById("message").innerHTML += "<br>"+(i+1)+": "+ result.Placemark[i].address + marker.getPoint(); map.addOverlay(marker); } // centre the map on the first result var p = result.Placemark[0].Point.coordinates; map.setCenter(new GLatLng(p[1],p[0]),14); } // ====== Decode the error status ====== else { var reason="Code "+result.Status.code; if (reasons[result.Status.code]) { reason = reasons[result.Status.code] } alert('Could not find "'+search+ '" ' + reason); } } ); } // ====== Create a Client Geocoder ====== var gdir = new GDirections(null); // ====== Using GDirections to process a UK postcode ====== function showPostcode(search) { // Call GDirections gdir.loadFromWaypoints([search,search],{getPolyline:true}); // Wait for the reply to come back GEvent.addListener(gdir,"load", function() { var poly = gdir.getPolyline(); var point = poly.getVertex(0); //document.getElementById("message").innerHTML = "Found a UK Postcode"; // Process the result var marker = new GMarker(point); //document.getElementById("message").innerHTML += "<br>" + search + " = " + point.toUrlValue(5); map.addOverlay(marker); // centre the map on the result map.setCenter(point,16); }); } } // display a warning if the browser was not compatible else { alert("Sorry, the Google Maps API is not compatible with this browser"); } // This Javascript is based on code provided by the // Community Church Javascript Team // http://www.bisphamchurch.org.uk/ // http://econym.org.uk/gmap/ //]]> </script> which only displays the arrows and MAP / SATELLITE / HYBRID buttons?! How can I use the new map with streetview? thanks Similar TutorialsIf you watch this page http://wouldbebetter.com/ for about 15 seconds, you can see that new "suggestions" will be shown as they are submitted. How can I do this with a post system? Hey guys, so i have a site iv created for a client. I have the photo blog page getting the latest images from a flickr account. But the client wants them to be Organized into years. Is there any way to call a specific set or folder inside of flickr, and not just the entire account. ?? You can see the page here . http://wannamakeitfarm.com/mission.html Hi there, I want to be able to pull in the latest tweet from my twitter feed onto my site. I'm able to do this using one of several pre-written scripts that allow you do this, but my problem is that I want to pull it into a quote tag <q> and no as an unordered list <ul>. I don't know much about JS but I've scoured the files provided by this free jquery feed (http://coda.co.za/content/projects/jquery.twitter/) and the best I can do is change the <ul> to a <q>. The <li> is still showing within the <q> but there is no sign of any <li> elements in the JS file, so I'm assuming this is coming from somewhere else that I can't find. Does anyone know how this works? Thanks in advance, Hi, i have a rating script which shows 5 stars and it allows users to vote out of 5 on certaiin things, the votes register ok but the stars dont change colour to show that the user has voted. this has happened since my host upgraded to php 5.3 and i noticed on IE(which i never use much) it says there is an error on the page and that error says Code: Webpage error details User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0) Timestamp: Tue, 2 Feb 2010 20:00:42 UTC Message: 'document.all[...]' is null or not an object Line: 96 Char: 9 Code: 0 URI: rating.js line 96 in the related file is Code: } else if(IE) { document.all[div2show].innerHTML = text; } which only related to IE and not firefox so im unsure why my rating graphics do not show once selected. here is the entire js file is there anything in there that might be preventing it? Code: /* Page: rating.js Created: Aug 2006 Last Mod: Mar 11 2007 Handles actions and requests for rating bars. --------------------------------------------------------- ryan masuga, masugadesign.com ryan@masugadesign.com Licensed under a Creative Commons Attribution 3.0 License. http://creativecommons.org/licenses/by/3.0/ See readme.txt for full credit details. --------------------------------------------------------- */ var xmlhttp /*@cc_on @*/ /*@if (@_jscript_version >= 5) try { xmlhttp=new ActiveXObject("Msxml2.XMLHTTP") } catch (e) { try { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP") } catch (E) { xmlhttp=false } } @else xmlhttp=false @end @*/ if (!xmlhttp && typeof XMLHttpRequest!='undefined') { try { xmlhttp = new XMLHttpRequest(); } catch (e) { xmlhttp=false } } function myXMLHttpRequest() { var xmlhttplocal; try { xmlhttplocal= new ActiveXObject("Msxml2.XMLHTTP") } catch (e) { try { xmlhttplocal= new ActiveXObject("Microsoft.XMLHTTP") } catch (E) { xmlhttplocal=false; } } if (!xmlhttplocal && typeof XMLHttpRequest!='undefined') { try { var xmlhttplocal = new XMLHttpRequest(); } catch (e) { var xmlhttplocal=false; alert('couldn\'t create xmlhttp object'); } } return(xmlhttplocal); } function sndReq(vote,id_num,ip_num,units) { var theUL = document.getElementById('unit_ul'+id_num); // the UL // switch UL with a loading div theUL.innerHTML = '<div class="loading"></div>'; xmlhttp.open('get', 'rpc.php?j='+vote+'&q='+id_num+'&t='+ip_num+'&c='+units); xmlhttp.onreadystatechange = handleResponse; xmlhttp.send(null); } function handleResponse() { if(xmlhttp.readyState == 4){ if (xmlhttp.status == 200){ var response = xmlhttp.responseText; var update = new Array(); if(response.indexOf('|') != -1) { update = response.split('|'); changeText(update[0], update[1]); } } } } function changeText( div2show, text ) { // Detect Browser var IE = (document.all) ? 1 : 0; var DOM = 0; if (parseInt(navigator.appVersion) >=5) {DOM=1}; // Grab the content from the requested "div" and show it in the "container" if (DOM) { var viewer = document.getElementById(div2show); viewer.innerHTML = text; } else if(IE) { document.all[div2show].innerHTML = text; } } /* =============================================================== */ var ratingAction = { 'a.rater' : function(element){ element.onclick = function(){ var parameterString = this.href.replace(/.*\?(.*)/, "$1"); // onclick="sndReq('j=1&q=2&t=127.0.0.1&c=5'); var parameterTokens = parameterString.split("&"); // onclick="sndReq('j=1,q=2,t=127.0.0.1,c=5'); var parameterList = new Array(); for (j = 0; j < parameterTokens.length; j++) { var parameterName = parameterTokens[j].replace(/(.*)=.*/, "$1"); // j var parameterValue = parameterTokens[j].replace(/.*=(.*)/, "$1"); // 1 parameterList[parameterName] = parameterValue; } var theratingID = parameterList['q']; var theVote = parameterList['j']; var theuserIP = parameterList['t']; var theunits = parameterList['c']; //for testing alert('sndReq('+theVote+','+theratingID+','+theuserIP+','+theunits+')'); return false; sndReq(theVote,theratingID,theuserIP,theunits); return false; } } }; Behaviour.register(ratingAction); many thanks for any help Luke This is puzzling me. It's an incremental search function. Any help for a Javascript novice much appreciated: Code: $(function () { $('#quickFilter').incrementalFilter({ items: 'dl.entryList > dt', foundCounter: '#resultCount', totalCounter: '#totalCounter', minChars: 2 }).focus(); }) ... here's the rest of it: Code: (function($) { var IncrementalFilter = function(params){ var setting = this.setting = { input: undefined, items: undefined, searchScope: '*', minChars: 2, useHighlight: true, foundCounter: undefined, totalCounter: undefined, highlightElem: $('<em class="highlight" />'), foundClass: 'found', zeroClass: 'zero' } $.extend(setting,params) this.input = $(setting.input); this.items = $(setting.items); this.minChars = setting.minChars; if(setting.foundCounter){ this.totalCounter = setting.totalCounter; this.foundCounter = new IncrementalFilter.Counter(setting); } this.formerQuery = ''; this.itemData = []; this.init(); } IncrementalFilter.prototype = { makeData: function(){ var that = this; this.items.each(function(){ var obj = [$(this)] if($(this).is('dt')){ obj.push($(this).next()) } that.itemData.push(new IncrementalFilter.SearchedItem(obj,that.setting)); }) if(this.foundCounter){ this.foundCounter.refresh(this.itemData.length); if(this.totalCounter){ $(this.totalCounter).html(this.foundCounter.all) } } }, processQuery: function(query){ var tempq = this.escapeQuery(query) tempq = $.trim(tempq).split(/\s+/); var queries = [] for(var i=0,l=tempq.length;i<l;i++){ for(var j=0,m=tempq.length;j<m;j++){ if(i!=j && tempq[i] && (tempq[i] == tempq[j] || RegExp(tempq[i]).test(tempq[j]) || tempq[i].length < this.minChars)){ tempq.splice(i,1) l = m = tempq.length; } } if(tempq[i]){ queries.push(tempq[i]) } } if(queries.join(' ') != this.formerQuery){ this.search(queries); this.formerQuery = queries.join(' '); } }, escapeQuery: function(query){ var escapeChars = '.+*^$?()[]{}'; var res = query; for(var i=0,l=escapeChars.length;i<l;i++){ var ec = escapeChars.charAt(i); res = res.replace(RegExp('\\'+ec,'g'),'\\'+ec); } return res; }, search: function(queries){ var that = this; var count = 0; $(that.itemData).each(function(){ var self = this; var matchCount = 0; $.each(queries,function(){ if(RegExp(this,'i').test(self.text)) matchCount++; }) if(matchCount == queries.length){ this.showItem() this.clearHighlight(function(){ $.each(queries,function(){ self.highlightWord(this) }) }); count++; }else{ this.hideItem(); } }) if(this.foundCounter){ this.foundCounter.refresh(count) } }, reset: function(){ var that = this; $(this.itemData).each(function(){ this.showItem(); this.clearHighlight(); if(that.foundCounter){ that.foundCounter.reset(); } }) }, setEvent: function(){ var that = this; this.input.bind('keyup',function(){ var val = $(this).val(); if(val.length >= that.minChars){ that.processQuery(val) }else{ that.reset(); } }) }, init: function(){ this.makeData(); this.setEvent(); if(this.input.val().length >= this.minChars){ this.processQuery(this.input.val()) } } } /** *@param obj {array} **/ IncrementalFilter.SearchedItem = function(obj,setting){ this.useHighlight = (setting.useHighlight && $.fn.highlightText && $.fn.removeOuterTag) if(this.useHighlight){ this.highlightElem = setting.highlightElem || $('<em class="highlight" />'); this.highlightExpr = /^<(\w+)/.exec($('<div />').append(this.highlightElem).html())[1] + '.'+this.highlightElem.attr('class').split(/\s/).join('.'); } this.text = ''; this.obj = []; for(var i=0,l=obj.length;i<l;i++){ var temp = obj[i]; this.obj[i] = {'elem':temp,'orgsrc':temp.html()} this.text += obj[i].text(); } } IncrementalFilter.SearchedItem.prototype = { hideItem: function(){ $(this.obj).each(function(){ this.elem.hide(); }) return this; }, showItem: function(){ $(this.obj).each(function(){ this.elem.show(); }) return this; }, clearHighlight: function(callback){ if(!this.useHighlight) return this; var that = this; $(this.obj).each(function(){ $(that.highlightExpr,this.elem).removeOuterTag() }) if(callback) callback(); return this; }, highlightWord: function(word){ if(!this.useHighlight) return this; var that = this; var query = new RegExp(word,'gi') $(this.obj).each(function(){ this.elem.highlightText(query,that.highlightElem) }) return this; } } IncrementalFilter.Counter = function(setting){ if(!setting || !setting.foundCounter) return undefined; this.obj = $(setting.foundCounter); this.foundClass = setting.foundClass || 'found'; this.zeroClass = setting.zeroClass || 'zero'; this.all = undefined; this.refresh = function(count){ this.obj.html(count); if(!this.all){ this.all = count; } if(count == 0){ this.zero() }else if(count < this.all){ this.highlight(); } } this.reset = function(){ this.refresh(this.all); this.obj .removeClass(this.foundClass) .removeClass(this.zeroClass) } this.highlight = function(){ this.obj .removeClass(this.zeroClass) .addClass(this.foundClass) } this.zero = function(){ this.obj .removeClass(this.foundClass) .addClass(this.zeroClass) } return this; } $.fn.incrementalFilter = function(params){ return this.each(function(){ if(typeof params == 'string' || params.size){ new IncrementalFilter({input:$(this),items:params}) }else if(typeof params == 'object'){ params.input = $(this); new IncrementalFilter(params) } }); }; Hello to all, I think that you will frequently read this boring sentence: "Javascript does not work with Firefox". Below a very very simple html with Javascript. Using MS IE v8 I have found that the code works very well. Filling nothings in the textfield "your name" and subsequently clicking on the button and a window will popup with the text "Sorry, you forget to: blah-blah ..." However, using Firefox instead...it does not work. A bit remarkable; the Javascript is very easy! Could you please check what went wrong? I have activated Javascript in the Firefox browser and the security is ok for Javascript. I hope that someone can provide me a useful hint. Best regards, Cornelis The Netherlands - Gouda (yes, the town where cheese is inherently linked) [CODE] <html> <head> <meta http-equiv="Content-Language" content="nl"> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>Inloggen van een nieuw lid</title> <script language = "Javascript"> function checkDate() { var message = "Sorry, you forget to: \n"; var voornaam = document.getElementById("voornaam"); var result = true; if (voornaam.value.length == 0) { message+="- You have not typed your name\n"; result = false;} if(!result) {alert(message)}; return result; } </script> </head> <body> <FORM METHOD="post" name=CheckDate onsubmit="return checkDate(this);" > <div style="position: absolute; width: 603px; height: 378px; z-index: 1; left: 30px; top: 13px" id="laag1"> <p align="center"><font face="Trebuchet MS" color="#00750F" size="5"><b> Test</b></font></p> <table border="0" width="100%" bgcolor="#C4FFC4" style="border-collapse: collapse" id="table3"> <tr> <td> </td> </tr> </table> <p align="left"> </p> <table border="0" width="69%" id="table1" height="210" style="border-collapse: collapse"> <tr> <td width="37%"><font face="Trebuchet MS">your name</font></td> <td width="59%"> <p align="center"><input type="text" name="voornaam" size="25"></td> </tr> <tr> <td colspan="2" height="90"> <p align="center"> <input type="submit" value="Register me" name="Registreren"> </td> </tr> </table> <p> </p> </div> </body> </form> </html> Hi, Using the following javascript: Code: <script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"> </script> <script type="text/javascript" src="http://twitter.com/statuses/user_timeline/USERNAME.json?callback=twitterCallback2&count=1"> </script> I am able to display the latest tweet of a user into a div. However, I have a user-generated database of username's stored in an XML file and would like to list each username's latest tweet on a single page. Any thoughts on how I might be able to achive this? I'm new to javascript so forgive my stupidity. I have a page with a GoogleMap with a GoogleBar and I would like the GoogleBar to appear with something written in it already and to have that search executed. In other words, I would like to "write something to the GoogleBar and press Enter" automatically as soon as the map loads. How can I do this? btw: By GoogleBar, I mean the search bar that appears on the map after using the enableGoogleBar() function. Hi, I'm not sure where I have translated this incorrectly. I have one google map embedded on my page which works fine. But I wanted to add a second one. I thought the easiest way to do this would be to have a second page which is called later on with all the details on it for the second map. However although I think (this I presume is where I went wrong) I have replicated the instructions correctly the place holder for the second map just remains blank. This is the code for my called page with the instructions for the second map: PHP Code: <?php echo $_POST['Map'] . '<br />'; ?> <div id="placemap_canvas"></div> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <style type="text/css"> html {height:250px} body {height:250px} #placemap_canvas {width:100%; height:150px;} </style> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true" /> </script> <script type="text/javascript"> var latlng = new google.maps.LatLng ( <?php include("dbconnect.php"); $result = mysql_query("SELECT * FROM regions WHERE RegionPId='{$_POST['Map']}'"); while($row = mysql_fetch_array($result)){ echo $row['maplink']; } mysql_close($con); ?> ); var myOptions = { zoom: 4, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("placemap_canvas"), myOptions); } </script> And this is the script of the main page, just in case I would be better off keeping them both in one place. Code: <head> <script type="text/javascript"> function loadSubPlace(File,ID,Msg,Eile,EID,Esg){ loadXMLDoc1(File,ID,Msg); var mimer = setTimeout(function(){loadXMLDoc1(Eile,EID,Esg)},5000); } </script> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <style type="text/css"> html {height:250px} body {height:250px} #map_canvas {width:30%; height:250px;} </style> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true" /> </script> <script type="text/javascript"> function initialize() { var latlng = new google.maps.LatLng ( <?php include("dbconnect.php"); $result = mysql_query("SELECT * FROM countries WHERE Country='{$_SESSION['Country']}'"); while($row = mysql_fetch_array($result)){ echo $row['Map']; } mysql_close($con); ?>); var myOptions = { zoom: 4, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); } </script> </head> <body onload="initialize()"> <div class="countryright" id="map_canvas"> include("dbconnect.php"); $snowball=explode(';',$_POST['syringa']); $turnsol=$snowball[1]; $violet =$snowball[2]; $wakerobin=$snowball[3]; global $turnsol; global $violet; global $wakerobin; echo '<center><b><big>' . $wakerobin. '</big></b></center><br /><br />'; $result=mysql_query("SELECT * FROM regions WHERE country='{$turnsol}' AND region='{$violet}' AND place='{$wakerobin}' AND sub !='' ORDER BY sub ASC"); while($row = mysql_fetch_array($result)){ $wheat="{$row['RegionPId']};{$turnsol};{$violet};{$wakerobin};{$row['sub']}"; $tigerlilly=$row['RegionPId']; echo '<input type="button" class="button3" name="place" id="place" value="' . $row['sub'] . '" onclick="loadSubPlace(\'getPlace.php\',\'txtHintPlaceSub\',\'hepatica=' . urlencode($wheat) . '\',\'getPlaceMap.php\',\'placemapcanvas\',\'Map=' . urlencode($tigerlilly) . '\');" />'; } echo '<input type="button" class="button3" name="addplace" id="addplace" value="Add Place" onclick="loadXMLDoc1(\'getAddPlaceSub.php\',\'txtHintPlaceSub\', encodeURI(\'addsubplace=' . $_POST['syringa'] . '\'));" />'; echo '<br /><br /><div id="txtHintPlaceSub"></div><br /><br />'; mysql_close($con); ?> I've cut out the script that doesn't relate to this so I hope I haven't missed anything important. Can the Google API replace scraping? You can get blocked by Google if you scrape, but can you get the same info from the Google API at no risk?
I have some problems with intergrating google maps into my page I cant seem to get a marker to appear on my map. I have tried numerous methods but non seem to work. I have integrated the google maps on my main site, repositioned and re-sized. The code below is a test page i work on to get code to work. It's just a map on a page entire code: <!DOCTYPE HTML> <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <style type="text/css"> html { height: 100% } body { height: 100%; margin: 25px; padding: 25px } #map_canvas { height: 100% } </style> <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDrxZnpYBNIwzBFVYaDY__BMONEjNEGZaI&sensor=false"> </script> <script type="text/javascript"> function initialize() { var myLatlng = new google.maps.LatLng(-25.363882,131.044922); var myOptions = { zoom: 4, center: myLatlng, mapTypeId: google.maps.MapTypeId.ROADMAP } var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);} var marker = new google.maps.Marker({ position: myLatlng, map: map, title:"Hello World!" }); </script> </head> <body onload="initialize()"> <div id="map_canvas" style="width:100%; height:100%"></div> </body> </html> can anybody tell my where i am going wrong and just the map appears with no marker? thanks Hi, I have a table with FROM and TO columns and a column with MAP/DIRECTIONS link. When a user clicks on the link, it should display Map and Directions on the iframe on the same page. How can I achieve this using Google map and directions API? Thanks Hello Everyone! I'm new to the forums but have a question with Google Translate I'm trying to add to my site. I believe the code for Google Translate is a Java Script and I'd like to put this on my website in the side column. The only thing I would like to modify is a <br> (break) between the Powered by and Google Translate. So I would like it to be center aligned like: Powered by Google Translate Right now it is stretching out the column because of the added space and frustrating me! Any idea how to do this? Here is the code: Code: <div id="google_translate_element"></div><script> function googleTranslateElementInit() { new google.translate.TranslateElement({ pageLanguage: 'en' }, 'google_translate_element'); } </script><script src="http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script> My knowledge of javascript and coding in general is very very limited so any changes you make or where I should put the code, definitely let me know Thanks, Phil I am designing a site where users can submit a location. I want to use Google Maps with a draggable marker which posts the lat, lon when dropped on a position. I was wondering if anyone knows of a tutorial or could point me in the direction of anything similar. Hi, Can anyone help define the difference between the 2 scripts below and help identify what is/should happen for each? Code: <script type="text/javascript"> var _gaq = _gaq || []; //NHG COMMENT: if there is an existing account, then it needs to be incorporated within this tag. //The xx-xxxx-x par represents the google account code that needs to be inserted // if there is no existing tag in place, then take out the 2 follwoing lines marked (1) and (2)and (3) (1) _gaq.push(['_setAccount', 'XX-XXXXXX-X']); (2) _gaq.push(['_setDomainName', 'MYSUBDOMAIN.domain.com']); (3) _gaq.push(['_trackPageview']); NHG COMMENT: This is the global tag and everything below this MUST NOT BE CHANGED _gaq.push(['_setAccount', UA-16522538-1']); _gaq.push(['_setDomainName', 'domain.com']); _gaq.push(['_setAllowLinker', true]); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script> Code: // copy and paste the tag below <script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'XX-XXXXXX-X']); _gaq.push(['_setDomainName', 'MYSUBDOMAIN.domain.com']); _gaq.push(['_trackPageview']); _gaq.push(['_setAccount', UA-16522538-1']); _gaq.push(['_setDomainName', 'domain.com']); _gaq.push(['_setAllowLinker', true]); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script> Hi there, I know too little of JavaScript to get the Google Maps API working. I hope someone can help me out! My goal is to display an address. In the example on google, you can input it through a form: http://code.google.com/apis/maps/doc...ng-simple.html I would like the map to show the location+marker when I open the page, not after clicking a submit button. However, I only want an address in my html. I want the API to convert it in a LatLng format. Hopefully, someone can take the time to look at it. It's all in the source code of the page mentioned above, I believe. Thanks! Is there a javascript that when I mouse over a object like the the magnifying glass that can be seen after a google search that will display a preview image and then make that image clickable to pull up that webpage/file? TYIA James i take an google suggestions code. view source... i hope that is the best "ajax google suggestions" code created... and try to understand it. someone can help to understand that javascript ? write remarks... formated code file attached + : Link1 Hello guyz! I need to fetch some images whit custom sizes in Google Images, this is the API from Google that let me search end fetch images: Code: /* * How to search for images and restrict them by size. * This demo will also show how to use Raw Searchers, aka a searcher that is * not attached to a SearchControl. Thus, we will handle and draw the results * manually. */ google.load('search', '1'); function searchComplete(searcher) { // Check that we got results if (searcher.results && searcher.results.length > 0) { // Grab our content div, clear it. var contentDiv = document.getElementById('content'); contentDiv.innerHTML = ''; // Loop through our results, printing them to the page. var results = searcher.results; for (var i = 0; i < results.length; i++) { // For each result write it's title and image to the screen var result = results[i]; var imgContainer = document.createElement('div'); var title = document.createElement('h2'); // We use titleNoFormatting so that no HTML tags are left in the title title.innerHTML = result.titleNoFormatting; var newImg = document.createElement('img'); // There is also a result.url property which has the escaped version newImg.src = result.tbUrl; imgContainer.appendChild(title); imgContainer.appendChild(newImg); // Put our title + image in the content contentDiv.appendChild(imgContainer); } } } function onload() { // Our ImageSearch instance. var imageSearch = new google.search.ImageSearch(); // Restrict to extra large images only imageSearch.setRestriction(google.search.ImageSearch.RESTRICT_IMAGESIZE, google.search.ImageSearch.IMAGESIZE_MEDIUM); // Here we set a callback so that anytime a search is executed, it will call // the searchComplete function and pass it our ImageSearch searcher. // When a search completes, our ImageSearch object is automatically // populated with the results. imageSearch.setSearchCompleteCallback(this, searchComplete, [imageSearch]); // Find me a beautiful car. imageSearch.execute("Subaru STI"); } google.setonloadCallback(onload); But all I could find about restricted images sizes is this: Code: imageSearch.setRestriction(google.search.ImageSearch.RESTRICT_IMAGESIZE, google.search.ImageSearch.IMAGESIZE_MEDIUM); My problem is that I need custom fixes images sizes, not between a range of values like the above script was giving me... Google API reference says that: Code: google.search.ImageSearch.RESTRICT_IMAGESIZE - When this is specified as the value of type, the image search results will be restricted to images with certain pixel dimensions. Valid optional values for this type are as follows: * google.search.ImageSearch.IMAGESIZE_SMALL - restrict to small images, icons * google.search.ImageSearch.IMAGESIZE_MEDIUM - restrict to medium images * google.search.ImageSearch.IMAGESIZE_LARGE - restrict to large images * google.search.ImageSearch.IMAGESIZE_EXTRA_LARGE - restrict to extra large images Those who wants to play whit Google Playground, this is the link: Code: http://goo.gl/sPs2 Could some one help me get that images whit fixed sizes? Hey I'm quite new at javascript and am currently in the process of creating a site that embeds google maps using an xml document. What I'm trying to do is categories the markers on my map. I am trying to make it so there are check boxes at the bottom and when i check the boxes, i.e. theatres, the markers will appear for the theatres and disappear when unchecked. Using some example code i have modified, i have so far got the maps to pickup the markers from the xml with the check boxes but the markers are all just on the page and the check boxes dont do anything and I am stuck as to of why. here's my code: Code: <!DOCTYPE HTML> <html> <head> <title>Google Maps</title> <script src="mykey"></script> </head> <body style="margin:0px; padding:0px;" onload="initialize()"> <table border=1> <tr> <td> <div id="map" style="width: 550px; height: 450px"></div> </td> <td valign="top" style="width:150px; text-decoration: underline; color: #4444ff;"> <div id="side_bar"></div> </td> </tr> </table> <form action="#"> Theatres: <input type="checkbox" id="theatrebox" onclick="boxclick(this,'theatre')" /> Golf Courses: <input type="checkbox" id="golfbox" onclick="boxclick(this,'golf')" /> Tourist Information: <input type="checkbox" id="infobox" onclick="boxclick(this,'info')" /><br /> </form> <script type="text/javascript"> _uacct = "UA-162157-1"; urchinTracker(); </script> </body> <script type="text/javascript"> //<![CDATA[ if (GBrowserIsCompatible()) { var side_bar_html = ""; var gmarkers = []; var map = null; function createMarker(point,name,html,category) { var marker = new GMarker(point); GEvent.addListener(marker, "click", function() { marker.openInfoWindowHtml(html); }); marker.mycategory = category; marker.myname = name; gmarkers.push(marker); side_bar_html += '<a href="javascript<b></b>:myclick(' + (gmarkers.length-1) + ')">' + name + '<\/a><br>'; return marker; } function show(category) { for (var i=0; i<gmarkers.length; i++) { if (gmarkers[i].mycategory == category) { gmarkers[i].setVisible(true); } } document.getElementById(category+"box").checked = true; } ensures the checkbox is cleared == function hide(category) { for (var i=0; i<gmarkers.length; i++) { if (gmarkers[i].mycategory == category) { gmarkers[i].setVisible(false); } } document.getElementById(category+"box").checked = false; that we just hid infowindow.close(); } function boxclick(box,category) { if (box.checked) { show(category); } else { hide(category); } makeSidebar(); } function myclick(i) { google.maps.event.trigger(gmarkers[i],"click"); } var map = new GMap2(document.getElementById("map")); map.addControl(new GLargeMapControl()); map.addControl(new GMapTypeControl()); map.setCenter(new GLatLng( 53.8363,-3.03771), 11); GDownloadUrl("categories.xml", function(doc) { var xmlDoc = GXml.parse(doc); var markers = xmlDoc.documentElement.getElementsByTagName("marker"); for (var i = 0; i < markers.length; i++) { // obtain the attribues of each marker var lat = parseFloat(markers[i].getAttribute("lat")); var lng = parseFloat(markers[i].getAttribute("lng")); var point = new google.maps.LatLng(lat,lng); var address = markers[i].getAttribute("address"); var name = markers[i].getAttribute("name"); var html = "<b>"+name+"<\/b><p>"+address; var category = markers[i].getAttribute("category"); // create the marker var marker = createMarker(point,name,html,category); map.addOverlay(marker); } document.getElementById("side_bar").innerHTML = side_bar_html; show("theatre"); hide("golf"); hide("info"); }); } else { alert("Sorry, the Google Maps API is not compatible with this browser"); } </script> </body> </html> If anybody help with this and tell me where I am going wrong, it would be much appreciated. thanks |