-
Notifications
You must be signed in to change notification settings - Fork 0
dansdom/plugins-googlemap
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
Googlemap Plugin - v1.2
v 1.0 - basic functionality, custom pins, custom events, markerclusterer plugin, map options and info windows
v 1.1 - fixed bug with geolocation
- added option to 'track' the user on the map. this will add a center pin, on a given time period it will update the maps center position
- fixed issues with the definition of the center pin. now you can define your own center pin
- renaming a few variables so that they make a little more sense
- combined mapCenter and trackLocation variables :)
v 1.3 - added an option in the pin to add a custom function for that pin which is not a map event. Originally for changing the pin marker image on the fly.
- the first thing is the pass the pin through, then maybe pass some options
This plugin allows a developer to drop in a generic googlemap into any page very easily.
There are a number of default map settings, but they can be overwritten and added to depending on the map requirements.
You can set the center of the map, and a pin on the centre too.
There are options to have custom pins.
The markers are defined as an array of pins.
Each pin object has a title, lat, lng, custom pin reference, and an infoWindow HTML string.
Implementation is as easy as:
$(document).ready(function(){
$("#mapPane").MapMe({
options: go here
});
});
Custom Pin:
for each custom pin the setting can be turned off by using "false",
required: lat and lng
example of a custom pin:
{
title: 'Bondi Beach',
lat: -33.890542,
lng: 151.274856,
pin: "myCustomPin",
infoWindow: "<h1>Bondi Info Window Content</h1><p>lorem ipsum</p>",
pinEvent: {
'click': function(){alert("you clicked me!");},
'mouseover' : function(){console.log("you moused over me!");}},
pinFunction: {foo();}
}
if markerCluster is set to true, then the markers on the page will be clustered using the marker cluster script.
this script needs to be included in the HTML
these clusters can be styled using the markerClusterOptions object.
Styles for marker clusters:
'gridSize': (number) The grid size of a cluster in pixels.
'maxZoom': (number) The maximum zoom level that a marker can be part of a cluster.
'zoomOnClick': (boolean) Whether the default behaviour of clicking on a cluster is to zoom into it.
'averageCenter': (boolean) Wether the center of each cluster should be the average of all markers in the cluster.
'minimumClusterSize': (number) The minimum number of markers to be in a cluster before the markers are hidden and a count is shown.
'styles': (object) An object that has style properties:
'url': (string) The image url.
'height': (number) The image height.
'width': (number) The image width.
'anchor': (Array) The anchor position of the label text.
'textColor': (string) The text color.
'textSize': (number) The text size.
'backgroundPosition': (string) The position of the backgound x, y. About
an easy to use googlemap plugin that drops a googlemap onto the page
Resources
Stars
Watchers
Forks
Releases
No releases published
Packages 0
No packages published