i struggling positioning of image overlays (projection) on map, , both implementations have shortcomings nl.:
custom overlay views (as implemented @ maps api overlay example) gives me capability of customizing "onadd()" functions etc., has projection offset when drawing on map such:
ground overlays (as implemented @ maps api ground overlay example) displays positioning projection correct, has "refresh , positioning" problem (also described here) annoying , looks unprofessional. how thing looks while zoom in/out , overlay refreshes (if take printscreen):

i've tried adding custom overlay views , getting , using projection ("getprojection()") of ground overlay, no success far. here code snippet:
//constructor of image overlay class function imageoverlay(bounds,image,map) { // initialize properties. this.bounds_ = bounds; this.image_ = image; this.map_ = map; this.div_ = null; this.setmap(map); //make object of ground overlay projection later this.groundoverlay = new google.maps.groundoverlay(image,bounds); } //some other code, not important //redraw image every time zoom level changed imageoverlay.prototype.draw = function() { if(this.div_ != null) { //====== //normally used overlay views //====== // //get boundary corners - mercator projection /*var overlayprojection = this.getprojection(); //use projection of image overlay view var sw = overlayprojection.fromlatlngtodivpixel(this.bounds_.getsouthwest()); var ne = overlayprojection.fromlatlngtodivpixel(this.bounds_.getnortheast()); // resize image's div fit indicated dimensions. var div = this.div_; div.style.left = sw.x + 'px'; div.style.top = ne.y + 'px'; div.style.width = (ne.x - sw.x) + 'px'; div.style.height = (sw.y - ne.y) + 'px';*/ //this try var goprojection = this.groundoverlay.getprojection(); var gosw = goprojection.fromlatlngtodivpixel(this.bounds_.getsouthwest()); var gone = goprojection.fromlatlngtodivpixel(this.bounds_.getnortheast()); var div = this.div_; div.style.left = gosw.x + 'px'; div.style.top = gone.y + 'px'; div.style.width = (gone.x - gosw.x) + 'px'; div.style.height = (gosw.y - gone.y) + 'px'; } };
i appreciate please?
Comments
Post a Comment