JavaScript - Geolocation Query In Javascript
Hi There,
I'm working on an application that potentially gets 1000s of geolocation queries per day and if I don this (as I've done it till now) in php, it works fine but I quickly run into OVER_QUERY_LIMIT error from the google map apis. Thus I think I'd better do it in javascript and just send the coordinates to the server for caching rather than querying from the server's IP. Now the url that sends back the location information looks like this: http://www.google.com/url?sa=D&q=htt...s3czv6-nMr_nbw and I was wondering how I can send a request to this url and parse the xml string that's returned with JavaScript to pass it on to a php (probably by get variables). Is there a handy method that's compatible accross a bunch of browsers incl. mobile ones? Thanks very much for some input! Ron Similar TutorialsHi, I am creating a mobile web application for a zoo which involves a map and user being able to find your location within the zoo. I have a working prototype which works my finding your Longitude and Latitude and based on where your standing the map will move to your location. Here is the code: Code: function getLocation() { // Get location no more than 10 minutes old. 600000 ms = 10 minutes. navigator.geolocation.getCurrentPosition(showLocation, showError, {enableHighAccuracy:true,maximumAge:600000}); if (position.coords.latitude == 37.331689 && position.coords.longitude == -122.030731) camera.className = 'part-penguin', document.getElementById("penguinholder") .src="graphics/penguin-here.png", document.getElementById("link") .href="penguins.html", alert('You are standing nearby the penguins!'); } else alert('You appear to be out of the Zoo grounds! Please return to the area and try again.'); } Currently the user has to be standing at a specific point in order for it to work as it only takes 1 Latitude coordinate and 1 Longitudinal reference point. What I would like it to do would be to check between 2 Latitude points and 2 longitude points (i.e. a square area) and as long as the user is standing between these points it will do what i want. Please help.. Thanks.. Hi. i,m trying to make a map who show me as position A and a target adress as point B.I have made it so i can choose adress a and adress b from a dropdown but i want to automaticly load my position as possition A then choose position B from a dropdownlist. How can i do this ? Thanks Natrox <!DOCTYPE html> <html> <head> <title>Google Maps JavaScript API v3 Example: Map Geolocation</title> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> <meta charset="UTF-8"> <link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" /> <!-- Include the maps javascript with sensor=true because this code is using a sensor (a GPS locator) to determine the user's location. See: http://code.google.com/apis/maps/doc...ecifyingSensor --> <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=true&language=nb_NO"></script> <!--<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=true&language=nb_NO"> --> <script type="text/javascript"> var map; var directionDisplay; var directionsService; var stepDisplay; var markerArray = []; var initialLocation; //var oslo = new google.maps.LatLng(59.947639, 10.884469); var browserSupportFlag = new Boolean(); function initialize() { directionsService = new google.maps.DirectionsService(); // Create a map and center it on Manhattan. var oslo = new google.maps.LatLng(59.947639, 10.884469); var myOptions = { zoom: 13, mapTypeId: google.maps.MapTypeId.ROADMAP, center: oslo } map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); // Create a renderer for directions and bind it to the map. var rendererOptions = { map: map } directionsDisplay = new google.maps.DirectionsRenderer(rendererOptions) // Instantiate an info window to hold step text. stepDisplay = new google.maps.InfoWindow(); } function calcRoute() { // First, remove any existing markers from the map. for (i = 0; i < markerArray.length; i++) { markerArray[i].setMap(null); } // Now, clear the array itself. markerArray = []; // Retrieve the start and end locations and create // a DirectionsRequest using DRIVING directions. var start = document.getElementById("sart").value; var end = document.getElementById("end").value; var request = { origin: start, destination: end, travelMode: google.maps.DirectionsTravelMode.DRIVING }; // Route the directions and pass the response to a // function to create markers for each step. directionsService.route(request, function(response, status) { if (status == google.maps.DirectionsStatus.OK) { var warnings = document.getElementById("warnings_panel"); warnings.innerHTML = "<b>" + response.routes[0].warnings + "</b>"; directionsDisplay.setDirections(response); showSteps(response); } }); } function showSteps(directionResult) { // For each step, place a marker, and add the text to the marker's // info window. Also attach the marker to an array so we // can keep track of it and remove it when calculating new // routes. var myRoute = directionResult.routes[0].legs[0]; for (var i = 0; i < myRoute.steps.length; i++) { var marker = new google.maps.Marker({ position: myRoute.steps[i].start_point, map: map }); attachInstructionText(marker, myRoute.steps[i].instructions); markerArray[i] = marker; } } function attachInstructionText(marker, text) { google.maps.event.addListener(marker, 'click', function() { // Open an info window when the marker is clicked on, // containing the text of the step. stepDisplay.setContent(text); stepDisplay.open(map, marker); }); } // Try HTML5 geolocation if(navigator.geolocation) { navigator.geolocation.getCurrentPosition(function(position) { var pos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); var infowindow = new google.maps.InfoWindow({ map: map, position: pos, content: 'Du er her.' }); map.setCenter(pos); }, function() { handleNoGeolocation(true); }); } else { // Browser doesn't support Geolocation handleNoGeolocation(false); } function handleNoGeolocation(errorFlag) { if (errorFlag) { var content = 'Error: The Geolocation service failed.'; } else { var content = 'Error: Your browser doesn\'t support geolocation.'; } var options = { map: map, position: new google.maps.LatLng(60, 105), content: content }; var infowindow = new google.maps.InfoWindow(options); map.setCenter(options.position); } function detectBrowser() { var useragent = navigator.userAgent; var mapdiv = document.getElementById("map_canvas"); if (useragent.indexOf('iPhone') != -1 || useragent.indexOf('Android') != -1 ) { mapdiv.style.width = '100%'; mapdiv.style.height = '100%'; } else { mapdiv.style.width = '600px'; mapdiv.style.height = '800px'; } } google.maps.event.addDomListener(window, 'load', initialize); </script> </head> <body onload="initialize()"> <div style="text-align:center"> <select id="start"> <option value="625 8th Avenue, New York, NY, 10018">Port Authority Bus Terminal</option> <option value="staten island ferry terminal, new york, ny">Staten Island Ferry Terminal</option> <option value="101 E 125th Street, New York, NY">Harlem - 125th St Station</option> </select> <select id="end" onchange="calcRoute();"> <option value="Brubakkveien 14 1083 Oslo">Sigvartsen proffavdeling</option> <option value="Sonja Henies plass 3, 0185 Oslo">Oslo plaza</option> <option value="moma, New York, NY">MOMA</option> <option value="350 5th Ave, New York, NY, 10118">Empire State Building</option> <option value="253 West 125th Street, New York, NY">Apollo Theater</option> <option value="1 Wall St, New York, NY">Wall St</option> </select> </div> <div id="map_canvas"></div> <div id="pos"></div> <div id="warnings_panel"></div> </body> </html> Hey all, I'm playing with a greasemonkey script and would like to provide geo-locating. The geolocation services I've found all require dev/api-key. A dev-key means I reveal my well-earned key, or an api-key usually means a server address... there would be none via a greasemonkey script. Any ideas for gathering geolocation services? Any links, tips, ideas welcome! Hi I am trying to get javascript to update a database for me. The reason is I need to use JS and not ASP is because I need to update whenever a user clicks on a button and from what I am told ASP can not do this. I tried following an example, and this is what I came up with. However I get the errors Error: Object expected and Excptected Hexadecimal Digit. Here is the code Code: <script language=javascript> function update() { var adoConn = new ActiveXObject("ADODB.Connection"); var adoRS = new ActiveXObject("ADODB.Recordset"); adoConn.Open("Provider=Microsoft.Jet.OLEDB.4.0;Data Source='\\data\user.mdb'"); adoRS.Open("Select * From ptotbl Where ID = 454"); adoRS.Edit; adoRS.Fields("Delete").value = "True"; adoRS.Update; adoRS.Close(); adoConn.Close(); } Thanks Hello I'm trying to create a graph that will accept 1 or multiple data sets depending on what the user selects. How can I add get the data into the graph using a loop? I want it to add a line for each selection. Thanks // Graph Data ############################################## var graphData = [{ // Visits data : <?php echo '['.implode($data).'],'?> color: '#71c73e' }, { // Visits data : <?php echo '['.implode($data_1).'],'?> color: '#red' }, ]; Hi I am trying to create a query string similar to the one available he http://andrewu.co.uk/tools/request/e.../example1.html The problem that I am having is that I have more than one button on my page and even though my id's are unique all of my data is displaying on the action page at the same time. The code that i am using for my buttons is: Code: <label for="name_1">Name:</label> <input type="text" name="name1" id="name_1" tabindex="1" size="40" value="Donald Duck" /> <br /> <br /> <input type="submit" id='view1' value="Submit" tabindex="2" /> <label for="name_1">Name:</label> <input type="text" name="name2" id="name_2" tabindex="1" size="40" value="Mickey Mouse" /> <br /> <br /> <input type="submit" id='view2' value="View" tabindex="2" /> I have a lot more than 2 buttons on my page. when a button is clicked I would like to be able to get the values from the query string and only see the values for the button that was clicked like this one: http://andrewu.co.uk/tools/request/e...ndrew+Urquhart but instead I am getting Name: Donald Duck, Name: Mickey Mouse. What would I have to add or change to obtain just one Name to display at a time but have it be different depending on which button is pressed? Hi guys, been running into some problems with all IE browsers and my jQuery Gallery from Galleryview. Background: I am using Java to do an image search and build up some HTML including the calls to run the galleryview scripts and return this back to the page using document.write() When I use the simple structure of placing the scripts and parameters into a sample page: Code: Code: <body> <script type="text/javascript" src="http://spaceforaname.com/js/jquery-1.3.2.min.js"></script> <script type="text/javascript" src="http://spaceforaname.com/js/jquery.easing.1.3.js"></script> <script type="text/javascript" src="http://spaceforaname.com/js/jquery-galleryview-1.1/jquery.galleryview-1.1.js"></script> <script type="text/javascript" src="http://spaceforaname.com/js/jquery-galleryview-1.1/jquery.timers-1.1.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('#photos').galleryView({ panel_width: 800, panel_height: 300, frame_width: 100, frame_height: 100 }); }); </script> It works fine. When I try and pull all the scripts out of the page and inject them back in using document.write() I get an error on IE: Code: Code: sb.append("(function(){ document.write('" + " <script type=\"text/javascript\" src=\"http://spaceforaname.com/js/jquery-1.3.2.min.js\"></script> " + " <script type=\"text/javascript\" src=\"http://spaceforaname.com/js/jquery.easing.1.3.js\"></script> " + " <script type=\"text/javascript\" src=\"http://spaceforaname.com/js/jquery-galleryview-1.1/jquery.galleryview-1.1.js\"></script> " + " <script type=\"text/javascript\" src=\"http://spaceforaname.com/js/jquery-galleryview-1.1/jquery.timers-1.1.2.js\"></script> " + " <script type=\"text/javascript\"> " + " $(document).ready(function(){ " + " $(\"#photos\").galleryView({ " + " panel_width: 800, " + " panel_height: 300, " + " frame_width: 100, " + " frame_height: 100 " + " }); " + " }); " + " </script> " +............+ "')})()"); The variable sb is a StringBuffer and is formatted and returned: Code: Code: nextPage.setValue(sb.toString()); nextPage.setEscapeHTML(false); return nextPage; This particular error in this case in IE(8) is: Object expected which I think is referring to the jQuery as the resulting images are displayed just not in Galleryview style. This is really wracking my brains and any and all help is appreciated. D. I have noooo idea if I am even posting this in the correct area, let alone the correct site. If not I apologize and maybe someone could direct me elsewhere. I am trying to add a custom search into my site. http://www.jeffknowsloans.com you can see it about the middle of the page. I am using the following script to do so. Code: <script type="text/javascript"> function dosearch() { var sf=document.searchform; var submitto = sf.sengines.options[sf.sengines.selectedIndex].value + escape(sf.searchterms.value); window.location.href = submitto; return false; } </script> <form name="searchform" onSubmit="return dosearch();"> Select County <select name="sengines"> <option value="http://www2.co.washington.mn.us/opip/mod/addresssrch/result.asp?housenum=&street=" selected>Washington</option> <option value="http://rrinfo.co.ramsey.mn.us/public/characteristic/PropertySearchResults.aspx?pin=&Nbr=&Street=&pg=1" selected>Ramsey</option> <option value="http://www.altavista.com/web/results?q=">Alta Vista</option> <option value="http://www.dogpile.com/info.dogpl/search/web/">Dogpile</option> </select> Street Address: <input type="text" name="searchterms"> <input type="submit" name="SearchSubmit" value="Search"> </form> here is the problem i am running into. I dont know how to ignore or add certain parts of the search when it sends. for example. take a look at Code: <option value="http://rrinfo.co.ramsey.mn.us/public/characteristic/PropertySearchResults.aspx?pin=&Nbr=&Street=&pg=1" selected>Ramsey</option> When i try to do a search under this drop down selection it doesnt work. because it needs the &pg=1 to be added to the users search request. Meaning if I set it to Code: http://rrinfo.co.ramsey.mn.us/public/characteristic/PropertySearchResults.aspx?pin=&Nbr=&Street= they type in their street name and the street name inputs into the search query but it wont fully work because it doesnt add the &pg=1 after it all. how in the world do I get it to add things like that? ie how do i tell it to add certain strings that the outside source requires? like blank=&blank= or how do i get it to ignore certain &blank= commands. another example taking a look at Code: <option value="http://www2.co.washington.mn.us/opip/mod/addresssrch/result.asp?housenum=&street=" selected>Washington</option> this search function should technically be Code: <option value="http://www2.co.washington.mn.us/opip/mod/addresssrch/result.asp?" selected>Washington</option> however since i dont know how to add certain functions to the search i have to skip the housenum option. that means my customers cant search by street number. I want them to be able to type in their house number and their street address and it will change to what each seperate (outside) search engine needs. Does this make any sense at all? I have an array from a sql query that I need to use as variables in a javascript function. I have created the array, used JSON_ENCODE to bring the information into javascript, and so far everything works correctly. I am trying to use a list menu in html to select one on the indexes of the array so I can pass the information from the index to a javascript function. Here is the javascript function: Code: function selectTable(item_id) { var media = eval(<? echo json_encode($paperTable); ?>); var click_k_1=media[item_id]["click_k_1"]; var click_k_501=media[item_id]["click_k_501"]; var click_c_1=media[item_id]["click_c_1"]; var click_c_51=media[item_id["click_c_51"]; var click_c_101=media[item_id]["click_c_101"]; } Here is the list menu coding: Code: <select name="pprSel" size="1" id="pprSel" onChange="selectTable(this.value);" > <option value="204226">20# Bond</option> <option value="204788">70# White</option> <option value="204823">80# White</option> </select> Here is the source file results from the browser: Quote: function selectTable(item_id) { var media = eval({"1":{"item_id":"204226","item_description":"20# Bond","click_k_1":"0.1100","click_k_501":"0.0730","click_c_1":null,"click_c_51":null,"click_c_101":n ull},"2":{"item_id":"204788","item_description":"70# White","click_k_1":"0.1149","click_k_501":"0.0779","click_c_1":"0.8789","click_c_51":"0.5539","click _c_101":"0.3589"},"3":{"item_id":"204823","item_description":"80# White","click_k_1":"0.1591","click_k_501":"0.1221","click_c_1":"0.9231","click_c_51":"0.5981","click _c_101":"0.4031"}}); } I have tried a couple of different ways to pass one of the variables to a text field on the html form as an error check, with no success: Code: document.quote.data.value=media[item_id]["click_k_1"]; document.quote.data.value=click_k_1; The text field on the html form is id='data', the form is id='quote'. the only thing I can think of for the reason I am not getting anything in my text field is that my variable is not getting set up properly. Can anyone help? TIA Hi everyone, i am developing a facebook application and here i am, struggling with this piece of code. I have this php query result he $id = $facebook->api(array('method' => 'fql.query', 'query' => "SELECT uid FROM user WHERE uid IN( SELECT uid FROM page_fan WHERE page_id='411133928921438' AND uid IN ( SELECT uid2 FROM friend WHERE uid1 = me() ))")); And i need to save it as an array like: var user_ids = [x,y,z] etc etc... I have used the json_encode but it isn't working... here is my code.. Code: var user_ids = <?php echo json_encode($id); ?>; How can i retrieve the query results, the id's in an array like i mentioned above? Please help me... long story short, I do work for a church, a charity asked me to fix some errors at their web site...1 problem arose and JavaScript is not my strong suite..they have an newsletter request form, just enter your email and your on their newsletter list, as you can see from the code below there is a problem, no valid email verify routine, if you just enter a space in the form, it will accept the info and send a blank request to the charity where an email addie should be... no clue how to fix, as I said javascript is not something I do at all....any help appreciated. kenrich ======================= <script type="text/javascript"> $(function(){ $("#rform").submit(function(){return false;}); $("#rsubmit").click(function(){ if($("input#s").val() != "" && $("input#s").val() != 'Enter Email Address'){ $.get("/rsignup.php?email="+$("input#s").val(), function(data){ $("#rdiv").html(data).css("margin-top","15px"); }); } else { alert('Please enter your email address to subscribe'); } }); }); </script> <!-- BEGIN Form --> <div style="text-align: left;margin: 20px 0 -10px 10px;font-weight:bold;">Email Newsletter:</div> <div id="newsletterdiv" style="height:25px;"> <form name="optin" action="#" onsubmit="return false;" method="post" style="margin-bottom:2;" id="newsletterform"> <input type="hidden" name="vff" value="103"> <input type="hidden" name="vpp" value="i"> <div> <input value="Enter Email Address" onfocus="if (this.value == 'Enter Email Address') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Enter Email Address';}" name="ea" id="s" type="text"> <input id="newslettersubmit" value=" " type="submit" name="go"> </div> </form> </div> <!-- END Form --> HI peers, i need to run a sql query fromjavascript onclick button and display data in a textarea . is this possible ? than you . i am developing a facebook application and i have this code here which queries the user id and other information: Code: $users = $facebook->api(array('method' => 'fql.query', 'query' => "SELECT uid, last_name, pic_big FROM user WHERE uid IN( SELECT uid FROM page_fan WHERE page_id='411133928921438' AND uid IN ( SELECT uid2 FROM friend WHERE uid1 = me() ))")); I need to store the user id in an array so i can send invitation only to the users in the array generated. Code: function newInvite(){ var user_ids = ["1368246891", "1206927311", "1149862205"]; FB.ui({ method: 'apprequests', message: 'There goes the message for Penelope App users to invite their friends', to: user_ids, }); } THe user_ids must be the array which holds the user id genrated from the fql query... Help me with this... The code is JScript .NET, which is basically a .NET version of Javascript. Regardless of language, Anyone with appending type of skill can answer my question. The problem is, when I keep issuing the request it keeps appending over and over again Code: if (oSession.uriContains("search?q=")) { var str = oSession.fullUrl; var sAppend = "+test1+test2+test3"; if (!oSession.uriContains(sAppend)) { oSession.fullUrl = str.replace( "search?q=","search?q="+sAppend); } } Can you please give me an example? I'm still new to programming. Thank you Hi All.....I am new to javascript coding ...I am unable to forward from my jsp to servlet file via javascript below is my code.... [JSP CODE] <html> <body> <form action="Bean" method="get" name="form1"> <ul> <li><a onclick="javascript:view('vprod')" name="vprod">View</a></li> </ul> [Script Code] function view(value) { alert(value); document.form1.action="/Bean"; document.form1.submit(); } Please can one help me in this regard.....Thanks in Advance Ok so Im going to break down what Im trying to do and hopefully someone can point me to a possible solution without getting all technical. I have 2 div tags. the first is a content container more or less. the second is a container for a php built calender (using html tables). Basically when the page loads the php builds the calenders html table code. each td element has an onclick event handler. The goal is to have the javascript handler execute when any non empty cell is clicked (non empty being that it has a date associated with it and is not a blank space filler). This is the easy part. The hard part is that each calendar day potentially has certain information associated with it stored in a mysql database. Im wanting input fields within the first container div to autopopulate with the information from the database (if any) for whatever day is clicked. Ive search around and heard things like javascript cant do mysql queries directly, and heard mention of ajax. So im stumped as to how to accomplish this. whether i need an external php script for the queries (perhaps inside a php function that can return data to the javascript that calls it?), but if that is plausable would it cause page loads or the like to the user? i really dont want to have to learn ajax for this one page, just seems excessive, but i do need a way to make the content in the first div populate with the respective database data for the selected day on the calendar. any thoughts, comments, or solutions that dont involve yet another web language would be greatly appreciated. thanks
|