Demo

LocationBox JavaScript Demos

Map Decoration

Add Map Decoration:   Show Map Decoration in Collapsible Window:   Remove Map Decoration:

Instructions

Use the "Add Map Decoration" button to add a predefined map decoration. Use the "Show Map Decoration in Collapsible Window" button to show the map decoration in a collapsible window. Customize your map decoration using html.
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 html = '';
   html += '<table style="background-color: #E0E0E0;">';
   html += '<tr><td>Company: </td><td>Infotech</td></tr>';
   html += '<tr><td>Address: </td><td>Şehit İlknur Keleş Sok. Dural Plaza Kozyatağı</td></tr>';
   html += '<tr><td>Tel No: </td><td>+90 216 362 0500</td></tr>';
   html += '</table>';
  

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

  function add() {
    mapper.addMapDecoration("id_1", html, 0.60, 0.01, 200, 200, null);
    return;
  } 

  function addCollapsible() {
    mapper.addCollapsibleMapDecoration("id_2", html, 200, 150);
    return;
  } 

  function remove() {
    mapper.removeMapDecoration("id_1");
    mapper.removeMapDecoration("id_2");
    return;
  }  
  
  </script>

Buttons:

  <a href="javascript:add()"><img src="images/add.gif" border=0></a>
  <a href="javascript:addCollapsible()"><img src="images/add.gif" border=0></a>
  <a href="javascript:remove()"><img src="images/remove.gif" border=0></a>
Download working page
Remember that you need to use your key code as Key attribute.