Demo

LocationBox JavaScript Demos

Add Campaign

Add Campaign Category (Electronics):   Add Campaign Category (Clothing):     Add Campaigns (All):     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=API&Typ=JS"></script>

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


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

function mouseClick(pos, info) {
  var html = '<table border="0" height="100%" width="100%">';
  for( var i = 0; i < info.data.length; i++ ) {
    var data = info.data[i];
    var color = "#BBBBBB";
    if( (i & 1) != 0 ) color = "#DDDDDD";
    html += '<tr bgcolor=' + color + '><td>' + data.name + '</td><td>' + data.value + '</td></tr>';
  } // for()
  html += '</table>';
  mapper.displayInfoWindow(pos.y, pos.x, html, 240, 100, "Bilgi: " + info.id);
  return;
}

    function add() {
    layer.createLayer(ILayer.CAMP_CATEGORY, "electronics", "CATEGORY = 'Elektronik'", null, null, true, mouseClick);
    return;
  } 
  
    function add2()  {
	layer2.createLayer(ILayer.CAMP_CATEGORY, "clothing", "CATEGORY = 'Giyim'", null, null, true, mouseClick);
	return;
  }	 
  
    function add3() {
    layer3.createLayer(ILayer.CAMP_CAMPAIGN, "campaignall", null, null, null, true, mouseClick);
    return;
  } 

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

Buttons:

  <a href="javascript:add()"><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.