4

I'm stuck. My code works with OSM, but I need it to work with Google as well. The problem is simply that Google v3 and my other layers are not playing well together at all. They don't zoom together. My problem is specifically with OL 2.13 and 2.12, and it didn't start happening till about a month ago.

In the case of Google satellite, the layer doesn't zoom at all unless I pan the map. In the case of the others (hybrid, terrain, roads), they zoom, but the google layer and the other layers on the map zoom up to half a second apart from each other, and the layer "drifts" between zoom levels somewhat. It shows up markedly off by a few hundred feet and gets worse as I zoom in or out from the initial zoom level. (It appears to be correct at the initial zoom level).

The code that reproduces this is simple and derived directly from the WMS and Google v3 examples, but they appear not to work together well. Vector layers have the same behavior:

$(function() {
    var in_options = {
        internalProjection: new OpenLayers.Projection('EPSG:900913'),
        externalProjection: new OpenLayers.Projection("EPSG:4326")
    };

    var wkt = new OpenLayers.Format.WKT(in_options);
    var feature = wkt.read("POLYGON ((-78.9950752916525687 35.5198238058974169, -78.9950752916525687 36.0750238562958074, -78.2565296570171398 36.0750238562958074, -78.2565296570171398 35.5198238058974169, -78.9950752916525687 35.5198238058974169))");
    var bounds = feature.geometry.getBounds();

    var wms = new OpenLayers.Layer.WMS('Zoning', "/ga_resources/wms/", {

       styles: "styles/new-style",
       layers: "catalog/states/nc/counties/wake/zoning",
       transparent: true
    });

    var map = new OpenLayers.Map({ div:'map', projection: new            
        OpenLayers.Projection("EPSG:900913")
    });

    var layers = [
      new OpenLayers.Layer.Google("Google Physical", {type: google.maps.MapTypeId.TERRAIN}),
      new OpenLayers.Layer.Google("Google Streets",{numZoomLevels: 20}),
      new OpenLayers.Layer.Google("Google Hybrid",{type: google.maps.MapTypeId.HYBRID, numZoomLevels: 20}),
      new OpenLayers.Layer.Google("Google Satellite",{type: google.maps.MapTypeId.SATELLITE, numZoomLevels: 22}),
      wms
   ];

   map.addLayers(layers);
   map.addControl(new OpenLayers.Control.LayerSwitcher());
   map.zoomToExtent(bounds);
});
  • 1
    perhaps the reason it doesn't zoom until you pan is a focus issue. once you pan you have the focus on the map? As for the other issue I am betting is has something to do withprojection, instead of epsg 900913 try the epsg 3857. – Brad Nesom Jun 17 '13 at 20:14
  • I've tried both 3857 and 900913 to the same effect. I have also tried listing it without a projection. That's definitely not the problem. Also, it works fine with OSM layers and XYZ OSM layers from MapQuest. Good thought, though... – Jeff Heard Jun 18 '13 at 0:27
  • 2
    @JeffHeard: Your code looks ok, so I'm not sure where the problem is. Can you post a publicly accessible reproducible sample, maybe on jsfiddle? – Devdatta Tengshe Jun 18 '13 at 2:59
  • Does this happen after you resize the window, or parent container? – nagytech Jul 13 '15 at 23:47
1

Try adding

<meta http-equiv="cache-control" content="no-cache">

in the head of your html.

This will help you and stops shifting the layers at a certain level.

This is a common issue for the google layers.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.