[jQuery] [Announce] Release of jMap2 API
Recently I have been so busy that I’ve been neglecting some of my code -
however this weekend I decided to make some amends for that. The most
requested piece of code I have released has been the jMaps plugin for
jQuery.
The last version I worked on, I tried to combine a single API for Google
Maps and Yahoo Maps. With this new release, I am focusing on Google
Maps only.
This is a re-write from scratch, hence the new version is jMap2. First
of all, you need to grab the code - I’m now hosting it in my local
repository, and I’ll work on removing the Google Code page.
Download:
You can either download the release directly - jMap2 Alpha 1:
http://hg.pastemonkey.org/jmaps/archive/tip.tar.gz
or
http://hg.pastemonkey.org/jmaps/archive/tip.zip
Or you can grab the file from the mercurial repository:
hg clone http://hg.pastemonkey.org/jmaps jmap2
Below is a basic introduction to jMap2 - one thing I have been lacking
has been documentation, and I’d like to amend this at a later date, but
for now hopefully below will be enough to get you started.
API
$('#div').jmap(options, callback);
This is the initial function to use with jMap2. This will initialise a
GMap2 object and attach it to the selected DIV element. The map has
some default options that you can override:
$.jmap.defaults = {
// Initial type of map to display
// Options: "map", "sat", "hybrid"
mapType: "map",
// Initial map center
mapCenter: [55.958858,-3.162302],
// Initial map size
mapDimensions: [400, 400],
// Initial zoom level
mapZoom: 12,
// Initial map control size
// Options: "large", "small", "none"
mapControlSize: "small",
// Initialise type of map control
mapShowType: true,
// Initialise small map overview
mapShowOverview: true,
// Enable map dragging when left button held down
mapEnableDragging: true,
// Enable zooming with scroll wheel
mapEnableScrollZoom: false,
// Enable smooth zoom
mapSmoothZoom: true,
// Enable Google Bar
mapEnableGoogleBar: false
}
For example, to overide the map type, you simply pass:
$('#map').jmap({mapType: "hybrid"});
$('#map').markerManager();
The markerManager function creates a Google marker manager object, if
you create this all your markers will be added to it, otherwise they can
be directly rendered.
$('#map').addMarker(options, callback);
This allows you to add a marker to the map. It is called from other
functions such as searchAddress(). To add a point, you pass in
paramters to the function:
$('#map').addMarker({pointlat: 53, pointlng: -3});
There are other options to pass in, check the code to see them.
$('#map').createGeoCache();
This function creates a Geocoder Cache.
$('#map').createGeoCoder(cache);
Creates a GeoCoder object. The cache is optional.
$('#map').searchAddress(options, pass, callback);
Allows you to pass in an address and get a returned Geocode object. You
can optionally pass to addMarker() to add to the map as a marker:
$('#map').seachAddress({address: "Edinburgh Castle, Edinburgh",
addMarker: true, {isdraggable: true});
The above for example will search for Edinburgh Castle, add a tmarker
and allow it to be draggable (via the addMarker options).
This is all I’ve got so far, but I feel it is a good start towards a
new, more stable API.
Feel free to leave comments, I’d love to hear your opinions - especially
on what features to concentrate on and any optimization of code. Have fun!
--
[[[ Tane Piper ]]]
Blog - http://digitalspaghetti.me.uk
This email is: [ x ] blogable [ ] ask first [ ] private