JavaScript - Internal Map Like Bing Mall's Map
Hello everyone,
a few days ago I saw the new Bing mall's maps. Link here and here. I'm a newbie and I was very impressed, so I was wondering just how did they do these internal maps. It 's a simple mashup or similar? Or use some special JS library? There are JS libraries (or other languages too) that gives the ability to create internal maps of buildings outside of google maps / bing maps? Like drawing a real internal map of house or other buildings (vector or not) by JS functions, variables and data .... Thanks for your help! PS: sorry for my english Similar TutorialsHi, I am working on bing map. I have many address for property and i want nearest tube station's information for every address in UK. I want to store all data in mysql database. Plz any working example.... Thanks for reply... Code: function businessDisambiguationExample() { if (!directionsManager) { createDirectionsManager(); } directionsManager.resetDirections({resetRequestOptions: true}); directionsManager.resetDirections(); var address1 = document.getElementById("address").value = 'address here'; //alert(address1); var seattleWaypoint = new Microsoft.Maps.Directions.Waypoint({ address: address1 }); directionsManager.addWaypoint(seattleWaypoint); //var mcdonaldsWaypoint = new Microsoft.Maps.Directions.Waypoint({ address: 'Nationalrailstations' }); var mcdonaldsWaypoint = new Microsoft.Maps.Directions.Waypoint({ address: 'tubestations' }); directionsManager.addWaypoint(mcdonaldsWaypoint); // Set the element in which the itinerary will be rendered directionsManager.setRenderOptions({ itineraryContainer: document.getElementById('directionsItinerary') }); // Set Route Mode to driving directionsManager.setRequestOptions({ routeMode: Microsoft.Maps.Directions.RouteMode.driving }); //alert('Calculating directions...'); directionsManager.calculateDirections(); } i use this function for searching but not working properly... Reply plz.......... Hi, I am trying to make a search box...like the one Bing has...i am able to make one successfully..but the thing is i want to display the text inside the box..the one like Google custom search has...I am sure this is possible but just dont know how to make it work ...can you help me with the script or the links which can help me make a search box which displays text inside.... Thanks in Advance Greetings, I use Google Maps API a lot and rarely have problems with it. I'm in a particular situation whereas I need to use Bing Maps and I'm running into a wall. All is working except for the pinInfo bubbles. They are all loading but all contain the same content. I'm using PHP to loop through some locations based on a query. When the map loads and I click on any pushpin and it displays the same infobox no matter what pin I select. Any help is greatly appreciated. Code: <script type="text/javascript"> function init(){ // Initialize the map var map = new Microsoft.Maps.Map( document.getElementById("map"), { center: new Microsoft.Maps.Location(36.133428, -86.825628), credentials: "--MY CREDS--", mapTypeId: Microsoft.Maps.MapTypeId.road, zoom:10 } ); // Creates a collection to store multiple pins var pins = new Microsoft.Maps.EntityCollection(); var position = new Microsoft.Maps.Location(36.133428, -86.825628); var infoPos = new Microsoft.Maps.Location(36.133428, -86.825628); var pin = new Microsoft.Maps.Pushpin(position); var pinInfobox = new Microsoft.Maps.Infobox(infoPos, {title: 'Blakemore Children\'s Center', visible: false}); Microsoft.Maps.Events.addHandler(pin, 'click', displayInfobox); Microsoft.Maps.Events.addHandler(map, 'viewchange', hideInfobox); pins.push(pin); pins.push(pinInfobox); var position = new Microsoft.Maps.Location(36.112321, -86.808275); var infoPos = new Microsoft.Maps.Location(36.112321, -86.808275); var pin = new Microsoft.Maps.Pushpin(position); var pinInfobox = new Microsoft.Maps.Infobox(infoPos, {title: 'First Steps, Inc.', visible: false}); Microsoft.Maps.Events.addHandler(pin, 'click', displayInfobox); Microsoft.Maps.Events.addHandler(map, 'viewchange', hideInfobox); pins.push(pin); pins.push(pinInfobox); var position = new Microsoft.Maps.Location(36.160374, -86.799663); var infoPos = new Microsoft.Maps.Location(36.160374, -86.799663); var pin = new Microsoft.Maps.Pushpin(position); var pinInfobox = new Microsoft.Maps.Infobox(infoPos, {title: 'Grace M. Eaton Child Care & Early Learning Center', visible: false}); Microsoft.Maps.Events.addHandler(pin, 'click', displayInfobox); Microsoft.Maps.Events.addHandler(map, 'viewchange', hideInfobox); pins.push(pin); pins.push(pinInfobox); var position = new Microsoft.Maps.Location(36.16022, -86.794828); var infoPos = new Microsoft.Maps.Location(36.16022, -86.794828); var pin = new Microsoft.Maps.Pushpin(position); var pinInfobox = new Microsoft.Maps.Infobox(infoPos, {title: 'Bethlehem Centers of Nashville', visible: false}); Microsoft.Maps.Events.addHandler(pin, 'click', displayInfobox); Microsoft.Maps.Events.addHandler(map, 'viewchange', hideInfobox); pins.push(pin); pins.push(pinInfobox); var position = new Microsoft.Maps.Location(36.152879, -86.767793); var infoPos = new Microsoft.Maps.Location(36.152879, -86.767793); var pin = new Microsoft.Maps.Pushpin(position); var pinInfobox = new Microsoft.Maps.Infobox(infoPos, {title: 'Wayne Reed Christian Childcare Center', visible: false}); Microsoft.Maps.Events.addHandler(pin, 'click', displayInfobox); Microsoft.Maps.Events.addHandler(map, 'viewchange', hideInfobox); pins.push(pin); pins.push(pinInfobox); var position = new Microsoft.Maps.Location(36.128548, -86.84995); var infoPos = new Microsoft.Maps.Location(36.128548, -86.84995); var pin = new Microsoft.Maps.Pushpin(position); var pinInfobox = new Microsoft.Maps.Infobox(infoPos, {title: 'St. Mary Villa Child Development Center', visible: false}); Microsoft.Maps.Events.addHandler(pin, 'click', displayInfobox); Microsoft.Maps.Events.addHandler(map, 'viewchange', hideInfobox); pins.push(pin); pins.push(pinInfobox); var position = new Microsoft.Maps.Location(36.177, -86.809951); var infoPos = new Microsoft.Maps.Location(36.177, -86.809951); var pin = new Microsoft.Maps.Pushpin(position); var pinInfobox = new Microsoft.Maps.Infobox(infoPos, {title: 'Eighteenth Avenue Family Enrichment Center', visible: false}); Microsoft.Maps.Events.addHandler(pin, 'click', displayInfobox); Microsoft.Maps.Events.addHandler(map, 'viewchange', hideInfobox); pins.push(pin); pins.push(pinInfobox); var position = new Microsoft.Maps.Location(36.178051, -86.77109); var infoPos = new Microsoft.Maps.Location(36.178051, -86.77109); var pin = new Microsoft.Maps.Pushpin(position); var pinInfobox = new Microsoft.Maps.Infobox(infoPos, {title: 'McNeilly Center for Children', visible: false}); Microsoft.Maps.Events.addHandler(pin, 'click', displayInfobox); Microsoft.Maps.Events.addHandler(map, 'viewchange', hideInfobox); pins.push(pin); pins.push(pinInfobox); var position = new Microsoft.Maps.Location(36.16479, -86.856395); var infoPos = new Microsoft.Maps.Location(36.16479, -86.856395); var pin = new Microsoft.Maps.Pushpin(position); var pinInfobox = new Microsoft.Maps.Infobox(infoPos, {title: 'St. Luke\'s Community House', visible: false}); Microsoft.Maps.Events.addHandler(pin, 'click', displayInfobox); Microsoft.Maps.Events.addHandler(map, 'viewchange', hideInfobox); pins.push(pin); pins.push(pinInfobox); function displayInfobox(e) { pinInfobox.setOptions({ visible:true }); } function hideInfobox(e) { pinInfobox.setOptions({ visible: false }); } // Adds all pins at once map.entities.push(pins); map.entities.push(pinsInfo); } </script> <div id='myMap' style='position:relative; width:323px; height:300px;'></div> I imagine that the problem might have something to do with the fact that I'm not using any kind of index when calling displayInfobox(e). How do I access the "ID" of the pin being clicked on? Code: Microsoft.Maps.Events.addHandler(pin, 'click', displayInfobox); How do Google and Bing allow you to use the keyboard up and down keys to jump to the suggested search results. I know how to do the Ajax search part, I just can't figure out how to get the search suggestions selected, and fire their HREF tag upon clicking the Enter button. Basically I can do all this without any keyboard navigation but I need to hook in the keyboard like they do. Is there a simple example somewhere? Google and Bing's are super complex and I can't snoop how they pull it off. been searching everywhere for help on this javascript kit but no luck JSE internal seach engine v 1.0a http://www.javascriptkit.com/script/...se/index.shtml Description: JSE is a highly robust, 100% client side search engine for indexing and searching your own site, using JavaScript 1.3. Some of JSE's noteworthy features a * Uses regular expressions to efficiently and rapidly search the index for matches based on the entered keywords. Supports basic logic (ie: negation). * Returns the results on a seperate page from the search form itself, neatly formatted. Uses session cookies to transmit the query between the two pages. * Stores the index (url, keywords and description for each page you wish to be "crawled") in the "results" page. This means the index is loaded only when a search has actually been performed, saving on bandwidth and download time. * Searches title, description and desingated keywords within the index for a match. * Works in IE4+, NS4, and NS6+. its perfectly working on local server but when I uploaded my files to my webserver. it doesn't work. Is there anybody can help me with this? TIA I am new to Javascript and I downloaded JSE internal search engine v 1.0a from CodingForums. It works fine in all browsers other than ie6 and ie7. Have confirmed that other javascripts are working in these browsers so it is not my browser settings. Can anyone help?
I'm a little rusty since i've been studying vb .net I forgot how to make this external. I know I'm messing up somewhere. Code: <script type="text/javascript"> function titbar(val) { var speed = 300; var pos = val; var tit1 = "V"; var tit2 = "VO"; var tit3 = "VOT"; var tit4 = "VOTI"; var tit5 = "VOTIL"; var tit6 = "VOTILL"; var tit7 = "VOTILLI"; var tit8 = "VOTILLIT"; var tit9 = "VOTILLITY"; var tit10 = "VOTILLITY.com"; if(pos==0) { titdis=tit1; pos=1; } else if(pos==1) { titdis=tit2; pos=2; } else if(pos==2) { titdis=tit3; pos=3; } else if(pos==3) { titdis=tit4; pos=4; } else if(pos==4) { titdis=tit5; pos=5; } else if(pos==5) { titdis=tit6; pos=6; } else if(pos==6) { titdis=tit7; pos=7; } else if(pos==7) { titdis=tit8; pos=8; } else if(pos==8) { titdis=tit9; pos=9; } else if(pos==9) { titdis=tit10; pos=0; } document.title = titdis; timer = window.setTimeout("titbar("+pos+")",speed); } titbar(0); </script> it works just fine when I have it internal p.s tit is short for title. no explicitive necessary. Hi! Help please: How to get the object window (in the current browser window or tab - called unsafeWindow in GM user.js files) inside these internal greasemonkey js-files extensions \ (e4a8a97b-f2ed-450b-b12d-ee082ba24781) \ content \ browser.js extensions \ (e4a8a97b-f2ed-450b-b12d-ee082ba24781) \ content \ install.js extensions \ (e4a8a97b-f2ed-450b-b12d-ee082ba24781) \ components \ greasemonkey.js Entangled with objects wrappedContentWin, chromeWin and other ... Thanks P.S.I want to slightly alter the logic of work; be grateful for links to the appropriate developers forums so i have code to make a popup via javascript and it works fine, but what actually pops up is an external file that i select (in my case test.html). i want all of the code of test.html to be in my index.html and when i call the popup it doesn't call an external file but instead calls the html code in the internal file (index.html)? possible? Code: <head> <script language="javascript" type="text/javascript"> function popitup(url) { newwindow=window.open(url,'name','status = 0,resizable = 0,height=500,width=600'); if (window.focus) {newwindow.focus()} return false; } </script> </head> <body> <a href="test.html" onclick="return popitup('test.html')">About</a> </body> what's in test.html? it's a form why? i need the code of test.html to access some global javascript variables in index.html I used the Google Internal Site Search script for my site but its search only the index.htm, how can I make it search the entir web site.
Yeah, it's that internal search engine script again. But before you click away, I'd like to ask whether anyone can solve a problem I've come up against... I have minimally changed the script to present results with a clickable url (this is my attempt at creating an image search engine, hence having to use this method). The problem I have suddenly encountered however is that the urls, while they read complete, they only link one directory deep into my website. For example: Reads as: http://www.mysite.com/search/set1/doctor.jpg Link is: http://www.mysite.com/search As you will see, I've omitted using the numbering array and have rearranged the order in which the values for how the search results are called. Code: if (include_num == 1) { document.write(a + 1, '. <a href="', os[0], '">', os[1], '</a><br>', os[2], '<p>'); } else { document.write('<a href="', os[0], '">', os[1], '</a><br>', os[2], '<p>'); } It is with this second point that I fear I have caused the damage. Code: // ---------- script properties ---------- var include_num = 0; var bold = 1; // ---------- sites ---------- var s = new Array(); s[0] = "^this will be added soon/form.html^Click to view image^"; s[0] = "^this will be added soon/doc.txt^Click to view image^"; s[0] = "^http://mysite.net/archive/Gliding/folderthumb.jpg^Click to view image^"; s[0] = "^this will be added soon/doctor.txt^^"; // ---------- end of script properties and sites ---------- var cookies = document.cookie; var p = cookies.indexOf("d="); if (p != -1) { var st = p + 2; var en = cookies.indexOf(";", st); if (en == -1) { en = cookies.length; } var d = cookies.substring(st, en); d = unescape(d); } var od = d; var m = 0; if (d.charAt(0) == '"' && d.charAt(d.length - 1) == '"') { m = 1; } var r = new Array(); var co = 0; if (m == 0) { var woin = new Array(); var w = d.split(" "); for (var a = 0; a < w.length; a++) { woin[a] = 0; if (w[a].charAt(0) == '-') { woin[a] = 1; } } for (var a = 0; a < w.length; a++) { w[a] = w[a].replace(/^\-|^\+/gi, ""); } a = 0; for (var c = 0; c < s.length; c++) { pa = 0; nh = 0; for (var i = 0; i < woin.length; i++) { if (woin[i] == 0) { nh++; var pat = new RegExp(w[i], "i"); var rn = s[c].search(pat); if (rn >= 0) { pa++; } else { pa = 0; } } if (woin[i] == 1) { var pat = new RegExp(w[i], "i"); var rn = s[c].search(pat); if (rn >= 0) { pa = 0; } } } if (pa == nh) { r[a] = s[c]; a++; } } co = a; } if (m == 1) { d = d.replace(/"/gi, ""); var a = 0; var pat = new RegExp(d, "i"); for (var c = 0; c < s.length; c++) { var rn = s[c].search(pat); if (rn >= 0) { r[a] = s[c]; a++; } } co = a; } function return_query() { document.jse_Form.d.value = od; } function num_jse() { document.write(co); } function out_jse() { if (co == 0) { document.write('Your search did not match any images currently on file.<p>Make sure all keywords are spelt correctly.<br>Alternatively, view the Unknown Section of the Archive and help us put a name and date to your memories.'); return; } for (var a = 0; a < r.length; a++) { var os = r[a].split("^"); if (bold == 1 && m == 1) { var br = "<b>" + d + "</b>"; os[2] = os[2].replace(pat, br); } if (include_num == 1) { document.write(a + 1, '. <a href="', os[0], '">', os[1], '</a><br>', os[2], '<p>'); } else { document.write('<a href="', os[0], '">', os[1], '</a><br>', os[2], '<p>'); } } } Because of the nature of the site (it will have over 600 images eventually), my level of understanding and the obviously limitations with this script, I'm looking for a solution that doesn't require a different edit for each entry. So far I have been able to simply drop a block of urls into this script (having planted a .php script to get the image directory listing) and then 'replace all' text that needs to be edited. In short, how do I ensure that the hyperlink for the url that is returned in the search query is full and not truncated to the first directory? ANY help in the matter would be really appreciated. Thank you in advance, Sam I'm trying to add an internal site search to my website, and it only work for some search items, not for everything. For example, if I search for Bud Light, Budweiser, Bud Light Lime, it finds them. But if I search for Stella Artois, Paulaner, or Hoegaarden, it doesn't find anything. I'm thinking there's something wrong with the javascript code, I'm just not sure how to fix it. I really appreciate any help with this!!! Here's the code in the head region: [<script type="text/javascript"> // Google Internal Site Search script- By JavaScriptKit.com (http://www.javascriptkit.com) // For this and over 400+ free scripts, visit JavaScript Kit- http://www.javascriptkit.com/ // This notice must stay intact for use //Enter domain of site to search. var domainroot="www.mhdbud.com" function Gsitesearch(curobj){ curobj.q.value="www.mhdbud.com:"+domainroot+" "+curobj.qfront.value } </script>] Here's what I've got in the body: [<form action="http://www.google.com/search" method="get" onSubmit="Gsitesearch(this)"> <input name="q" type="hidden" /> <input name="qfront" type="text" style="width: 180px" /> <input type="submit" value="Search" /> </form> You can try the site search to see what I'm talking about on this webpage: http://www.mhdbud.com/productsalt.html] Hello everyone, I am fairly familiar with the concept of Objects and their properties and methods, but javascript being object based as opposed to object oriented has me stumped on how to access an object's properties from an onclick event handler created for another object created within the original object. In the example below, I have a constructor function called anyObj. to which I pass an object reference to an element. anyObj has 3 properties and one function increaseWidth() increaseWidth() creates a new button with an onclick event handler and this is where I have a problem. The onclick function needs to increase the value of anyObj's this.width property. I originally had a line this.width += 10; in the onclick but quickly realised why this wasn't working because the this in the onclick function refers to the new button object and not the this.width property of anyObj. The workaround I have used, and it works, is to make a copy of all the this.xxxxx properties. eg. width = this.width; and use the width variable in the onclick as you can see below. This "workaround" works fine but doesn't feel ideal to me. So, what I am asking advice on is, is there a better way to access the anyObj()'s properties from within the onclick function than the way I have done it? Obviously I would prefer to not have to make copies of all the anyObj() properties like I have to make them accessible to the onclick function. Code: function anyObj(divObj){ this.elem = divObj; this.width = 50; this.height = 50; this.increaseWidth=function(){ width = this.width; height = this.height; //create a button for this object to be appended to an element later on var newButton = document.createElement('button'); newButton.onclick=function(){ width += 10; //... //... } //... //... } } I was advised by a community member this post would be better suited for the JavaScript section (hope someone can help): The exit pop-up script I have is working fine, other than the fact that it engages on any internal links as well. Below I have the original script I was using along with a modified script sent back to me from someone in another forum. They also advised me to add rel="external" to all of my external links. I'm not sure if a different condition would apply whether the link stayed within my site or went elsewhere. In any event, it's still not working. The changes get me to my desired page on internal links, but the pop-up still engages and I have to click "OK" before it takes me there. I'm obviously looking to get this to work so that all internal links go straight to the page they're defined to, without the pop-up engaging at all. Both script versions are below: My original: Code: <script type="text/javascript"> var internal = 0; function bunload() { if (internal != 1) { window.onbeforeunload = null; alert("******************************************************\n WAIT! WAIT! WAIT! WAIT! WAIT! WAIT!! WAIT!!\n******************************************************\n\nMy partner will probably KICK MY *** for this...\n\nI am secretly giving away a LIMITED number of $20\ncoupons just for Tweeting about us.\n\nIf you act right now, you can grab our Manuscript\nplus ALL Bonuses for just $27!\n\nJust click *CANCEL* on the next window to get your\nV.I.P. discount link!\n\n******************************************************"); window.location = "gift page"; return "******************************************************\n Click CANCEL - Click CANCEL - Click CANCEL \n******************************************************\n\n Click *CANCEL* Now to get your V.I.P. discount!\n\n"; } else { internal = 0; } } if (internal != 1) { window.onbeforeunload = bunload; } else { internal = 0; } </script> And the modified script another community member replied back to use: Code: <script type="text/javascript"> var internal = 0; function bunload() { if (internal != 1) { window.onbeforeunload = null; alert("******************************************************\n WAIT! WAIT! WAIT! WAIT! WAIT! WAIT!! WAIT!!\n******************************************************\n\nMy partner will probably KICK MY *** for this...\n\nI am secretly giving away a LIMITED number of $20\ncoupons just for Tweeting about us.\n\nIf you act right now, you can grab our Manuscript\nplus ALL Bonuses for just $27!\n\nJust click *CANCEL* on the next window to get your\nV.I.P. discount link!\n\n******************************************************"); window.location = "gift page"; return "******************************************************\n Click CANCEL - Click CANCEL - Click CANCEL \n******************************************************\n\n Click *CANCEL* Now to get your V.I.P. discount!\n\n"; } else { internal = 0; } } if (internal != 1) { window.onbeforeunload = bunload; } else { internal = 0; } window.onload = function() { var links = document.getElementsByTagName('a'); for(i = 0 ; i < links.length; i++) { if(links[i].getAttribute('rel') == 'external') { links[i].onclick = function() { bunload(); } } } } </script> Any suggestions on what I'm doing wrong here? My apologies, but my coding isn't very strong and I'm just picking this stuff up as I go. Thanks Need help - sorry for the novice-ness of this. Have a computed field ("Subtotal"). With that number, need to set up rule such that if Subtotal is a certain number, a certain number will print in the new field (lets call it "First"). Here's what I have so far... var a=getField("Subtotal").value; var b=5000; var c=9000; var d=33000; var e=53000; var f=68000; var g=78000; var h=83000; var i=0; Code: if (a.value<=100000){ event.value=b } else if (a.value<=200000 && a>100000){ event.value=c.value } else if (a.value<=1000000 && a>200000){ event.value=d.value } else if (a.value<=2000000 && a>1000000){ event.value=e.value } else if (a.value<=3000000 && a>2000000){ event.value=f.value } else if (a.value<=4000000 && a>3000000){ event.value=g.value } else if (a.value<=5000000 && a>4000000){ event.value=h.value } else if (a.value==0){ event.value=i.value } Any thoughts??? Help is GREATLY appreciated. D |