Advertisement
Guest User

Untitled

a guest
Jun 17th, 2019
108
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.39 KB | None | 0 0
  1. var image = new google.maps.MarkerImage(
  2. 'bluedot_retina.png',
  3. null, // size
  4. null, // origin
  5. new google.maps.Point( 8, 8 ), // anchor (move to center of marker)
  6. new google.maps.Size( 17, 17 ) // scaled size (required for Retina display icon)
  7. );
  8.  
  9. @-moz-keyframes pulsate {
  10. from {
  11. -moz-transform: scale(0.25);
  12. opacity: 1.0;
  13. }
  14. 95% {
  15. -moz-transform: scale(1.3);
  16. opacity: 0;
  17. }
  18. to {
  19. -moz-transform: scale(0.3);
  20. opacity: 0;
  21. }
  22. }
  23. @-webkit-keyframes pulsate {
  24. from {
  25. -webkit-transform: scale(0.25);
  26. opacity: 1.0;
  27. }
  28. 95% {
  29. -webkit-transform: scale(1.3);
  30. opacity: 0;
  31. }
  32. to {
  33. -webkit-transform: scale(0.3);
  34. opacity: 0;
  35. }
  36. }
  37. /* get the container that's just outside the marker image,
  38. which just happens to have our Marker title in it */
  39. #map_canvas div.gmnoprint[title="I might be here"] {
  40. -moz-animation: pulsate 1.5s ease-in-out infinite;
  41. -webkit-animation: pulsate 1.5s ease-in-out infinite;
  42. border:1pt solid #fff;
  43. /* make a circle */
  44. -moz-border-radius:51px;
  45. -webkit-border-radius:51px;
  46. border-radius:51px;
  47. /* multiply the shadows, inside and outside the circle */
  48. -moz-box-shadow:inset 0 0 5px #06f, inset 0 0 5px #06f, inset 0 0 5px #06f, 0 0 5px #06f, 0 0 5px #06f, 0 0 5px #06f;
  49. -webkit-box-shadow:inset 0 0 5px #06f, inset 0 0 5px #06f, inset 0 0 5px #06f, 0 0 5px #06f, 0 0 5px #06f, 0 0 5px #06f;
  50. box-shadow:inset 0 0 5px #06f, inset 0 0 5px #06f, inset 0 0 5px #06f, 0 0 5px #06f, 0 0 5px #06f, 0 0 5px #06f;
  51. /* set the ring's new dimension and re-center it */
  52. height:51px!important;
  53. margin:-18px 0 0 -18px;
  54. width:51px!important;
  55. }
  56.  
  57.  
  58. /* hide the superfluous marker image since it would expand and shrink with its containing element */
  59. /* #map_canvas div[style*="987654"][title] img {*/
  60. #map_canvas div.gmnoprint[title="I might be here"] img {
  61. display:none;
  62. }
  63. /* compensate for iPhone and Android devices with high DPI, add iPad media query */
  64. @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (device-width: 768px) {
  65. #map_canvas div.gmnoprint[title="I might be here"] {
  66. margin:-10px 0 0 -10px;
  67. }
  68. }
  69.  
  70. var marker = new google.maps.Marker({
  71. //...
  72. icon: {
  73. url: 'path/to/your/image.svg',
  74. //...
  75. },
  76. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement