geocubes - advanced map search

What is geocubes? Developers Pricing Twitter About us Create Account Sign in
geocubes Javascript example
API Reference Home:

 API Reference Home

client access:

 REST Interface
PHP Library

geocubes common:

 Javascript Example
Function Overview


Quick Links:
 Defects / Enhancements List
Manage Account
geocubes Javascript URL
Description:
You can integrate the Javascript API of geocubes to your existing website easily. Just copy the following code into the <head> area of your HTML code. The place where you also create your map object.

<script src="http://api.geocubes.com/api/geocubes.js?v=1" type="text/javascript"></script>
Please replace the Placeholders GOOGLE_MAPS_API_KEY and GEOCUBES_API_KEY!
complete integration example
<html>
<head>
<script src="http://maps.google.com/maps?file=api&v=2&key=GOOGLE_MAPS_API_KEY"
type="text/javascript"></script>
<script src="http://api.geocubes.com/api/geocubes.js?v=1" type="text/javascript"></script>
	
<script type="text/javascript">
var map;
	
function load() {
	
	if (GBrowserIsCompatible()) {
		
		map = new GMap2(document.getElementById("map"));
	
		map.addControl(new GSmallMapControl());
		map.addMapType(G_PHYSICAL_MAP);
		map.addControl(new GMapTypeControl());
	
		map.enableContinuousZoom();
		map.enableScrollWheelZoom();
	
		map.setCenter(new GLatLng(51.3, 10.5), 6);
	
	
		// example code

		var iconCluster        = new GIcon();
		iconCluster.image      = "http://api.geocubes.com/test/maps_grid.png";
		iconCluster.iconSize   = new GSize(64, 64);
		iconCluster.iconAnchor = new GPoint(32, 32);

		var iconSingle         = new GIcon();
		iconSingle.image       = "http://api.geocubes.com/test/maps_icon.png";
		iconSingle.iconSize    = new GSize(22, 24);
		iconSingle.shadowSize  = new GSize(32, 33);
		iconSingle.iconAnchor  = new GPoint(11, 24);

		var iconSingleOV       = new GIcon();
		iconSingleOV.image     = "http://api.geocubes.com/test/maps_iconov.png";

		var iconClusterOV      = new GIcon();
		iconClusterOV.image    = "http://api.geocubes.com/test/maps_gridov.png";
	

		var gc = new gcGrid(map, "GEOCUBES_API_KEY");
	
		gc.setOption(GC_OP_CLUSTERCOUNT, 1);
		gc.setVar(GC_VR_COUNTDESCR, " points");

		gc.setIcon(GC_IC_POINT, iconSingle);
		gc.setIcon(GC_IC_POINTMOUSEOVER, iconSingleOV);
		gc.setIcon(GC_IC_CLUSTER, iconCluster);
		gc.setIcon(GC_IC_CLUSTERMOUSEOVER, iconClusterOV);

		gc.enableRenderGrid();
	
	}
	
}
</script>
</head>

<body onload="load();" onunload="GUnload();">
<div id="map" style="height: 600px; width: 600px;"></div>
</body>
</html>