I have an OpenLayers map with a Google base layer and an OpenLayers vector layer on which people can draw their own bounding boxes using the DrawFeature control.
I have found that, as you zoom in, the vector is not plotted covering the same co-ordinates at each zoom level. Rather it seems to zoom at a different ratio to the underlying layer.
Strangely, if I resize the browser window, the vector then stays at a consistent position through all the zoom levels (i.e. becoming larger or smaller but covering the same geographic range, as one would want it to), but slightly offset from the position it was initially drawn at. The remains the case even if I make the browser window full size again.
See example below:
I draw a vector touching the Belgian border.
I zoom out and the vector is now well within Germany.
- I resize the browser window and the box anchors to a consistent set of co-ordinates but offset from its initial position, now overlapping the Belgian border
Please note that this is not the same issue as the vectors scrolling more slowly than the map when dragging the map. The vectors seem to stick to the same area when dragged, but zooming causes them to move relative to the underlying Google layer.
Is this a known issue and can anyone help resolve?
In answer to the question about my initialisation of the layers, my code is as follows:
var miny=-2000000; var minx=6000000; var maxy=600000; var maxx=10003750;
// allow testing of specific renderers via "?renderer=Canvas", etc
var renderer = OpenLayers.Util.getParameters(window.location.href).renderer;
renderer = (renderer) ? [renderer] : OpenLayers.Layer.Vector.prototype.renderers;
//define the layers needed
g_phys = new OpenLayers.Layer.Google("Google Physical",{type: google.maps.MapTypeId.TERRAIN, numZoomLevels:20}, {isBaseLayer:true});
g_sat = new OpenLayers.Layer.Google("Google Satellite",{type: google.maps.MapTypeId.SATELLITE, numZoomLevels:20},{isBaseLayer:true});
bboxes = new OpenLayers.Layer.Vector("Bounding Boxes", {rederers:renderer});
//delete feature on select
bboxes.events.on({"featureselected":function(e){bboxes.removeFeatures(e.feature); erasefeature(e);}});
//refresh on visibility change
bboxes.events.on({"visibilitychanged":refreshMap});
//do stuff on modification of vector
bboxes.events.on({"afterfeaturemodified":modbox});
//create new set of option for the map
var options = {
projection: new OpenLayers.Projection("EPSG:3857"),
units: "m",
maxResolution: "auto",
maxExtent: new OpenLayers.Bounds(miny, minx, maxy, maxx),
theme: null,
layers: [
//define the base layers for the map
g_phys,
g_sat,
bboxes
]
};
//create new map object based on "map" div
map=new OpenLayers.Map('map',options);