Question

I have developed a simple google map application with their api in version 3. Since everything worked fine on my machine I sent it to my colleague, who has reported that on his computer polyline breaks and shifts its part in a random manner (as shown here). Similar thing happens with regions, which also shits a part of its filling along with the outlining.

Code for the polyline is pretty simple:

var opts = eval(json);
var options = {
    strokeColor: opts.color,
    strokeOpacity: opts.opacity,
    strokeWeight: opts.weight,
    geodesic: true
}; 
var line = new google.maps.Polyline(options);

line.setPath(google.maps.geometry.encoding.decodePath(opts.points));
line.setMap(map);

and I can’t really figure out what is the reason for this. This looks like an error in google map rendering. It happens for him every time and in inconsistent areas. The colleague is using IE 9, while I (and other colleague, who is also not experiencing this error) IE 8.

So I’m asking if anyone has encountered a similar problem or has any idea what could be causing it.

EDIT:
I have updated my IE to version 9 and still works fine on my PC, so it is not IE version issue.

EDIT 2:
It is caused by not normal dpi on colleague’s system. Higher dpi values cause google maps to render improperly. My research on google gave no useful solutions (other than trivial “change your dpi”). If anyone has any ideas how to fix this, I will be much obliged.

Thanks in advance for any ideas.

Answer 1

As in EDIT2 in question this glitch is caused by non-standard dpi setting. Google’s official position on this is to change system dpi to standard, so there is probably no viable solution for now. Hope this will change with time.