Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What is the construct interface `google.maps.Icon`

The docs of Google Maps V3 JS API does not seem to give the interface of the construct of google.maps.Icon. I found an example with MarkerImage, which seems to be deprecated now.

So, what are the possible google.maps.Icon construct parameters and what is their order? How to define icon size, icon offset in sprite, icon anchor, etc?

Edit:

How would I create an icon and assign it to a marker? Eg (not tested/does not work):

var icon = new google.maps.Icon(path, 
    new google.maps.Size(32, 32), // size
    new google.maps.Point(0, 32), // offset in sprite
    null, // anchor
);

I do see the docs but I do not see example usage if that class!

like image 459
ddinchev Avatar asked Jan 18 '13 20:01

ddinchev


People also ask

What is the Google Maps symbol?

The Google Maps pin is the inverted-drop-shaped icon that marks locations in Google Maps. The pin is protected under a U.S. design patent as "teardrop-shaped marker icon including a shadow". Google has used the pin in various graphics, games, and promotional materials.

How do I create a custom icon for Google Maps?

Use a custom iconRight-click the placemark you want to customize. Click Properties (Windows, Linux) or Get Info (Mac). At the top right of the "Edit Placemark" or "Edit Folder" window, click the icon. Choose Add Custom Icon.

How do I get icons on Google Maps?

Click the name of the pin you've just added on the menu panel on the upper left corner of the web page, and click the paint bucket icon next to it. A small dialog box with a color picker will appear. Click "More Icons" on the box, and a larger dialog box labeled "Choose your icon" will show.


2 Answers

There is no constructor for the google.maps.Icon, it is an anonymous javascript object like MapOptions, MarkerOptions, PolygonOptions, etc.

You use it like this:

var icon = {
    anchor: new Point(...),
    url: "myurl"
    // etc..
    };

From Oliver in a comment: The point is: there is no such class (or function, for that matter) as google.maps.Icon. The API docs refer to it as google.maps.Icon object specification (here), as opposed to e.g. the InfoWindow class.

like image 151
geocodezip Avatar answered Oct 13 '22 01:10

geocodezip


Hmm... Now, this answer is just wrong.

You can't

var icon = new google.maps.Icon({
    anchor: new Point(...),
    url: "myurl"
    // etc..
});

It's an object literal, which means that you can just use it like this:

var icon = {
    anchor: new Point(...),
    url: "myurl"
    // etc..
};
like image 30
Nikolaj Avatar answered Oct 13 '22 00:10

Nikolaj