Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- var image = new google.maps.MarkerImage(
- 'bluedot_retina.png',
- null, // size
- null, // origin
- new google.maps.Point( 8, 8 ), // anchor (move to center of marker)
- new google.maps.Size( 17, 17 ) // scaled size (required for Retina display icon)
- );
- @-moz-keyframes pulsate {
- from {
- -moz-transform: scale(0.25);
- opacity: 1.0;
- }
- 95% {
- -moz-transform: scale(1.3);
- opacity: 0;
- }
- to {
- -moz-transform: scale(0.3);
- opacity: 0;
- }
- }
- @-webkit-keyframes pulsate {
- from {
- -webkit-transform: scale(0.25);
- opacity: 1.0;
- }
- 95% {
- -webkit-transform: scale(1.3);
- opacity: 0;
- }
- to {
- -webkit-transform: scale(0.3);
- opacity: 0;
- }
- }
- /* get the container that's just outside the marker image,
- which just happens to have our Marker title in it */
- #map_canvas div.gmnoprint[title="I might be here"] {
- -moz-animation: pulsate 1.5s ease-in-out infinite;
- -webkit-animation: pulsate 1.5s ease-in-out infinite;
- border:1pt solid #fff;
- /* make a circle */
- -moz-border-radius:51px;
- -webkit-border-radius:51px;
- border-radius:51px;
- /* multiply the shadows, inside and outside the circle */
- -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;
- -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;
- 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;
- /* set the ring's new dimension and re-center it */
- height:51px!important;
- margin:-18px 0 0 -18px;
- width:51px!important;
- }
- /* hide the superfluous marker image since it would expand and shrink with its containing element */
- /* #map_canvas div[style*="987654"][title] img {*/
- #map_canvas div.gmnoprint[title="I might be here"] img {
- display:none;
- }
- /* compensate for iPhone and Android devices with high DPI, add iPad media query */
- @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (device-width: 768px) {
- #map_canvas div.gmnoprint[title="I might be here"] {
- margin:-10px 0 0 -10px;
- }
- }
- var marker = new google.maps.Marker({
- //...
- icon: {
- url: 'path/to/your/image.svg',
- //...
- },
- });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement