Irregularly Misaligning Overlayviews

12 views
Skip to first unread message

Reggie Wlodarczyk

unread,
Jun 20, 2011, 3:39:03 AM6/20/11
to google-map...@googlegroups.com
How come the red bars in this map: http://www.maastrichtbereikbaar.nl/auto.html are showing at irregular positions? When I first implemented this it worked perfectly, since a month or they started misaligning. They seem to shift around when zooming as well.

The blue P icon markers each contain an OverlayView that shows the number and red inidication bar. Here is the code that draws the overlayview:

    ParkingspotOverlay.prototype.draw = function() {
        var projection = this.getProjection();
        if (projection != null) {
            var position = projection.fromLatLngToDivPixel(this.get('position'));
            var percentage = 100 - Math.round(((this.freespots / this.totalspots) *100));

            if (percentage > 100) { percentage = 100; }
            if (percentage < 0 ) { percentage = 0; }

            // label
            var divlabel = this.divlabel_;
            divlabel.style.left = (position.x - 15) + 'px';
            divlabel.style.top = (position.y - 25) + 'px';
            divlabel.style.display = 'block';

            var labeltext = this.freespots.toString();
            if (this.freespots <= 0) {
                labeltext = 'VOL';
            }

            this.divlabel_.innerHTML = labeltext;

            // bar
            var div = this.div_;
            div.style.left = (position.x - 15) + 'px';
            div.style.top = (position.y - 55) + 'px';
            div.style.display = 'block';

            var bardiv = this.bardiv_;
            bardiv.style.width = percentage.toString() + '%';
        }
    };

Chris Broadfoot

unread,
Jun 20, 2011, 6:49:50 AM6/20/11
to google-map...@googlegroups.com
Probably some sort of rounding error. Try rounding/flooring the point returned by fromLatLngToDivPixel.

--


--
You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group.
To view this discussion on the web visit https://groups.google.com/d/msg/google-maps-js-api-v3/-/mLZO3fJXQNsJ.
To post to this group, send email to google-map...@googlegroups.com.
To unsubscribe from this group, send email to google-maps-js-a...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en.

Reply all
Reply to author
Forward
0 new messages