CODEWITHSUNDEEP
javascriptgoogle-maps
Genadinik
Genadinik

Reputation: 18639

Markers Appearing at Random Times

I am trying to create a map with 3 different markers, but currently each is appearing at a random time. I think it is a problem with asynchricity.

The test url is here and the map shows up towards the bottom of the page: http://www.comehike.com/hikes/hike_carpool.php?hike_id=125

Does anyone know what I am doing wrong?

Thanks, Alex

Upvotes: 0

Views: 362

Answers (1)

Maxym
Maxym

Reputation: 11896

you mean you see your markers drawing at different time, e.g. at the beginning you see red one, then yellow, and then blue one. Next time you load the page you could notice blue marker showing first, then yellow and then red one. Do I get your question right? If yes, then do not care about :) It depends on network connection, server loading etc. E.g. look at Net tab of FireBug, first time I got:

enter image description here

so browser started requesting smile.gif and car.jpg at the same time, after a while marker_sprite was requested. Actually you see that maps.google.com served request faster (though request started later). Then your server (comehike.com) processed request for car.jpg (though it is big one, 1.3kb), and then comes smile.gif (though its size is just 174b and it was first requested image).

Next time I pressed F5 and got images from browser cache, but browser sends some requests to see if they really were not changed:

enter image description here

notice, that browser started requesting information about car.jpg quite early, but due to connection time, and waiting for result it took a lot to get it (though it is cached, so browsers just waits for confirmation). Again maps.google.com processed request faster than comehike.com.

So this is not about ajax, it depends on when browser will request image, and how fast server will process it (and it depends on its queue etc...).

If you want all markers to be shown at the same time, you need to use CSS Sprites and combine all marker images into the one. Have a look there (any article is good):

  1. CSS Sprites: What They Are, Why They’re Cool, and How To Use Them
  2. CSS Sprites: Image Slicing’s Kiss of Death
  3. The Mystery Of CSS Sprites: Techniques, Tools And Tutorials

this way you will have one image instead of three, so when it is loaded browser will display all markers (at least you won't notice that there is any delay between marker drawing). Hope it explains and helps.

Upvotes: 1

Related Questions