<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>OpenLayers Mouseevents Example</title>
<link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
<link rel="stylesheet" href="style.css" type="text/css" />
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="../lib/OpenLayers.js"></script>
<script type="text/javascript">
var map;
function init(){
OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {
defaultHandlerOptions: {
'single': true,
'double': false,
'pixelTolerance': 0,
'stopSingle': false,
'stopDouble': false
},
initialize: function(options) {
this.handlerOptions = OpenLayers.Util.extend(
{}, this.defaultHandlerOptions
);
OpenLayers.Control.prototype.initialize.apply(
this, arguments
);
this.handler = new OpenLayers.Handler.Click(
this, {
'click': this.onClick,
'dblclick': this.onDblclick,
'rightclick': this.onRight,
'mouseup': this.onMouseup,
'mousedown': this.onMousedown
}, this.handlerOptions
);
},
onClick: function(evt) {
var msg = "click " + evt.xy;
console.log(msg);
},
onDblclick: function(evt) {
var msg = "dblclick " + evt.xy;
console.log(msg);
},
onRight: function(evt) {
var msg = "rightclick " + evt.xy;
console.log(msg);
OpenLayers.Event.stop();
},
onMouseup: function(evt) {
var msg = "mouseup " + evt.xy;
console.log(msg);
OpenLayers.Event.stop();
},
onMousedown: function(evt) {
var msg = "mousedown " + evt.xy;
console.log(msg);
OpenLayers.Event.stop();
}
});
var sngl = new OpenLayers.Control.Click({
handlerOptions: {
"single": true
}
});
var dbl = new OpenLayers.Control.Click({
handlerOptions: {
"single": false,
"double": true
}
});
var rght = new OpenLayers.Control.Click({
handlerOptions: {
"single": true,
"stopSingle": true
}
});
var mu = new OpenLayers.Control.Click({
handlerOptions: {
"single": true
}
});
var md = new OpenLayers.Control.Click({
handlerOptions: {
"single": true
}
});
map = new OpenLayers.Map(
'map',
{
controls: [
new OpenLayers.Control.Navigation({documentDrag: true}),
new OpenLayers.Control.KeyboardDefaults(),
new OpenLayers.Control.PanZoom(),
new OpenLayers.Control.ArgParser(),
new OpenLayers.Control.Attribution(),
],
projection: 'EPSG:900913',
units: 'm'
});
map.addControl(new OpenLayers.Control.LayerSwitcher());
map.addControl(sngl);
map.addControl(dbl);
map.addControl(rght);
map.addControl(mu);
map.addControl(md);
sngl.activate();
dbl.activate();
rght.activate();
mu.activate();
md.activate();
var gphy = new OpenLayers.Layer.Google(
"Google Physical",
{type: google.maps.MapTypeId.TERRAIN}
);
var gmap = new OpenLayers.Layer.Google(
"Google Streets", // the default
{numZoomLevels: 20}
);
var ghyb = new OpenLayers.Layer.Google(
"Google Hybrid",
{type: google.maps.MapTypeId.HYBRID, numZoomLevels: 20}
);
var gsat = new OpenLayers.Layer.Google(
"Google Satellite",
{type: google.maps.MapTypeId.SATELLITE, numZoomLevels: 22}
);
map.addLayers([gphy, gmap, ghyb, gsat]);
map.addControl(new OpenLayers.Control.LayerSwitcher());
map.setCenter(new OpenLayers.LonLat(-80,44).transform(
new OpenLayers.Projection("EPSG:4326"),
map.getProjectionObject()
),5);
}
</script>
</head>
<body onload="init()" style="padding:0;margin:0;">
<div id="map" style="margin:0;padding:0;width:100%;height:100%;"></div>
</body>
</html>