Demo

LocationBox JavaScript Demos

Add Cluster Layer By Category

Add Cluster Layer Pharmacy:     Add Cluster Layer Hospital:     Add Cluster Layer Grocery Store:  

Remove Layers:  

Instructions

Use the "Add" buttons to add layers by category on the map. Use "Remove" button to remove the layers.

See Category List for list of categories available.

See the JavaScript API for more information.

Source Code

The Javascript code for the above map is:

<script language="Javascript" 
	src="http://www.locationbox.com.tr/locationbox/services?
	Key=key&Cmd=APIV2&Typ=JS"></script>

<script language="JavaScript">
var mapper  = new IMapper();

var layer1 = new ILayer();
var layer2 = new ILayer();
var layer3 = new ILayer();

function startup() {
  mapper.initMap(41.1, 29.1, 10, IMapper.BASEMAP_POI);
  mapper.addNavigationPanel();
  return;
} 

function add1() {
  var vMarker = mapper.createVariableMarkerStyle();
  layer1.createClusterCategoryLayer("ECZANE", "eczler", null, true,vMarker, null,null,null, null);
  return;
} 

function add2() {
  var vMarker = mapper.createVariableMarkerStyle();
  layer2.createClusterCategoryLayer("HASTANE", "hstler", null, true,vMarker, null,null,null, null);
  return;
}

function add3() {
  var vMarker = mapper.createVariableMarkerStyle();
  layer3.createClusterCategoryLayer("MARKET", "mrkler", null, true,vMarker, null,null,null, null);
  return;
}

function remove() {
  layer1.removeLayer();
  layer2.removeLayer();
  layer3.removeLayer();
  return;
}

Buttons:

  <a href="javascript:add1()"><img src="images/add.gif" border=0></a>
  <a href="javascript:add2()"><img src="images/add.gif" border=0></a>
  <a href="javascript:add3()"><img src="images/add.gif" border=0></a>
  <a href="javascript:remove()"><img src="images/remove.gif" border=0></a>
Notes

You may get "Request string is too long for Oracle Maps' non-AJAX remoting" error while creating a layer. See this post on LocationBox blog.

Download working page
Remember that you need to use your key code as Key attribute.