There are five common google layers.
*google.maps.Marker;*google.maps.InfoWindow;*google.maps.PolyLine;*google.maps.Polygon;*google.maps.Circle;
1.Maker's properties:
*position:LatLng; ==> position.
*map: google.maps.Map; ==>this maker display on which map or use maker.setMap(map); {makert.setMap(null), which use to remove a marker from the map}
*title: 'string';
*draggable: false;
*animation: google.maps.Animation.DROP;google.maps.Animation.BOUNCE; / marker.setAnimation();
*label:'string' ==>A marker label is a single textual character that appears inside a marker;
*icon:image;
*shape:shape;
2.InfoWindow's properties: InfoWindow displays content(usually text or images) in a popup window above the map, at a given location; typically you will attach an info window to a marker, but you can also attach an info window to a specific latitude/longitude.
*content:'string';
*position:LatLng;
*maxWidth:number;
*Infowindow.close();close a info window.
*move an info window: call setPosition() or infoWindow.open();
3.Polyline's properties: To draw a line on your map.
*strokeColor: "#FFFFFF";
*strokeOpacity: 0.0 to 1.0;
*strokeWeight: number;
*setMap(map); //setMap(null);==>remove a polyline
*getPath(); ==>return polyline instance
*push(latlng);
*getLength();
*customize a polyline: See Symbols.
3. Polygon's properties: represents an area enclosed by a closed path.
*paths: triangleCoords; var triangleCoords = [{lat: 25.774, lng: -80.190},{lat: 18.466, lng: -66.118},{lat: 32.321, lng: -64.757}];
*strokeColor:'#FF0000';
*strokeOpacity:0.8;
*strokeWeight: number;
*fillColor:'#0000FF';
*fillOpacity:0.35;
*setMap(map); //setMap(null);
*getPath()
4. Circle: center, strokeColor, strokeOpacity, strokeWeight, radius, fillColor, fillOpacity, editable.
===>
google.maps.event.addListener(marker,'click', nameoffunction);
or
marker.addListener('click',nameoffunction);
==>可以在UI事件里acquire到event的parameter
marker.addListener('click',function(e){});