Develop Reference

I don't want my Google Map to zoom to extent after user has zoomed in

I have created a map found here: http://userpages.flemingc.on.ca/~eluli/collab.html
Users can toggle between the different layers on the map. As you can see, whenever a user toggles at a new layer, the map extents to the new layer. How can I make so that this does NOT happen? For example, if a user has zoomed into a specific area, I want the map to remain at the same extent whenever a new layer is checked on.
I have written code which has the initial map extents (I deleted the extent in order to experiment but when I did that, the map does not show up).
function initialize() {
var ontario = new google.maps.LatLng(49.2867873, -84.7493416);
var mapOptions = {
zoom: 5,
center: ontario,
styles: ....
var kmlOptions = {
suppressInfoWindows: true,
preserveViewport: false,
map: map
};
//Layer 0
layers [0] = new google.maps.KmlLayer('https://docs.google.com/uc?authuser=0&id=0B79b02nBK5vkVGVwdnEtS1puTlE&export=download',
{preserveViewport: false, suppressInfoWindows: true});
//Layer 1
layers [1] = new google.maps.KmlLayer('https://docs.google.com/uc?authuser=0&id=0B79b02nBK5vkdE9DRmxzRHdCN28&export=download',
{preserveViewport: false, suppressInfoWindows: true});
.........................
Let me know if I need to show more of my code

{preserveViewport: true} will keep KmlLayer from zooming to fit its contents

OpenLayers WMS layer doesn't load

I use the following block of JavaScript to try to show a WMS layer. I'm using OpenLayers 2.8.
The map's base layer (Openstreetmap) shows correctly, it zooms to the correct area, the "pyramid" layer is shown in the layer switcher, but no request to its WMS service is ever made (so the fact that the URL, styles and params are dummies shouldn't matter -- it never even attempts to get them).
OpenLayers does try to get a WMS layer once I pan or zoom far enough so that the Gulf of Guinea is in view (but all my data is in the Netherlands). This suggests a projection problem (WGS84's (0, 0) point is there), but I don't understand why OpenLayers doesn't even try to fetch a map layer elsewhere. My data is in EPSG:3857 (Web Mercator) projection.
/*global $, OpenLayers */
(function () {
"use strict";
$(function () {
$(".map").each(function () {
var div = $(this);
var data_bounds = div.attr("data-bounds");
console.log("data_bounds: " + data_bounds);
if (data_bounds !== "") {
var map = new OpenLayers.Map(div.attr("id"), {
projection: "EPSG:3857"});
var extent = JSON.parse(data_bounds);
var bounds = new OpenLayers.Bounds(
extent.minx, extent.miny,
extent.maxx, extent.maxy);
map.addLayer(
new OpenLayers.Layer.OSM(
"OpenStreetMap NL",
"http://tile.openstreetmap.nl/tiles/${z}/${x}/${y}.png",
{buffer: 0}));
map.addLayer(
new OpenLayers.Layer.WMS(
"pyramid", "http://rasterserver.local:5000/wms", {
layers: "test",
styles: "test"
}, {
singleTile: true,
isBaseLayer: false,
displayInLayerSwitcher: true,
units: 'm'
}));
map.addControl(new OpenLayers.Control.LayerSwitcher());
map.zoomToExtent(bounds);
}
});
});
})();
Edit: the 'data_bounds' console print prints (with some added formatting):
data_bounds: {
"minx": 582918.5701295201,
"miny": 6923595.841021758,
"maxx": 821926.9006116659,
"maxy": 7079960.166533174
}
It zooms to the correct region in the north of the Netherlands, so I don't think the problem is there.
Since posting, I found out that if I don't use the OSM layer, and instead use the WMS layer as baselayer, it works. So perhaps there's some incompatibility with a OSM baselayer and a WMS layer added to it? But then I don't get that it does seem to do something near WGS84 (0, 0).

I eventually managed to fix this by giving the map an explicit maxExtent:
var extent = JSON.parse(data_bounds);
var bounds = new OpenLayers.Bounds(
extent.minx, extent.miny,
extent.maxx, extent.maxy);
var map = new OpenLayers.Map(div.attr("id"), {
projection: "EPSG:3857",
maxExtent: bounds
});
Oddly enough this doesn't limit the user's ability to pan and zoom around the world, but it does make the overlay work...

Projections and OpenLayers.Geometry.Point in openlayers

I'm trying to show a map with three layers (google maps layers, wms layer and points layer) this is my code:
var map = new OpenLayers.Map({
div: "map",
maxExtent: new OpenLayers.Bounds(-20037508, -20037508, 20037508, 20037508.34)
});
var capaGoogle = new OpenLayers.Layer.Google(
"Google Satellite",
{ type: G_SATELLITE_MAP, sphericalMercator: true, transparent: true }
);
var wmsOverlay = new OpenLayers.Layer.WMS("OpenLayers WMS",
"http://localhost:1979/geoserver/wms",
{ layers: 'world:PYCIUDADES', transparent: true }, { isBaseLayer: false });
var vectorLayer = new OpenLayers.Layer.Vector("vector");
vectorLayer.addFeatures([
new OpenLayers.Feature.Vector(
new OpenLayers.Geometry.Point(-57.635021, -25.276987)
),
new OpenLayers.Feature.Vector(
new OpenLayers.Geometry.Point(-56.759034, -22.71539)
)
]
);
map.addLayers([wmsOverlay, vectorLayer, capaGoogle]);
map.addControl(new OpenLayers.Control.LayerSwitcher());
var center = new OpenLayers.LonLat(-57.58, -25.27).transform(
new OpenLayers.Projection("EPSG:4326"),
map.getProjectionObject()
)
map.setCenter(center, 6);
the "vectorLayer" layer must be above of my map, but I get this (my wms layer is in south america, my points have to be also in south america, but they're near africa):
http://i45.tinypic.com/34y40zk.png
What can I do?
Thanks in advance

You should to transform your point's coordinates:
var epsg4326 = new OpenLayers.Projection('EPSG:4326');
var epsg900913 = new OpenLayers.Projection('EPSG:900913');
vectorLayer.addFeatures([
new OpenLayers.Feature.Vector(
new OpenLayers.Geometry.Point(-57.635021, -25.276987).transform(epsg4326, epsg900913)
),
new OpenLayers.Feature.Vector(
new OpenLayers.Geometry.Point(-56.759034, -22.71539).transform(epsg4326, epsg900913)
)
]);

"next to Africa" = longitude 0 latitude 0
when you simply enter Longitude and Latitude, OL considers this a WGS84 projection (standard).
but since you are using a Google layer (CapaGoogle), which is a mercator-referenced projection, you end up using two reference projections (4326 = WGS84 AND 900913 = mercator) simultaneously and the map server disconsiders the location of your markers, since they are "incorrect". therefore, it simply places them at (0,0).
as DrNextGIS said, you must "transform your points coordinates" so that everything on your map uses the same projection.
you would NOT have this problem if you were using a simple OpenLayer map (without Google or OSM).

Viewing vector overlay in an OpenLayers Map

I am new to creating maps using HTML and I have been attempting to add two vector layers (places, points) to a base map (roads), however I cannot see the vector layers on the map. The layers should appear as vector overlays to the base map. The layers are there as they are being shown in the layer switcher, but are not being displayed on screen. I believe the problem is to do with the way the vectors layers are being called. What is the solution to get the vector layers to be displayed. Thanks
var map = new OpenLayers.Map("map-id");
var roads= new OpenLayers.Layer.WMS(
"roads",
"http://localhost:8080/geoserver/wms",
{layers: "roads"});
var points= new OpenLayers.Layer.Vector(
"points",
"http://localhost:8080/geoserver/wms",
{layers: "points"});
var places= new OpenLayers.Layer.Vector(
"places",
"http://localhost:8080/geoserver/wms",
{layers: "places"});
map.addLayer(roads);
map.addLayer(points);
map.addLayer(places);
map.addControl(new OpenLayers.Control.LayerSwitcher());

You are trying to display your vector data through WMS protocol. For this purpose you should use OpenLayers.Layer.WMS instances instead OpenLayers.Layer.Vector. For displaying WMS layer as overlay use isBaseLayer option:
map = new OpenLayers.Map('map');
var places = new OpenLayers.Layer.WMS('places',
"http://localhost:8080/geoserver/wms",
{layers: "places", transparent: true},
{isBaseLayer: false, opacity: 1, singleTile: true, visibility: true}
);
map.addLayers([places]);

Preload a Google Maps overlay

I'm trying to use a Google Map as a background, with a fixed overlay. Have a look-see.
You can see the problem — whilst it's loading, the text is unreadable. The overlay is loaded by Google's JS. How can I hide the map until the overlay has loaded? (Or a better solution?)

Actually, you can use JavaScript to make sure the map only displays when the overlay is loaded:
document.observe('dom:loaded', function()
{
if (GBrowserIsCompatible()) {
var overlaySrc = 'img/contact_map_overlay.png';
var preloadOverlay = new Image();
preloadOverlay.onload = function() {
var map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(-33.82568, 151.2180955505371), 14, G_PHYSICAL_MAP);
var mapTypeControl = new GMapTypeControl();
var topRight = new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(80, 250));
map.addControl(new GSmallMapControl(), topRight);
var mapTarget = new GScreenOverlay(overlaySrc, new GScreenPoint(0.0, 0.0, 'fraction', 'fraction'), // screenXY
new GScreenPoint(0, 0), // overlayXY
new GScreenSize(1, 1, 'fraction', 'fraction') // size on screen
);
map.addOverlay(mapTarget);
var pin = new GIcon(G_DEFAULT_ICON);
pin.image = "img/pin.png";
pin.shadow = "no-shadow";
pin.iconSize = new GSize(34, 43);
markerOptions = {
icon: pin
};
var marker = new GMarker(new GLatLng(-33.82568, 151.240635), markerOptions);
map.addOverlay(marker);
}
preloadOverlay.src = overlaySrc;
}
});
Google simply displays the image from the server, so having it loaded into the cache before displaying the map will solve your problem.

I don't see any way in the v2 Api to either know when the overlay has loaded, or hide the map until it finishes the overlay.
The load() event fires before the overlays have finished loading. I notice the overlay is quite large at 684KB. A smaller overlay loads quicker.
You might also consider just putting a background image or something behind the contact us text which is being obscured (granted for only 5 seconds).