Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • How to draw radius around a point in Google Map?

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 1
    • 0
    • 6.50k
    Comment on it

    Draw radius around a point in Google Map

    I want to add 10 miles radius around each marker. This is a very good example which will explain you how it works : https://www.freemaptools.com/radius-around-point.htm . This example will show you that how they are using markers with radius. So this is the way to achieve it:

    i) First create object called Circle, then further use the bindTo() to tie it to the position of the marker.

    // Create marker 
    var marker = new google.maps.Marker({
      map: map,
      position: new google.maps.LatLng(53, -2.5),
      title: 'Some location'
    });
    
    // Add circle overlay and bind to marker
    var circle = new google.maps.Circle({
      map: map,
      radius: 16093,    // 10 miles in metres
      fillColor: '#AA0000'
    });
    circle.bindTo('center', marker, 'position');

    For further help you can download the source code by clicking on the download link:

    Download

    Thanks for reading the blog.

    How to draw radius around a point in Google Map?

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: