How to disable google map api v3 anti-aliasing

Question

I have an image to add to google map using overlay .

• This is my image ( a part of my image ) : link here .

• And this is when it is added to Google map : link here .

Sorry I don't have enough rep to post image :( .

As you can see, Google makes it smoother but I don't want to do this . I want it look like normal .

How can I do that ? Please help .

P/s : currently there is no way to do this . So sad :( .

Answer 1

Here you go: http://jsfiddle.net/jeffswitzer/hhcgyLtb/

Add the following css and the anti-aliasing should go away. I've only tested this in chrome and firefox with a google maps image overlay. Pretty sure it won't work for explorer and that it will work in safari.

img {
  image-rendering: pixelated;
  image-rendering: -moz-crisp-edges;
}

For more info check this image-rendering MDN Webdoc entry.