A simple marker example

Once you have set up your map as seen in the earlier post you can now place a marker at your point of interest on the map. A marker is a symbol that is used to point something interesting or important on the map! A marker can be overlayed on a map statically, dynamically i.e. when a user clicks on a map, a marker appears on the map. Markers can also be loaded from an XML file, a plain text file and also a CSV file. We will be seeing an example of each in the subsequent posts.

Later on we will also see how to add an information window to the markers on the map! But that will be at a later stage. Let us have a look at the following code first which will add a marker at the Rajya Sabha, New Delhi.

And here you are...You have placed a marker at your point of interest. The output will look as seen in the result section above. Feel free to change the point of interest and see a marker at a location of your choice. Happy mapping!

Comments

Recommended for You

Playing with the markers and info window bubbles...

In the last few posts, we have seen some marker examples and some information window examples. Now, lets do something interesting combining these two things. Just writing that "This is an info window" in the information bubble is not very interesting! And I know this...Have gone through the same phase! So, today we will do something interesting! We will display the latitude- longitude co-ordinates of the point that the user clicks on the map! Doing this is not at all complex! Copy paste the following code and you will see for yourself a map coming to life! The output of the above code looks as seen in the result section above! If you have any queries regarding the above code please comment on the blog post or feel free to contact me at my mail ID .

jQuery Mobile's Next Big Step

Spatial Unlimited changes to The UI Dev After being hosted on blogger 😣 for the last 6 years 📆, this page has finally been moved to Github.io This means a few things for you, dear reader! You will be redirected to the new page shortly! ⏩ ⏩ ⏩ Once crapy HTML is now better looking Markdown ! 😍 😍 The entire blog is a Github repo ! 😍 😍 Spatial Unlimited is now The UI Dev 😍 😍

Custom markers...

We have now seen numerous examples of markers and info-windows in Google Maps API v3. We will now see a last example where-in we will replace the customary marker icon with an icon of our choice! In the example that follows, I have shown 5 beaches in Goa along the Konkan coastal strip! These are nothing but markers, just with a different icon! Lets have a look at the following code! The output of the above code looks as seen in the result section above. This is a simple code that goes here! If you have any queries or doubts or suggestions regarding this example you can comment on the same or feel free to drop me a mail ! In the meantime...Happy Mapping!

Google Street View Image API

Street View is one of most used feature of the Google Maps and why not? You can actually see any part of the world as if you are visiting the place at that very moment. And now with the Google Street View Image API, you don't even need to carry a camera with you to the places you visit. You can take-in all the scenic beauty without even bothering about clicking a single picture. You can come back from your vacation and get a few images using the Google Street View Image API and show those images to your friends and relatives. Create an album of high definition images and go ahead and share it on Facebook for your friends to have a look. Using the Google Street View Image API is very simple and anybody can make use of it without any programming knowledge required. I will walk you through the entire process of effectively using the Google Street View Image API. So if you are set, let's go on an amazing ride across the globe with the Google Street Views. ...

Celebrating 200K visitors!

I’m so excited that I have finally reached this milestone. 200K blog hits! Yes, we have crossed 200K visits. I never thought when I started this blog in November, 2010 that I would have much to offer that people would appreciate so much. But today with more than 200,000 page views, more than 500 followers and several Likes and +1s the response to this blog has been nothing short of amazing. Now I have the added responsibility of contributing better code samples and better articles. At the end, I would like to thank all visitors and members for making this blog successful. I am so happy to have readers such as you. Thank you all who have been reading. If you are a regular reader, or if you just dropped by today, do comment and tell me what you liked about the blog!

The UI Dev

Search This Blog