JavaScript - Google Translator Problem
hi all,,
actually i used ajax api script.the problem is, the code works well in mozilla and other browser but in IE the dropdown list not showing.. its showing the error google/default+en.I.js line114 (c.g) object not defined.. the code is <script type="text/javascript" src="js/jquery.js"></script> <script src="js/jquery.translate-1.3.7.min.js" type="text/javascript"></script> <script type="text/javascript"> jQuery(function($){ //when DOM is ready $.translate(function(){ //when the Google Language API is loaded function translateTo( destLang ){ //this can be declared in the global scope too if you need it somewhere else $('body').translate( 'english', destLang, { //translate from english to the selected language not: '.jq-translate-ui, .header', //by default the generated element has this className fromOriginal:true //always translate from english (even after the page has been translated) }); } $.translate.ui('select', 'option') .appendTo('#aj') //insert the element to the page .change(function(){ //when selecting another language translateTo( $(this).val() ); return false; //prevent default browser action }); }); }); </script> <div id="aj"></div> Similar Tutorialshai....any of you got free javascripts text Translator code...i really need it ASAP..tq.. i got one but it not work very good when i put 1000++ words...example : Code: <script type="text/javascript"> function translate(phrase) { phrase = document.getElementById('input').value; phrase = phrase.replace(/why/g, "y"); phrase = phrase.replace(/are/g, "r"); phrase = phrase.replace(/you/g, "u"); phrase = phrase.replace(/for/g, "4"); phrase = phrase.replace(/to/g, "2"); document.getElementById('output').value = phrase; } </script> <textarea id="input"></textarea><br /> <input type="button" value="translate" onClick="translate();" /><br /> <textarea id="output"></textarea> I have a successful translator that has random letter, number and symbols assigned to various letters problem is it only lets assign 1 character to 1 letter when i want to assign 4 characters to each letter to ensure the code cant be broken here is a snipet of what im working with its different then normal translators....
Code: <script language="javascript"> function translate() { if (document.form1.elements[0].checked == true) { EtoA() } else if (document.form1.elements[1].checked == true) { AtoE() } else { } } function EtoA() { var toggle = "false" var xlate = document.form1.elements[4].value var xlation = "" document.form1.elements[5].value = "" for (var i = 0; i <= xlate.length; i++) { tempa = xlate.charAt(i) if ( tempa == "[") { toggle = "true" i++ } else if ( tempa == "]") { toggle = "false" i++ } tempa = xlate.charAt(i) if (toggle == "true") { tempb = tempa } else if(tempa == "a") { tempb = "9" } else if(tempa == "b") { tempb = "a" } else if(tempa == "c") { tempb = "0" } else if(tempa == "d") { tempb = "c" } else if(tempa == "e") { tempb = "3" } else if(tempa == "f") { tempb = "b" } else if(tempa == "g") { tempb = "4" } else if(tempa == "h") { tempb = "?" } else if(tempa == "i") { tempb = "5" } else if(tempa == "j") { tempb = "6" } else if(tempa == "k") { tempb = "e" } else if(tempa == "l") { tempb = "+" } else if(tempa == "m") { tempb = "x" } else if(tempa == "n") { tempb = "7" } else if(tempa == "o") { tempb = "v" } else if(tempa == "p") { tempb = "1" } else if(tempa == "q") { tempb = "t" } else if(tempa == "r") { tempb = "q" } else if(tempa == "s") { tempb = "g" } else if(tempa == "t") { tempb = "n" } else if(tempa == "u") { tempb = "<" } else if(tempa == "v") { tempb = ">" } else if(tempa == "w") { tempb = "^" } else if(tempa == "x") { tempb = "!" } else if(tempa == "y") { tempb = "@" } else if(tempa == "z") { tempb = "#" } else if(tempa == "A") { tempb = "9" } else if(tempa == "B") { tempb = "a" } else if(tempa == "C") { tempb = "0" } else if(tempa == "D") { tempb = "c" } else if(tempa == "E") { tempb = "3" } else if(tempa == "F") { tempb = "b" } else if(tempa == "G") { tempb = "4" } else if(tempa == "H") { tempb = "h" } else if(tempa == "I") { tempb = "5" } else if(tempa == "J") { tempb = "6" } else if(tempa == "K") { tempb = "e" } else if(tempa == "L") { tempb = "f" } else if(tempa == "M") { tempb = "x" } else if(tempa == "N") { tempb = "7" } else if(tempa == "O") { tempb = "v" } else if(tempa == "P") { tempb = "1" } else if(tempa == "Q") { tempb = "t" } else if(tempa == "R") { tempb = "q" } else if(tempa == "S") { tempb = "g" } else if(tempa == "T") { tempb = "n" } else if(tempa == "U") { tempb = "<" } else if(tempa == "V") { tempb = ">" } else if(tempa == "W") { tempb = "^" } else if(tempa == "X") { tempb = "!" } else if(tempa == "Y") { tempb = "@" } else if(tempa == "Z") { tempb = "#" } else if(tempa == "1") { tempb = "}" } else if(tempa == "2") { tempb = "{" } else if(tempa == "3") { tempb = "(" } else if(tempa == "4") { tempb = "'" } else if(tempa == "5") { tempb = "|" } else if(tempa == "6") { tempb = "`" } else if(tempa == "7") { tempb = ":" } else if(tempa == "8") { tempb = ";" } else if(tempa == "9") { tempb = "=" } else if(tempa == "0") { tempb = ")" } else if(tempa == "~") { tempb = "R" } else if(tempa == "!") { tempb = "T" } else if(tempa == "@") { tempb = "F" } else if(tempa == "#") { tempb = "Y" } else if(tempa == "$") { tempb = "K" } else if(tempa == "%") { tempb = "J" } else if(tempa == "^") { tempb = "H" } else if(tempa == "&") { tempb = "G" } else if(tempa == "*") { tempb = "X" } else if(tempa == "_") { tempb = "V" } else if(tempa == "-") { tempb = "B" } else if(tempa == "+") { tempb = "M" } else if(tempa == "=") { } else if(tempa == "<") { tempb = "N" } else if(tempa == ">") { tempb = "U" } else if(tempa == ".") { tempb = "S" } else if(tempa == ",") { tempb = "W" } else if(tempa == "?") { tempb = "." } else if(tempa == ":") { tempb = "," } else if(tempa == ";") { tempb = "$" } else { tempb = tempa } xlation = document.form1.elements[5].value document.form1.elements[5].value = xlation + tempb } } function AtoE() { var toggle = "false" var xlate = document.form1.elements[4].value var xlation = "" document.form1.elements[5].value = "" for (var i = 0; i <= xlate.length; i++) { tempa = xlate.charAt(i) if ( tempa == "[") { toggle = "true" i++ } else if ( tempa == "]") { toggle = "false" i++ } tempa = xlate.charAt(i) if (toggle == "true") { tempb = tempa } else if(tempa == "9") { tempb = "a" } else if(tempa == "a") { tempb = "b" } else if(tempa == "0") { tempb = "c" } else if(tempa == "c") { tempb = "d" } else if(tempa == "3") { tempb = "e" } else if(tempa == "b") { tempb = "f" } else if(tempa == "4") { tempb = "g" } else if(tempa == "?") { tempb = "h" } else if(tempa == "5") { tempb = "i" } else if(tempa == "6") { tempb = "j" } else if(tempa == "e") { tempb = "k" } else if(tempa == "+") { tempb = "l" } else if(tempa == "x") { tempb = "m" } else if(tempa == "7") { tempb = "n" } else if(tempa == "v") { tempb = "o" } else if(tempa == "1") { tempb = "p" } else if(tempa == "t") { tempb = "q" } else if(tempa == "q") { tempb = "r" } else if(tempa == "g") { tempb = "s" } else if(tempa == "n") { tempb = "t" } else if(tempa == "<") { tempb = "u" } else if(tempa == ">") { tempb = "v" } else if(tempa == "^") { tempb = "w" } else if(tempa == "!") { tempb = "x" } else if(tempa == "@") { tempb = "y" } else if(tempa == "#") { tempb = "z" } else if(tempa == "9") { tempb = "A" } else if(tempa == "a") { tempb = "B" } else if(tempa == "0") { tempb = "C" } else if(tempa == "c") { tempb = "D" } else if(tempa == "3") { tempb = "E" } else if(tempa == "b") { tempb = "F" } else if(tempa == "4") { tempb = "G" } else if(tempa == "?") { tempb = "H" } else if(tempa == "5") { tempb = "I" } else if(tempa == "6") { tempb = "J" } else if(tempa == "e") { tempb = "K" } else if(tempa == "+") { tempb = "L" } else if(tempa == "x") { tempb = "M" } else if(tempa == "7") { tempb = "N" } else if(tempa == "v") { tempb = "O" } else if(tempa == "1") { tempb = "P" } else if(tempa == "t") { tempb = "Q" } else if(tempa == "q") { tempb = "R" } else if(tempa == "g") { tempb = "S" } else if(tempa == "n") { tempb = "T" } else if(tempa == "<") { tempb = "U" } else if(tempa == ">") { tempb = "V" } else if(tempa == "^") { tempb = "W" } else if(tempa == "!") { tempb = "X" } else if(tempa == "@") { tempb = "Y" } else if(tempa == "#") { tempb = "Z" } else if(tempa == "}") { tempb = "1" } else if(tempa == "{") { tempb = "2" } else if(tempa == "(") { tempb = "3" } else if(tempa == "'") { tempb = "4" } else if(tempa == "|") { tempb = "5" } else if(tempa == "`") { tempb = "6" } else if(tempa == ":") { tempb = "7" } else if(tempa == ";") { tempb = "8" } else if(tempa == "=") { tempb = "9" } else if(tempa == ")") { tempb = "0" } else if(tempa == "R") { tempb = "~" } else if(tempa == "T") { tempb = "!" } else if(tempa == "F") { tempb = "@" } else if(tempa == "Y") { tempb = "#" } else if(tempa == "K") { tempb = "$" } else if(tempa == "J") { tempb = "%" } else if(tempa == "H") { tempb = "^" } else if(tempa == "G") { tempb = "&" } else if(tempa == "X") { tempb = "*" } else if(tempa == "V") { tempb = "_" } else if(tempa == "B") { tempb = "-" } else if(tempa == "M") { tempb = "+" } else if(tempa == "N") { tempb = "<" } else if(tempa == "U") { tempb = ">" } else if(tempa == "S") { tempb = "." } else if(tempa == "W") { tempb = "," } else if(tempa == ".") { tempb = "?" } else if(tempa == ",") { tempb = ":" } else if(tempa == "$") { tempb = ";" } else { tempb = tempa } xlation = document.form1.elements[5].value document.form1.elements[5].value = xlation + tempb } } Can anyone help me out in assigning more then one character? Multple characters work when going english to my custom assignments but it cant translate back from my custom assignments to english. I have tried using Microsofts translator widget but it messes up my menu that I wish it to sit beside, the widget is almost twice the height if my menu bar. I am after a widget that is just text and the user clicks it to open up a select language box. Does anyone have other widgets they use that is based on a single line selector not more than say 15px high or some thing like that ? Hey guys! I need a simple JavaScript word translator where the user can type a sentence into a text box and then be presented with what they just typed in on the page but with any programmed word replacements. I want to be able to programme in the words myself for replacement so no Google; this will be a personal offline thing and isn't used to translate a language. For example, if I programmed the word " chocolate " to be replaced with " strawberry ", and " a lot " to be replaced with " loads ", and typed into the text-box: "I like chocolate sauce a lot ". It would then display the sentence on the page, but with the word alterations. Therefore looking like this: "I like strawberry sauce loads ". That being just an example. I want to be able to easily add additional word replacements without hassle using only JavaScript, I don't want it to translate the text on the page or anything, just what you type into the text-box. So let's pretend the words were programmed as follows: . cat = dog, . love = adore . very much = a lot And I typed into the text-box the following: "I have a cat, and I love her very much. " On the same page, it would then display this text: "I have a dog, and I adore him a lot. " I cannot use other code as I am only fond with JavaScript. I would need the text-box to automatically be selected by default everytime the page is loaded, and then for it to clear everytime you click 'Submit' or press the [Enter] key, ready for the next sentence to be typed in. I know this is a lot to ask but I didn't know who else to turn to. Anyways, I know you'll know this WAY better than me, ha; hope you can help! Cheers guys!!! I am trying to write a translator box for my website. So far, I've been able to get working code from a tutorial: Code: <input id="ori" type="text" /> <button onclick="translate();">Translate</button> <div id="trans"></div> <script> var languageFrom = "en"; var languageTo = "fr"; function translate() { document.getElementById('trans').innerHTML="Translating... please wait"; var text= document.getElementById('ori').value; window.mycallback = function(response) { document.getElementById('trans').innerHTML=response; } var s = document.createElement("script"); s.src = "http://api.microsofttranslator.com/V2/Ajax.svc/Translate?oncomplete=mycallback&appId=<MY-APP-ID>&from=" + languageFrom + "&to=" + languageTo + "&text=" + text; document.getElementsByTagName("head")[0].appendChild(s); } </script> (Script it from he http://wizardsoweb.com/microsoftbing...itcher=desktop) Basically, once I fill in my APPID, it will translate the text in the ori text box to French. Of course, this all works fine, but here's what I'm trying to do: I want there to be two drop down menus. One will populate the languageFrom variable with a specified language, and another drop down menu which will populate the languageTo variable with a specified language. I've already posted about this matter in a different post: http://stackoverflow.com/questions/8...from-drop-down (It's on stackoverflow). That way, when you select a value from the drop down menu, it populates the variable. I have a working example of this on jsFiddle: http://jsfiddle.net/charlescarver/hk2bJ/1/ (This includes my working API key so I it's easy to work on) SO, I think the problem with this is that the script which controls the translation is loaded when the variables are empty, and then doesn't update when a drop down option is selected. I think this can be fixed by calling the script when the button is clicked, instead of when the page is loaded. How can this be accomplished? The Microsoft support is poorly documented and I can't find a solution there or on google. Here's a link to the API documentation: http://msdn.microsoft.com/en-us/library/ff512385.aspx So I have an assignment where I need to make a program to make a simple translator. Where I insert a text box for the user to input i.e. "Hello" and the other textbox to display the word in spanish. Problem is im having trouble displaying the output and having a textbox to out put it too. Also i dont think my button is functioning correctly. Please help! It would be greatly appreciated! <html> <h2> English to Spanish Translator </h2> <head> <script type = "text/javascript"> PHRASES = [["hello", "hola"], ["hi, hola"], ["how are you", "como estas"], ["sorry", "lo siento"], ["thank you", "gracias"], ["please", "por favor"], ["how are you doing today"], ["como estas hoy"], ["I love you", "te amo"], ["hey, eh"], ["welcome", "bienvenido"], ["my name is", "mi nombre es"], [ "good morning", "buenos dias"], ["goodbye","adios"], ["i don't know", "no se"], ["help", "ayudame"], ["happy birthday", "feliz cumpleanos"]] function capitalize (str) { return str.charAt(0).toUpperCase() + str.substring(1); } function translate (text) { for (var i = 0; i < PHRASES.length; i++) { var toReplace = new RegExp("\\b" + PHRASES[i][0] + "\\b", "i"); var index = text.search(toReplace); while (index != -1) { if (text.charAt(index) >= "A" && text.charAt(index) <= "Z") { text = text.replace(toReplace, capitalize(PHRASES[i][1])); } else { text = text.replace(toReplace),PHRASES[i][1]); } index = text.search(toReplace); } } return text; } </script> </head> <body> <form name = "ButtonForm"> <p> Enter a word or phrase </p> <input type = "text" name = "input" value = "" /> <br></br> <input type = "button" value = "Translate" onClick = "translate();" /> <br> </br> </form> </body> </html> Reply With Quote 02-03-2015, 10:12 PM #2 jmrker View Profile View Forum Posts Senior Coder Join Date Aug 2006 Location FL Posts 3,175 Thanks 39 Thanked 510 Times in 504 Posts I have not tested your entire array of words, but this should get you started. NOTES: 1. You did not pass a word to 'translate()' for it to check 2. You did not have a place to store the returned value of the translation 3. You should not use reserved words as variables (ie, text as a function parameter) Code: <html> <h2> English to Spanish Translator </h2> <head> <script type = "text/javascript"> PHRASES = [ ["hello", "hola"], ["hi, hola"], ["how are you", "como estas"], ["sorry", "lo siento"], ["thank you", "gracias"], ["please", "por favor"], ["how are you doing today"], ["como estas hoy"], ["I love you", "te amo"], ["hey, eh"], ["welcome", "bienvenido"], ["my name is", "mi nombre es"], ["good morning", "buenos dias"], ["goodbye","adios"], ["i don't know", "no se"], ["help", "ayudame"], ["happy birthday", "feliz cumpleanos"] ]; function capitalize (str) { return str.charAt(0).toUpperCase() + str.substring(1); } function translate (txt) { for (var i=0; i<PHRASES.length; i++) { var toReplace = new RegExp("\\b" + PHRASES[i][0] + "\\b", "i"); var index = txt.search(toReplace); while (index != -1) { if (txt.charAt(index) >= "A" && txt.charAt(index) <= "Z") { txt = txt.replace(toReplace, capitalize(PHRASES[i][1])); } else { txt = txt.replace(toReplace,PHRASES[i][1]); } index = txt.search(toReplace); } } return txt; } </script> </head> <body> <form name="ButtonForm" action="" method="post" onsubmit="return false"> <p> Enter a word or phrase </p> <input type="text" name="inText" id="inText" value="" /> <p> <input type="button" value="Translate" onClick = "document.getElementById('outText').value = translate(document.getElementById('inText').value)" /> <p> <input type="text" name="outText" id="outText" value="" /> </form> </body> </html> BTW, you should enclose your script between [ code] and [ /code] tags (without the spaces) to retain formatting and make it easier for forum members to read, test, debug, etc. Good Luck! Hi, I'm currently trying to get javascript to work with internet explorer. I managed to get one part of the translation file to work. It's a javascript to change some of the words on Facebook from English to Secwepemc (native american language). The original file works in Firefox and Chrome but not in safari. I knew it was because internet explorer has its own parameters. A file works completely for FF and chrome but not for IE. So, I changed the language a bit so that IE can understand it. Now I have one part of the translation working but not the others. I am wondering if it would be better to use ID's, names, and class all together to get the english words I want to change. I am using grease monkey for IE to use this script. I know firefox and chrome are much better but the plan is for everyone to use and some people still use IE. I know that if I have part of the words translating, then it must be the wrong identifiers. If someone can either help me find the right identifiers or if I missed changing syntax from FF and Chrome to IE, that would be amazing! Here is the javascript file. Code: var es = new Array(); es["Home"] = "Tsitcw"; es["News Feed"] = "Lexeyem"; es["Friends"] = "Kweselkten"; es["Like"] = "Xwexwisten"; es[" likes this."] = " r xwexwistes."; es["Today"] = "Pyin Te Sitqt"; es["Say hello."] = "Say weytk."; es["Say hi."] = "Say weytk."; es["Tomorrow"] = "Pexweyt"; es["What are you planning?"] = "Me7 Stemi ke7 tsuwet?"; es["Where?"] = "T'he7en"; es["Who's invited?"] = "Sweti7?"; es["What's on your mind?"] = "Stemi ke7 peti'nesme?"; function loadSecwepemc() { var fbelem = document.getElementsByTagName('a'); for (var i = 0; i < fbelem.length; i++) { var thisElem = fbelem[i]; if (thisElem.innerText in es) { thisElem.innerText = es[thisElem.innerText]; } } var fbelem = document.getElementsByTagName('span'); for (var i = 0; i < fbelem.length; i++) { var thisElem = fbelem[i]; if (thisElem.innerText in es) { thisElem.innerText = es[thisElem.innerText]; } } var fbelem = document.getElementsByClassName('ego_social_context'); for (var i = 0; i < fbelem.length; i++) { var thisElem = fbelem[i]; if (thisElem.innerText in es) { thisElem.innerText = es[thisElem.innerText]; } } var fbelem = document.getElementsByTagName('input'); for (var i = 0; i < fbelem.length; i++) { var thisElem = fbelem[i]; if (thisElem.getAttribute('placeholder') in es) { thisElem.setAttribute('placeholder',es[thisElem.getAttribute('placeholder')]); } if (thisElem.getAttribute('value') in es) { thisElem.setAttribute('value',es[thisElem.getAttribute('value')]); } } var fbelem = document.getElementsByTagName('textarea'); for (var i = 0; i < fbelem.length; i++) { var thisElem = fbelem[i]; if (thisElem.getAttribute('placeholder') in es) { thisElem.setAttribute('placeholder',es[thisElem.getAttribute('placeholder')]); } if (thisElem.getAttribute('title') in es) { thisElem.setAttribute('title',es[thisElem.getAttribute('title')]); } if (thisElem.innerText in es) { thisElem.innerText = es[thisElem.innerText]; } } var fbelem = document.getElementsByTagName('h3'); for (var i = 0; i < fbelem.length; i++) { var thisElem = fbelem[i]; if (thisElem.innerText in es) { thisElem.innerText = es[thisElem.innerText]; thisElem.attachEvent( "onClick", loadSecwepemc()); // capture phase } } var fbelem = document.getElementsByTagName('h2'); for (var i = 0; i < fbelem.length; i++) { var thisElem = fbelem[i]; if (thisElem.innerText in es) { icon = thisElem.childNodes[0] thisElem.innerText = es[thisElem.innerText]; thisElem.appendChild(icon) } } } loadSecwepemc(); function changedNode(e) { var fbelem = e.target.getElementsByTagName('a'); for (var i = 0; i < fbelem.length; i++) { var thisElem = fbelem[i]; if (thisElem.innerText in es) { thisElem.innerText = es[thisElem.innerText]; } } var fbelem = e.target.getElementsByTagName('span'); for (var i = 0; i < fbelem.length; i++) { var thisElem = fbelem[i]; if (thisElem.innerText in es) { thisElem.innerText = es[thisElem.innerText]; thisElem.attachEvent( "onLoad", loadSecwepemc()); // capture phase } } var fbelem = e.target.getElementsByClassName('ego_social_context'); for (var i = 0; i < fbelem.length; i++) { var thisElem = fbelem[i]; if (thisElem.innerText in es) { thisElem.innerText = es[thisElem.innerText]; } } var fbelem = e.target.getElementsByTagName('input'); for (var i = 0; i < fbelem.length; i++) { var thisElem = fbelem[i]; if (thisElem.getAttribute('placeholder') in es) { thisElem.setAttribute('placeholder',es[thisElem.getAttribute('placeholder')]); } if (thisElem.getAttribute('value') in es) { thisElem.setAttribute('value',es[thisElem.getAttribute('value')]); } } var fbelem = document.getElementsByTagName('textarea'); for (var i = 0; i < fbelem.length; i++) { var thisElem = fbelem[i]; if (thisElem.getAttribute('placeholder') in es) { thisElem.setAttribute('placeholder',es[thisElem.getAttribute('placeholder')]); } if (thisElem.getAttribute('title') in es) { thisElem.setAttribute('title',es[thisElem.getAttribute('title')]); } if (thisElem.innerText in es) { thisElem.innerText = es[thisElem.innerText]; } } var fbelem = e.target.getElementsByTagName('h3'); for (var i = 0; i < fbelem.length; i++) { var thisElem = fbelem[i]; if (thisElem.innerText in es) { thisElem.innerText = es[thisElem.innerText]; thisElem.attachEvent( "onClick", loadSecwepemc()); // capture phase } } var fbelem = e.target.getElementsByTagName('h2'); for (var i = 0; i < fbelem.length; i++) { var thisElem = fbelem[i]; if (thisElem.innerText in es) { icon = thisElem.childNodes[0] thisElem.innerText = es[thisElem.innerText]; thisElem.appendChild(icon) } } } document.attachEvent('onNodeInserted', changedNode()); Hello everyone! I've searched a lot of places for a script like this and found nothing. Here's my situation. My site uses a main iframe that changes as you click links. However, Google links to all my pages, I only want it to access a few (because some pages are only meant to be viewed via iframe). I'm looking for a JavaScript that will detect if the page is being viewed in an iframe, if it is, it should take no action, but if it's no, it should redirect to a different page. Is this possible??? i want to add a not-filled circle at the center of the map and fix it there even user drag and move the map. I tried to add a absolute position div that contain the circle image on the map but obviously it cant do any interaction with the map when clicingk or dragging inside area of the circle because it is just a div but not a part or overlay of the map. then i tried to add a custom overlay on the map, and set the div appended in panes with fixed left and top value, but it seems not work .... so guys, any suggestion? Hi All, I'm new to JS, and I'm trying to make google books previewed on my website. It works fine but if the book(ISBN) is not available for previewing, which only gives me nothing on the page What I need is it give me a alert, or some echos,which tells something like "this book is not available for Previewing" when the ISBN is not found. Here is my code used on a php, and also a JS with the link. http://www.google.com/jsapi Quote: <script type="text/javascript" src="js/jsapi.js"></script> <script type="text/javascript"> google.load("books", "0", {"language" : "es-ES"}); function initialize() { var viewer = new google.books.DefaultViewer(document.getElementById('viewerCanvas')); viewer.load('ISBN:<?php echo $ISBN; ?>'); } google.setOnLoadCallback(initialize); </script> </head> <body> <div id="viewerCanvas" style="width: 600px; height: 700px"></div> </body> I am not familiar with the Google Maps API, but reading through several tutorials and their documentation I have been able to create a basic version of what I need. It is simply a list of places to the right of the map, which can be clicked and will center the map on that location. However, I seem to be unable to use geocoding so that I can use addresses instead of latitude and longitudes. Here's what I have so far: http://www.mpapo.org/testzone/gmaps.html That is the functionality that I need, but I need to be able to use addresses instead of coordinates. I found this script from a tutorial: 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"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>Google Maps JavaScript API Example</title> <script src="http://maps.google.com/maps?file=api&v=2&key=ADD_YOUR_KEY_HERE" type="text/javascript"></script> <script type="text/javascript"> //<![CDATA[ var geocoder; var map; var restaurant = "The Old Mohawk Restaurant"; var address = "821 Mohawk Street, Columbus OH"; // On page load, call this function function load() { // Create new map object map = new GMap2(document.getElementById("map")); // Create new geocoding object geocoder = new GClientGeocoder(); // Retrieve location information, pass it to addToMap() geocoder.getLocations(address, addToMap); } // This function adds the point to the map function addToMap(response) { // Retrieve the object place = response.Placemark[0]; // Retrieve the latitude and longitude point = new GLatLng(place.Point.coordinates[1], place.Point.coordinates[0]); // Center the map on this point map.setCenter(point, 13); // Create a marker marker = new GMarker(point); // Add the marker to map map.addOverlay(marker); // Add address information to marker marker.openInfoWindowHtml(place.address); } //]]> </script> </head> <body onload="load()" onunload="GUnload()"> <div id="map" style="width: 400px; height: 300px"></div> </body> </html> And it works, but how would I integrate it with the other script? I have tried several times/ways but it always crashes. Any ideas? Hi folks, My website is located he http://maps.peachtree-city.org My search functions point to a mysql database and has been working since June 2008. All of sudden, and I credit my boss to this, it has become dysfunctional with a reoccuring error noted by Firefox: Syntax Error: 0Query was empty. I have a php within the server which pulls from my map file to call upon mysql: From the map.html Code: function submitAddress() { var address = document.getElementById('address').value; var searchUrl = 'http://maps.peachtree-city.org/google/parcelpin_genxml2.php?address=' + address; GDownloadUrl(searchUrl, function(data) { var xml = GXml.parse(data); var markers = xml.getElementsByTagName('marker'); if (markers.length == 0) { alert('Sorry, no Address matches found. Remember to check your spelling and format.'); return; } var address1 = markers[0].getAttribute('address') var point = new GLatLng(parseFloat(markers[0].getAttribute('lat')), parseFloat(markers[0].getAttribute('lng'))); if (point && ge != null) { var la = ge.createLookAt(''); la.set(point.y, point.x, 100, ge.ALTITUDE_RELATIVE_TO_GROUND, 0, 0, 500); placemark.setName(address); var point1 = ge.createPoint(address1); point1.setLatitude(point.y); point1.setLongitude(point.x); placemark.setGeometry(point1); ge.getView().setAbstractView(la); } }); } The form from map.html Code: <center><p style="font-family:arial narrow" "color=green" size="1">Search <strong>Address</strong> Example: 1232 S Hwy 74</font></p></center> <form name='searchform2' id='searchform2' action="javascript:void(0);"> <input type=text size=21 id='address' ></input> <input type=submit button style="background-color:orange" value='Search Address' onClick='javascript:submitAddress();'> <input type=reset button style="background-color:orange" value='Clear Form'> </form> <br> The searchURL (parcelpin_genxml2.php) Code: <?php require ("phpsql_dbinfo.php"); function parseToXML($htmlStr) { $xmlStr=str_replace('<','<',$htmlStr); $xmlStr=str_replace('>','>',$xmlStr); $xmlStr=str_replace('"','"',$xmlStr); $xmlStr=str_replace("'",''',$xmlStr); $xmlStr=str_replace("&",'&',$xmlStr); return $xmlStr; } // Opens a connection to a mySQL server $connection=mysql_connect (localhost, $user, $password); if (!$connection) { die('Not connected : ' . mysql_error()); } // Set the active mySQL database $db_selected = mysql_select_db('geocode', $connection); if (!$db_selected) { die ('Can\'t use db : ' . mysql_error()); } // Select all the rows in the markers table $query = ""; if ($address != null) { $tok = strtok($address, " "); $count = 0; $query = "SELECT * FROM address WHERE "; while ($tok !== false) { if ($count > 0) { $query = $query." and "; } $query = $query." address like '%$tok%'"; $tok = strtok(" "); $count = $count + 1; } } else if ($parcelpin != null) { $query = "SELECT * FROM parcel WHERE parcelpin='$parcelpin'"; } $result = mysql_query($query); if (!$result) { die("Invalid query " + $query . mysql_error()); } header("Content-type: text/xml"); // Start XML file, echo parent node echo '<markers>'; // Iterate through the rows, printing XML nodes for each while ($row = @mysql_fetch_assoc($result)){ // ADD TO XML DOCUMENT NODE echo '<marker '; if ($address != null) { echo 'address="' . $row['address'] . '" '; } else if ($parcelpin != null) { echo 'parcelpin="' . $row['parcelpin'] . '" '; } echo 'lat="' . $row['lat'] . '" '; echo 'lng="' . $row['lng'] . '" '; echo '/>'; } // End XML file echo '</markers>'; mysql_close(); ?> I am at a complete lost why the error. Boss says he didn't touch anything but I noticed he did add another table to mysql which led me finding out he also tried installing a CMS , SugarCMS. Upon research on this, I found some mentions of SugarCMS contributing to errors on other mysql databases. I need to display a receipt, open the print dialog and then go back to another form. My code is as follows at the bottom of the page: Code: <script type='text/javascript'> window.print(); window.location="newlocation"; </script> It works prefect in firefox, but not in chrome. In Chrome it just redirects and never waits for the print dialog. I need it to wait until the user can click print or cancel. If I take out the window.location line it brings up the print dialog (but I want it to redirect afterwards). Thanks to anyone who can help! Code: <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> <script type="text/javascript"> var geocoder; var loc; geocoder = new google.maps.Geocoder(); var input = "32.83036,34.974339" var latlngStr = input.split(",",2); var lat = parseFloat(latlngStr[0]); var lng = parseFloat(latlngStr[1]); var latlng = new google.maps.LatLng(lat, lng); geocoder.geocode({'latLng': latlng}, function(results, status) { loc = results[1].formatted_address; }); </script> I need to use that var ("loc") in another place in my code, after the function finished running. Hi, i have 1 site with three different brands (three ID numbers). I have made a javascript if-statement but it doesnt work. Somebody see some wrong here, I think it should work properly. Thanks in advance $language and $brand is set... <script type="text/javascript"> var accountId; var url; if($language == 'test') { if($brand = '1') { accountId = 'UA-xxxxx-1' url = '1.com' } else if ($brand = '2') { accountId = 'UA-xxxxx-2' url = '2.com' } else if ($brand = '3') { accountId = 'UA-xxxxx-3' url = '3.com' } var _gaq = _gaq || []; _gaq.push(['_setAccount', accountId]); _gaq.push(['_setDomainName', url]); _gaq.push(['_setAllowLinker', true]); _gaq.push(['_trackPageview', '/' + window.location.host + '/' + window.location.pathname]); (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, Not sure where to post this. I currently have a web app which utilises Google Maps & Directions, however some of these maps and directions will be used in pdf creation with tcpdf. The problem arises with the fact that tcpdf doesn't read javascript and therefore cant show the map. Any ideas on what I can do to compensate? Hello, I had this working in v2, but I'm migrating to v3 and I'm having some trouble with my sidebar. I think it might be variable scope problem, but I can't find the answer. I have a form which appends entries to an xml file, and my map script imports the xml to create markers and infowindows (all working). Functions to close the infowindow and recenter the map all work as well. It should also display a clickable sidebar with the names of the markers as links. It displays a side bar, but I only get one line which says 'undefined'. Here is my code: Code: var infowindow = new google.maps.InfoWindow(); var map = new google.maps.Map(); var side_bar_html = ""; var gmarkers = []; var shortname; var marker; function initialize() { var xmlhttp; if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.open("GET","rp4.xml",false); xmlhttp.send(); xmlDoc = xmlhttp.responseXML; var markers = xmlDoc.getElementsByTagName("marker"); var point = new google.maps.LatLng(40.8068620, -96.6816790); var myOptions = { /* center: new google.maps.LatLng(40.8068620, -96.6816790), */ center: point, zoom: 4, mapTypeId: google.maps.MapTypeId.ROADMAP, /* mapTypeControl: True, mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU} */ }; // create the map map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); function bindInfoWindow(marker, map, infowindow, nfo) { google.maps.event.addListener(marker, 'click', function() { infowindow.close(); infowindow.setContent(nfo); infowindow.open(map, marker); map.panTo(marker.getPosition()); // map.setCenter(new google.maps.LatLng(lat,lng); map.setCenter(marker.getPosition()); }); } // document.getElementById("side_bar").innerHTML = side_bar_html; for (var i = 0;i<markers.length;i++) { var lat = parseFloat(markers[i].getAttribute("lat")); var lng = parseFloat(markers[i].getAttribute("lng")); point = new google.maps.LatLng(lat,lng); shortname = markers[i].getAttribute("company"); var company = markers[i].getElementsByTagName("company")[0].firstChild.nodeValue; var contact = markers[i].getElementsByTagName("contact")[0].firstChild.nodeValue; var str = markers[i].getElementsByTagName("str")[0].firstChild.nodeValue; var city = markers[i].getElementsByTagName("city")[0].firstChild.nodeValue; var phone = markers[i].getElementsByTagName("phone")[0].firstChild.nodeValue; var email = markers[i].getElementsByTagName("email")[0].firstChild.nodeValue; var web = markers[i].getElementsByTagName("web")[0].firstChild.nodeValue; var nfo = "<h1>"+company+"</h1>"+ "<p><b>"+company+"</b><br />"+ contact+"<br />"+ str+"<br />"+ city+"<br />"+ phone+"<br />"+ "<a href='mailto:"+email+"'>"+email+"</a></p>"+ "<a href='http://"+web+"'>"+web+"</a>"; marker = new google.maps.Marker({ position: point, map: map, title: company, clickable: true, }); marker.setMap(map); bindInfoWindow(marker, map, infowindow, nfo); } document.getElementById("side_bar").innerHTML = side_bar_html; } function myclick(k) { google.maps.event.trigger(gmarkers[k], "click"); // save the info we need to use later for the side_bar gmarkers.push(marker); // add a line to the side_bar html side_bar_html += '<a href="javascript:myclick(' + (gmarkers.length-1) + ')">' + shortname + '<\/a><br>'; return marker; } I am trying to place a different google map in each tabbed of a spry tabbed panel. There is a known issue with google map V3 where the map will function properly on the default tab, but when the hidden tabs are unhidden, the map on those previously hidden tabs has centred in the very top left of the container div and only fills a small part of the container. ( www.kimholt.co.uk/locations demonstrates this, the London tab is fine, but the South West tab doesn't work properly). I have spent hours on this bug so far, and tried many fixes. The only one that has got me anywhere so far is adding [CODE] google.maps.event.addListener(map, "idle", function() {google.maps.event.trigger(map, 'resize'); }); after var map = new google.maps.Map(document.getElementById(canvas), myOptions); [CODE] This doesn't resize the map automatically, but will resize it if the map is dragged slightly by the user. It also still has the marker centred in the top left of the screen rather than the centre of the canvas. The following solutions have also been suggested: Re-centrering the map around the marker [CODE] google.maps.event.trigger({map}, 'resize'); {map}.setCenter({marker}.getPosition()); [CODE] Zooming in and out again to trigger the resize: [CODE] map.setZoom( map.getZoom() ); [CODE] Or using this to do the same thing: [CODE] this.map.setZoom( this.map.getZoom() - 1); this.map.setZoom( this.map.getZoom() + 1); [CODE] Suggested for use if there are multiple markers: [CODE] map.setZoom(map.getZoom()); map.fitBounds(bounds); [CODE] I haven't been able to get any of these to work, but I'm not sure if I am using them in the right place in the javascript, and I'm also not sure if there are any parts of this code that need amending to make them work in my particular code. How can I get the map to automatically resize when the tab is selected? How can I get the map to automatically recentre around the marker when the map is opened? Being fairly new to this I really need someone to look at my actual code and help me work out exactly what to put where, in other words assume I know nothing and will be extremely grateful for any help! |