Demo

LocationBox JavaScript Demos

Draw Circle

Start:     Get Points:  

Instructions

Use the "Start" button to start drawing. Click to mark the center point of the circle, then drag to define radius.
Use the "Get Points" to get the coordinates of the center point and radius measurement in meters.
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();

  function startup() {
    mapper.initMap(41.1, 29.1, 7);
    mapper.addNavigationPanel();
    return;
  } 
	
  
  function start() {
    mapper.setCircleTool();
    return;
  } 

  function get() {
    var circle = mapper.getCircleData();
    alert("Circle x:" + circle.x + ", y: " + circle.y + ", radius: " + circle.radius);
    return;
  } 
  
  </script>

Buttons:

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