Skip to content

Instantly share code, notes, and snippets.

@anilex
Created March 26, 2014 14:31
Show Gist options
  • Save anilex/9784689 to your computer and use it in GitHub Desktop.
Save anilex/9784689 to your computer and use it in GitHub Desktop.
// http://gmap3.net/forum/viewtopic.php?pid=3280#p3280
// the image is 50x78px and and it scaled down to 25x39px.
var markerIcon = new google.maps.MarkerImage('map-icon.png', null, null, null, new GMaps.Size(25, 39));
var marker = new google.maps.Marker({
icon: markerIcon,
(function($) {
get_device_pixel_ratio = function() {
if (window.devicePixelRatio === undefined) return 1; // No pixel ratio available. Assume 1:1.
return window.devicePixelRatio;
}
})(jQuery);
jQuery(document).ready(function($) {
// CHECK PIXEL RATIO
var pixel_ratio = get_device_pixel_ratio();
var marker_size = pixel_ratio > 1.5 ? '@2x' : '';
});
Then for the Map JS, do this:
options:{
icon: new google.maps.MarkerImage('<?php bloginfo("template_url"); ?>/images/map-marker' + marker_size + '.png', null, null, null, new google.maps.Size(46,38))
}
// Using this example, you need to have 2 different marker files:
// map-marker.png
// map-marker@2x.png
// You can see my website for reference where I use markers:
// adventures.alexrakic.com/map/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment