Google map - show several markers location

Hi all

I'm working with google api and javascript and show multiple markers of location

I got this code to get started:

http://jsfiddle.NET/g95q8L76/


Places My goal is to get my address to my database and replace hardcoded with my variable addresses rather than their...

below, may seem a little strange, but illustrates my fail...

-I get an error when I try to replace the text of harcoded with my variable (with the same text)


-> This causes error undefined geocode = failed: OVER_QUERY_LIMIT

I think it's because it's a string not not an array / object?

Q: How can I get this to work and convert tabular return?



<! doctype html >

< html >

< head >

< meta charset = "UTF-8" >

the multi Document < title > 1 < /title >

" < link rel ="stylesheet"href =" https://code.jQuery.com/Mobile/1.4.5/jQuery.mobile.structure-1.4.5.min.CSS " />

" < script src =" https://code.jQuery.com/jQuery-1.11.1.min.js "> < / script > .

" < script src =" https://code.jQuery.com/Mobile/1.4.5/jQuery.Mobile-1.4.5.min.js "> < / script > .

< script type = "text/javascript".

SRC =

" https://maps.googleapis.com/maps/API/js?v=3.exp & Sensor = false ">

< /script >

< style type = "text/css" >

HTML, body {#map_canvas}

height: 500px;

Width: 500px;

margin: 0px;

padding: 0px

}

< / style >

< / head >

< body >

< script >

try to replace this work with my version-var error of fact

localities of var =]

['Location 1 name', 'New York, NY","URL of location 1"].

["Name location 2", "Newark, NJ", "URL of location 2"],

['Location 3 Name', 'Philadelphia', "URL of the location 3"]

];

my attempt (really come from addresses database - this simple for the moment)

var sites =

"[["Name location 1","New York, NY","URL of location 1"], ["Name location 2","Newark, NJ, "2 location URL"] ["Name of the location 3", "Philadelphia, PA", "3 location URL"]];

localStorage.setItem ("tryit", communities);

This will cause the error = undefined geocode failed: OVER_QUERY_LIMIT

I think it's because it's a string not not an array / object?

Q: How can I get this to work and convert tabular return?

var sites = localStorage.getItem ("tryit");

var geocoder;

var map;

var limit = new google.maps.LatLngBounds ();

function initialize() {}

map = new google.maps.Map)

document.getElementById ("map_canvas"), {}

Center: new google.maps.LatLng (37,4419,-122.1419),.

Center: new google.maps.LatLng (34.1623449,-118.3995877).

Zoom: 13,

mapTypeId: google.maps.MapTypeId.ROADMAP

});

Geocoder = new google.maps.Geocoder ();

for (i = 0; i < locations.length; i ++) {}

geocodeAddress (rentals, i);

}

}

google.maps.event.addDomListener (window, "load", initialize);

function geocodeAddress (rentals, i) {}

Title var = rentals [i] [0];

var address = rentals [i] [1];

var url = locations [i] [2];

Geocoder.geocode ({}

'address': locations [i] [1]

},

{function (results, status)

If (status == google.maps.GeocoderStatus.OK) {}

var marker = new google.maps.Marker({)

                icon: ' http://maps.Google.com/mapfiles/Ms/icons/blue.PNG ',

Card: card location,

position: results [0].geometry.location,.

Title: title,.

Animation: google.maps.Animation.DROP

address: address,.

URL: url

})

infoWindow (marker, map, title, address, url);

Bounds.extend (Marker.GetPosition ());

map.fitBounds (bounds);

} else {}

Alert ("geocode from" "+ address +" failed: "+ status);

}

});

}

function infoWindow (marker, map, title, address, url) {}

google.maps.event.addListener (marker, 'click', function () {}

var html = "h3 > < div > < ' + title + ' < / h3 > < p >" + address + "< br > < / div > < a href =" "" + url + "' > display location < /a > < /p > < / div >"

IW = new google.maps.InfoWindow({)

content: html,.

maxWidth: 350

});

IW. Open (map, marker);

});

}

function createMarker (results) {}

var marker = new google.maps.Marker({)

        icon: ' http://maps.Google.com/mapfiles/Ms/icons/blue.PNG ',

Card: card location,

position: results [0].geometry.location,.

Title: title,.

Animation: google.maps.Animation.DROP

address: address,.

URL: url

})

Bounds.extend (Marker.GetPosition ());

map.fitBounds (bounds);

infoWindow (marker, map, title, address, url);

return marker;

}

