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);});
أكثر...
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);});
أكثر...