• bMap
• Examples
• Documentation
• Download
• Change Log
• Twitter
• Forum

bMap - Examples

Markers added in the constructor:

How its done:

The constructor accepts the markers option. This is an object, the most important property is the data array. The data property is an array of marker objects, these are immediately rendered on the map.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script src="http://maps.google.com/maps?file=api&v=2&key=YOUR_GOOGLE_KEY" type="text/javascript"></script>
<script src="jQuery.bMap.1.2.3.js" type="text/javascript"></script>
<script type="text/javascript">

$(document).ready(function(){ 
	$("#map1").bMap({
		mapZoom: 11,
		mapCenter:[51.501690392607,-0.1263427734375],
		markers:{"data":[ //How to immediately add markers to the map
			{
				"lat":51.49757618329838,
				"lng":-0.1746654510498047, 
				"title":"Science Museum", 
				"body":"Exhibition Road, London SW7"
			},{
				"lat":51.47769451182406,
				"lng":-0.0009441375732421875, 
				"title":"Royal Observatory Greenwich", 
				"body":"Blackheath Ave, Greenwich, London SE10"
			}	//keep adding as many markers as you need....
		]}
	});
});

</script>
<div style="width:80%;height:400px;margin:0 auto" id="map1">
</div>

bMap Constructor Marker Options:

markers:
	name			string		visual name for the layer, appears in layerbar
	type			string		describes the type of layer
	visible			string		("true"/"false") if the layer should start visible
	data			array		array of bMap marker objects, rendered as GMarkers
	icon			integer		renders the marker with a custom icon from the icons array