< /script >

< div id = "map_canvas" style = "width: 750px; height: 450px; border: 2px solid #3872ac; "> < / div >

< / body >

< / html >

The question is because your attempt to locations var is actually a string, not a table that is needed to treat a Geolocation. That's why you get 150 thousand alert messages trying to loop through each element of array and process geolocation, but since your var is a string, it is a loop in the length of the string, which is equivalent to 150 thousand characters. The solution is to build a picture of your DB rather than build a chain. Essentially when you query your DB create an empty array, then when you dynamically loop results from your DB to get the data use the array.push method javascript (or the equivalent php if you treat the results of DB in php) to push loop iteration in a new array element. You must also use a console.log instead of an alert message you don't need to close each message alert and essentially freeze your application being debugged.

OVER_QUERY_LIMIT is because you're trying to send too many requests of geolocation (see 150 thousand above), who is strangled by Google. So he tries not to geotag a location that already has a location recorded in the comic book, you should be storing the result of geolocation in your database. Also I don't really know why you create a var, try storing in localstorage, then immediately retreiveing data storage local to continue the process of your markers. It seems unnecessary to do so, unless you store in the local storage for another reason. For debugging, the issue of marker, it is best to remove any factor the localstorage useless until make you it work with your markers and then refactor your localstorage logic in the script after that a Lite version works.

best,

Shocker

Tags: Coding Corner

Similar Questions

  • Can I create a Google Map with several points?

    I am building a Web site for a company with several companies, and they want all appear on the map. In the standard Google maps widget, you can add only one address. Is it possible to add multiple addresses without scripting?

    You can always add placements more once you have published the site by editing the source code. Otherwise simply don't use the widget and enter the code clean Google according to custom HTML.

    Mylenium

  • My google map stopped working: I have firefox 12.0 and my google map shows just a white square instead of the map.

    My Google map does not load. It displays an empty blue square instead of the map. I disabled all extensions of pluginsand started in safe mode, cleared cache and cookies, but nothing is done. WOT to do!
    It works in Chrome, but also have the same problem with IE9. I don't know when it started, but it was working fine last month.

    Looks like a problem with the width of the containers that have the width set to 100% 0

    These style rules make the images appear for me:

    @-moz-document domain(www.ctiscarborough.org.uk){
div.view-content > div > div > div,
div.view-content > div > div > div > div,
div.view-content > div > div > div > div > div {width:100%}
}

  • Google Maps shows a white screen to 9.1 Safari

    Hello.

    I tried to solve this problem for a customer for a few days now. When I try to open Google Maps in Safari, I get a blank screen or the same screen with text (he said so far the two 'Google Maps' and ' < '). Very occasionally, I will be able to use the site correctly, apparently at random. This problem does not occur on Google Chrome, which is also installed on this computer, but my customer insists on the use of Safari.

    I tried to clear the cache using the "Safari > Preferences... > privacy > remove all data from the Web site" without success. I also tried the system update to the latest version of El Capitan, hoping that it would include an update for Safari, which would solve the problem. Yet once again, this proved unnecessary.

    Can anyone help me identify and solve the problem?

    Safari - no support for third-party modules can cause Safari to suddenly quit, or have performance problems

    Safari does not load a page or webpage elements are missing

    Safari / other browsers - Web site does not

  • Google Maps showing is not the real device...

    Hi all

    I use third party API for google maps on BlackBerry. I downloaded the library card from the link below.

    http://www.nutiteq.com/MGMaps-lib-SDK-downloads

    The app works very well and the cards are displayed in the Simulator, but when it is deployed on

    real aircraft, the map is displayed in red. I use Wi-Fi for internet and I use

    BlackBerry 8520 device and BB Java Plug in for Eclipse.

    Please help me, very important in my project.

    Kind regards

    Saran.

    Hi Simon,.

    Thanks for your reply, I solved my problem and its working fine now.

    Kind regards

    Saran.

  • BlackBerry Blackberry Z10 cards do not map shows just a location

    Shows no maps BlackBerry card just a location on att with 10.0.10.822 os and software 10.0.10.116

    http://forums.CrackBerry.com/BlackBerry-Z10-F254/BlackBerry-maps-not-working-818297/

    "NOTE TO ALL THE PROBLEMS, ALL THE HISTORY, CLEAR CARDS THIS CURED MY PROBLEM."

    http://forums.CrackBerry.com/BlackBerry-Z10-F254/BlackBerry-maps-not-working-818297/

    It works

    Thank you all!

  • Google Maps - Site has been created with correct map location, now displays an incorrect location?

    Hi all

    I don't know what is happening. I created a website for a client and used the Google Maps widget to add a map on the site.

    When it was created and downloaded first, everything was fine and in good working condition.

    The client sent now that on the site, Google maps shows another location, which is.

    Here is the website with the location of the maps incorrect page: Hours location

    Here is the map/Info which is supposed to be displayed: https://www.google.com/maps/place/Heddon+Museum/@41.9865694,-86.1157902, data/15z =! 4 m 2! 3 m 1! 1s0x0:0x9768c49fcde9e3a1

    I have also included a screen shot of the page open in Muse to show what it was created as originally published as:

    Heddon_Muse_ScreenShot_122915.png

    A few questions-

    1. how this change? I opened the last registered site which has been published and it has the location of the correct card (as shown in the screenshot above).

    2. How can I prevent this happening again? I'm sure that if I re - download it will fix it, but it's just a band-aid and I want a permanent solution to prevent it.

    Thanks in advance!

    Melissa

    Just figured it out with the help of the cat from Adobe:

    They had put me in the 'Museum of Heddon' name instead of the address, and it fixed the issue.

    They said that it captures the Google code, so most likely, what happened, that's what they (Google) changed/updated their code.

    A note on what I found: if I type the full address 'Museum Heddon Dowagiac MI 49107' it always goes to the wrong card location. By simply removing the postcode, it goes to the correct location. Not sure why she does that, I'll probably have to contact Google.

    If anyone has another preview comment below, I wanted to just that everyone knows how to solve this problem if they were also have.

    Thank you

    Melissa

  • Google map

    Hello

    I want to insert Google map (ie. the exact location of my spot) in my contact page. I can't find any exact video tutorial for it.

    Please let me know all video tutorial explaining this concept.

    Thanks in advance .

    How to insert the map Google - YouTube

  • Custom conversion Google map in PDF format

    Is it possible to take a personalized Google map (showing points of interest, we have created) and turn it into a pdf file which would be zoomable, and in which each of these points would be clickable (or via mouseover) to display information on these points? If the answer is Yes, is their feature that allows it to be read on a mobile device?  Thank you! If it is not an Adobe solution that would achieve this, you know another solution?  Here's an example of the type of card I want to be able to convert to PDF and each identifiable icon in a certain way:

    +city map sample.jpg

    I have a feeling that Google would make it as difficult as possible.

    If I had been asked to do, I would be worrying a lot about the registration of the map data and to know if do a "copy offline" violated the license from Google. http://www.google.com/permissions/geoguidelines.html. How is your copyright?

    Google offers a maps API that can be used to provide maps on mobile devices. This could be the safest option.

  • Maps Google widget shows is not the correct location in Muse [edited: Google maps for United Kingdom?]

    I think that there is a bug with the Google Map widget.

    I followed the instructions to insert a Google map into my Muse page, but all I get is a map of the world.

    The address I've tried to get is: 100 Station Street, Burton on Trent, Derbyshire, United Kingdom, 14 1BT (restaurant name omitted as long as it is not officially open yet)

    I see a "sign in" on the map and as I already have a Google identity I could connect if given option.

    Hi William,.

    The correct addresses for your location was detected by Google as - 100 Station St, Burton-on-Trent, Staffordshire 14 1BT, UK,

    Please try with this and it will work,

    Kind regards

    _Ankush

  • Add several location google map

    How can I add a Google map with more than one location map. I have 2 sites biz, but I don't see a way to have multiple sites on the same card biz. Can I have more than one address? How can I do?

    Hi David,

    There is no output from the solution of the box for this in Muse. I'll leave this discussion open to other members to meet with the solution they have, if any.

    Kind regards

    Aish

  • Addition of several markers in Google maps 1.0 widget?

    Is it possible to have multiple markers on the google maps widget? I tried to add some markers more into the code, but I can't have the name on the markers to change. They all remain identical to the original.

    http://test.netfc.com/svf_dealer_locations.html

    Not sure on any 'Google Maps Widget'... but Google Maps offers many options of editing... including the pin icons and content that appears when clicking on the axis... Name, description, links, etc.

    Here are the steps I used...

    Create a Google Maps account

    Sign in,

    Create a map in the 'Favorites '.

    If necessary, change this card.

    For example:

    http://www.exploreolympics.com/map.html

    If the 'widget' does not work... Look at the other options available to Google Maps... just Google details for more information

    Best wishes

    Adninjastrator

  • Google Maps: pan and zoom controls are not displayed. 'PIN' markers can appear only once, and then disappear.

    Loading Google Maps, either directly, or where they are incorporated into other sites, orders pan and zoom are not displayed. Location markers 'PIN' can appear only once, but disappear after doing anything with the card. I'm on the last Windows XP and latest Firefox. This problem is long-standing and has remained the same during several different versions of Firefox and Windows updates. I tried "CTRL-0' no effect."

    Problem solved by 'Reset Firefox'. Before that, tried "Safe Mode", no difference. Not aware of the limits on the cookies or the memory usage. Controls on the left (Pan, zoom) for Google Maps were good here and in usual and sizing correct positions and could be found with the cursor and activate it, but 'ghosts' that were not display. Same problem if the content was maps or satellite pix. Reset solved the problem.

  • error message when the location of my pictures (Google maps)

    Excuse my bad English, I'm french! When I try to inform them of the location of my pictures in IPhoto, using Google Maps in the Info window, I get this message: "Oops!" something was wrong. This page has not properly loaded Google maps. See the JavaScript console for more technical details"

    What can I do with Java script?

    Thank you for your response.

    Contract of Apple with Google to use Google maps with locations of the pictures in the iPhoto library has been cancelled a few months previously.  That's why iPhoto 9.4.3 and earlier can no longer access the Google map servers and get this error message.

    If you use iPhoto 9.4.3 or earlier you can stop the fracas in the following manner, but will lose the mapping functionality in the library.

    iPhoto 9.4.3 and earlier began planting for many users suddenly a few weeks ago. This is because the contract between Apple and Google for the use of Google maps with iPhoto 9.4.3 and earlier sites expired an elderly couple of months and was not renewed. This is the case of him freezes or crashes.

    Now uses Apple its own program for locations maps and too the use you need to run iPhoto 9.5.1 and Mavericks or 9.6.1 and Yosemite El Capitan or Photos and El Capitan.

    Try Huxly647Solution:

    Huxly647 , November 20, 2015 12:05 AM
    Re: iPhoto crashes after opening several times in reply to carvermon

    I found a solution that works for me.

    1 goto /Applications/iPhoto.app/Contents/Resources (control (right) - click the iPhoto application and select the content in the context menu - OT.)

    2 delete the files 'googlemap.html' and googlesearch.html

    iPhoto no longer crashes, site does not work, but it doesn't bother me too much.

    Let me know if it works for you guys...

    Deletes two files "googlemap.html" and the googlesearch.html of iPhoto application bundle prevents the JavaScript running inside and causing the accident.  Log of course do the same thing. So it's pretty clear that something happened at the end of Google.

    There is a notch posted by user cotton-x that will let iPhoto 9 and earlier still use Google Maps for the purpose of the location.

    cotton-x

    16 December 2015 14:49

    Re: iPhoto 11 - problems with Photo locations

    in response to Paul Fisher

    YES!

    I did just the job.

    I'm on a macbook running white 10.7.5 with iPhoto 9.4.3

    Thanks to Paul, I got an idea. What happens if we had simply ignored Apple has expired API and used our own, private and free from Google. Turns out it works.

    Here's what you need to do:

    0 - quit iPhoto

    1. create a google account or use your own

    Console developers of Google 2 - access HERE

    3. create a project (any name)

    4 - turn on a Google Maps Javascript API

    5 - generate your own API key

    6 - go to the folder /Applications/iPhoto.app/Contents/Resources/googleMap.html

    7. change the googleMap.html (I used an application called TextWrangler)

    8 change the src ="http://maps.googleapis.com/maps/api/js?v=3 & client = gme-appleinc & sensor = false" > to this src = 'https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE& signed_in = true & sensor = false ">"

    9 - save your freshly edited googleMap.html

    10 - open iPhoto and enjoy.

    Take the Apple.

    Don't forget to make a backup copy of the iPhoto application before performing this procedure.

  • Saved on my google maps locations

    Hello

    I have a few sites registered on my google maps. How can I tell my moto360 watch to navigate to one of the saved?

    Anyone know?

    Thanks in advance.

    Update:

    I discovered how do now after messing around with it. You start browsing the location of registration via Google Maps on your phone first , and then the watch will be kick and show step by step instructions. This feature does not work via 'google Ok' on the watch.

    Hope this will help someone in need.

    And thank you all.

Maybe you are looking for