Demo

LocationBox JavaScript3D Demos

Add Custom Marker

Add:     Remove:  

Instructions

Use the "Add" button to add marker to a particular point on the map. Use "Remove" button to remove the marker. Create a custom marker using any image.
See the JavaScript3D 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=API3D
    &Typ=JS"></script>
    
  <script language="JavaScript">
  var mapper  = new IMapper();

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

  function add() {
    mapper.addCustomMarker('id_1', 41.1, 29.1, 'http://www.locationbox.com.tr/images/small_circle.png');
    return;
  } 

  function remove() {
    mapper.removeCustomMarker('id_1');
   
    return;
  } 
  
  </script> 
  <style type="text/css">
		
		div.broken,
		div.missing {
			margin: auto;
			position: relative;
			top: 50%;
			width: 193px;
		}
		div.broken a,
		div.missing a {
			height: 63px;
			position: relative;
			top: -31px;
		}
		div.broken img,
		div.missing img {
			border-width: 0px;
		}
		div.broken {
			display: none;
		}
		div#map {
			cursor: default;
			height: 425px;
			width: 652px;
		}
		
       </style>

Buttons:

  <a href="javascript:add()"><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.
Remember also you have to download unity player to use 3D mapping.