GMouseWheelControl
Get GMouseWheelControl
Since GMouseWheelControl is a custom control, you will need to download it from here and add it to your site, in order to use it in your map. Follow the instruction below and you will be able to add it to your map in minutes.
- Download GMouseWheelControl
- Unzip and store it in your site
- Link to control source code
Download GMouseWheelControl
Click on the link below to Download GMouseWheelControl.
Unzip and store it in your site
So, you have downloaded GMouseWheelControl already. Unzip the downloaded file and save the files in your site, where you normally store your Javascript source codes. It could be anywhere in your site. Once unzipped, you will notice that there is a folder that contains all the images that are used in GMouseWheelControl. Please keep the file structure as it is and do not rename any file or folder name including the Javascript source file for GMouseWheelControl. The folder containing the images must stay where the GMouseWheelControl script file is.
Link to control source code
The last part is to put a link to GMouseWheelControl script in your document header. There's nothing special that you will need to do in order to add the script to your webpage. You would add it just like including any other script file. Below is an example on how you can link to the source file of GMouseWheelControl.
<script type="text/javascript"
src="JS/GMouseWheelControl-V1.0/gmwControl-v1.0.js">
</script>
Once you have linked to the control source code, you are ready to add the control to your existing map. Take a look at the documentation on how to Add GMouseWheelControl to Google Map.
A Complete Example
Below is an example that adds GMouseWheelControl on a 450x300 map. You can look at this example and test it on your site, but you will have to replace the Google Map API Key and change the location to GMouseWheelControl source. For a complete reference, visit the Documentation of GMouseWheelControl.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Pman's Lab - Demo on how to add GMouseWheelControl</title>
<script src='http://maps.google.com/maps?file=api&v=2&key=abcdefg'
type='text/javascript'></script>
<script type="text/javascript" src="JS/GMouseWheelControl-V1.0/gmwControl-v1.0.js">
</script>
</head>
<body onload="init()" onunload="GUnload()">
<div id="myMap" style="width: 450px ; height:300px ;"></div>
<script type="text/javascript">
function init()
{
var map = new GMap2(document.getElementById("myMap"));
map.setCenter(new GLatLng(43.65872874896846, -79.37926769256592), 3);
var gmwControl = new GMouseWheelControl() ;
map.addControl(gmwControl) ;
}
</script>
</body>
</html>
