// Example 1: minimal constructor parameters
var ex1 = new SimpleMarker({
position: new google.maps.LatLng(50.7572, 6.1453)
});
// The rest can be done through setter methods
ex1.setMap(maps[0]);
// Example 2: using CSS to style the marker
new SimpleMarker({
map: maps[1],
position: new google.maps.LatLng(50.7572, 6.1453),
className: 'ex2'
});
The CSS class:
.ex2 {
width: 16px !important; /** use !important if you don't want */
height: 16px !important; /** to specify the 'size' parameter */
background-color: #F00;
border: 5px solid #00F;
border-radius: 15px;
}
// Example 3: use methods to influence the marker after creation
var ex3 = new SimpleMarker({
map: maps[2],
position: new google.maps.LatLng(50.7572, 6.1453)
})
// I use jQuery to attach the events, but you can
// do that in any way you like
$('#ex3_visible').click(function() {
ex3.setVisible(!ex3.getVisible());
});
$('#ex3_right').click(function() {
var currentPos = ex3.getPosition();
ex3.setPosition(
new google.maps.LatLng(
currentPos.lat(),
currentPos.lng() + 0.001
)
);
});