Skip to content

Instantly share code, notes, and snippets.

@tagliala

tagliala/gist:5705809

Last active December 18, 2015 01:39
Show Gist options
  • Save tagliala/5705809 to your computer and use it in GitHub Desktop.
Save tagliala/5705809 to your computer and use it in GitHub Desktop.
Download ZIP
svg people marker, home marker google maps
Raw
gistfile1.html
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Simple markers</title>
<link href="https://developers.google.com/maps/documentation/javascript/examples/default.css" rel="stylesheet">
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>
function initialize() {
var myLatlng = new google.maps.LatLng(-25.301006,130.722321);
var mapOptions = {
zoom: 14,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var marker = new google.maps.Marker({
position: myLatlng,
icon: {
path: 'M 4 0 C 5.1615 0 6.1035 0.942 6.1035 2.1035 C 6.1035 3.265 5.1615 4.2071 4 4.2071 C 2.8385 4.2071 1.8964 3.265 1.8964 2.1035 C 1.8964 0.942 2.8385 0 4 0 Z M 4 11.938 L 2.326 9.154 L 0.000200033 9.154 L 0.000200033 6.35 C 0.000200033 5.837 2.6083 5.0526 4 5.0526 C 5.3917 5.0526 7.9998 5.837 7.9998 6.35 L 7.9998 9.154 L 5.6739 9.154 L 4 11.938 Z',
scale: 4,
fillColor: '#2D93FF',
fillOpacity: 1,
strokeOpacity: 0,
strokeWeight: 0,
anchor: new google.maps.Point(4, 11.938)
},
shadow: {
path: 'M 9.4224 6.2185 C 10.0029 6.2185 10.4201 6.3315 10.6277 6.5142 C 10.8353 6.6969 10.8316 6.9489 10.5686 7.2269 C 10.3056 7.5049 9.829 7.7571 9.2761 7.9395 C 8.7232 8.1219 8.0902 8.2347 7.5097 8.2347 C 6.9292 8.2347 6.51 8.1216 6.303 7.9395 C 6.096 7.7574 6.0984 7.5049 6.3621 7.2269 C 6.6258 6.9489 7.1004 6.6968 7.6546 6.5142 C 8.2088 6.3316 8.8419 6.2185 9.4224 6.2185 Z M 3.9984 11.938 C 3.8615 11.4936 3.7246 11.0492 3.589 10.6043 L 2.4266 10.6043 L 1.2656 10.6043 L 2.538 9.2613 C 2.6548 9.1384 3.4534 8.9834 4.397 8.8587 C 5.3406 8.734 6.4305 8.6396 7.1258 8.6396 C 7.8211 8.6396 8.7325 8.7342 9.4385 8.8587 C 10.1445 8.9832 10.6532 9.1384 10.5364 9.2613 L 9.2626 10.6043 L 8.0989 10.6043 L 6.9365 10.6043 C 5.9554 11.0492 4.9769 11.4936 3.9984 11.938 Z',
scale: 4,
fillColor: '#333',
fillOpacity: 0.25,
strokeOpacity: 0,
strokeWeight: 0,
anchor: new google.maps.Point(4, 11.938)
},
map: map,
title: 'Hello World!'
});
var myLatlng2 = new google.maps.LatLng(-25.311006,130.732321);
var marker2 = new google.maps.Marker({
position: myLatlng2,
icon: {
path: 'M 5.5927 11.938 L 3.9187 9.154 L 1.5929 9.154 C 1.5929 7.815 1.5962 6.476 1.5929 5.1372 C 1.5929 5.1231 1.6022 5.1097 1.6022 5.0937 L 5.5938 1.8046 L 9.5814 5.0937 C 9.5865 5.1041 9.5925 5.1257 9.5925 5.1372 L 9.5925 9.154 L 7.2666 9.154 L 5.5927 11.938 Z M 11.1357 4.6564 C 11.1751 4.6088 11.1917 4.5569 11.1855 4.4968 C 11.1793 4.4367 11.1544 4.3849 11.1088 4.3455 L 9.5896 3.0813 L 9.5896 0.2503 C 9.5876 0.1881 9.5668 0.1342 9.5254 0.0926999 C 9.484 0.0511999 9.4321 0.0305999 9.3679 0.0284999 L 8.0353 0.0284999 C 7.971 0.0305999 7.9192 0.0512999 7.8777 0.0926999 C 7.8362 0.1341 7.8156 0.1881 7.8135 0.2503 L 7.8135 1.6036 L 6.1203 0.1881 C 6.0208 0.1072 5.9089 0.0534 5.7824 0.0264 C 5.6559 -0.00060004 5.5296 -0.000500033 5.4032 0.0264 C 5.2768 0.0533 5.1648 0.1072 5.0653 0.1881 L 0.0767989 4.3455 C 0.0311989 4.3849 0.00629891 4.4367 0.0000989139 4.4968 C -0.00610108 4.5569 0.0104989 4.6088 0.0477989 4.6564 L 0.478899 5.1704 C 0.495399 5.1911 0.518199 5.2098 0.543099 5.2222 L 0.623899 5.2471 C 0.654999 5.2512 0.686099 5.2471 0.713099 5.2388 C 0.740099 5.2305 0.766899 5.216 0.791799 5.1994 L 5.5938 1.1953 L 10.3938 5.1994 C 10.4145 5.216 10.4373 5.2284 10.4622 5.2367 C 10.4871 5.245 10.5119 5.2471 10.5409 5.2471 L 10.5617 5.2471 C 10.5886 5.2429 10.6155 5.2347 10.6425 5.2222 C 10.6674 5.2098 10.6881 5.1911 10.7067 5.1704 L 11.1357 4.6564 Z',
scale: 4,
fillColor: '#932DFF',
fillOpacity: 1,
strokeOpacity: 0,
strokeWeight: 0,
anchor: new google.maps.Point(5.593, 11.938)
},
shadow: {
path: 'M 5.5901 11.938 L 5.1724 10.6099 L 2.85 10.6099 L 3.7567 9.6515 L 4.6635 8.6926 C 4.67 8.6857 4.6867 8.6795 4.6933 8.6721 L 7.4285 7.8875 L 10.1653 7.1018 L 11.4135 7.8875 L 12.6634 8.6721 L 12.6551 8.6926 L 11.7484 9.6515 L 10.8416 10.6099 L 8.5176 10.6099 L 5.5901 11.938 Z M 14.4139 8.463 C 14.4753 8.4402 14.5169 8.4157 14.5366 8.3872 C 14.5563 8.3587 14.5565 8.3336 14.5283 8.3148 L 13.5818 7.7114 L 14.8599 6.3605 C 14.8847 6.3303 14.8897 6.3046 14.8665 6.2853 C 14.8433 6.266 14.8018 6.2556 14.7372 6.2545 L 13.4061 6.2545 C 13.3414 6.2556 13.2801 6.2653 13.2204 6.2853 C 13.1607 6.3053 13.116 6.3303 13.0845 6.3605 L 12.4744 7.006 L 11.4218 6.3303 C 11.3588 6.2921 11.2709 6.2665 11.1566 6.2534 C 11.0423 6.2403 10.9161 6.2402 10.777 6.2534 C 10.6379 6.2666 10.5035 6.2921 10.3659 6.3303 L 6.9361 7.3228 L 3.5064 8.3148 C 3.4434 8.3336 3.3954 8.3583 3.3622 8.3872 C 3.329 8.4161 3.3207 8.4402 3.3373 8.463 L 3.5362 8.7085 C 3.5429 8.7182 3.5561 8.7273 3.576 8.733 C 3.5959 8.7387 3.6208 8.7433 3.6456 8.745 L 3.7401 8.741 C 3.77 8.7372 3.8031 8.7302 3.8346 8.7222 L 7.1367 7.7667 L 10.4405 6.8112 L 11.934 7.7667 L 13.4276 8.7222 C 13.4409 8.7302 13.4608 8.7359 13.479 8.7399 C 13.4972 8.7439 13.5238 8.745 13.5536 8.745 L 13.5751 8.745 L 13.6663 8.733 C 13.6962 8.7273 13.7277 8.7182 13.7542 8.7085 L 14.4139 8.463 Z',
scale: 4,
fillColor: '#333',
fillOpacity: 0.25,
strokeOpacity: 0,
strokeWeight: 0,
anchor: new google.maps.Point(5.593, 11.938)
},
map: map,
title: 'Hello World!'
});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>
@tagliala
Copy link
Author

tagliala commented Jun 4, 2013

http://jsfiddle.net/tagliala/KdYkK/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment