SOURCE

G7SMap.init({
    id: 'map',
    key: {
        'bmap': 'ebAmxZxmn8hHBm1anhEcTH8j',
      	'gmap': 'AIzaSyBdZt3pUFIFTWKlHqUA_m6GJo_V--k84KU'
    },
  	center: [116.3702520000, 39.8890690000],
    zoom: 12
}).then(function (map) {
  	// map即为初始化完成的 G7SMap 地图实例对象
    
		var point = new G7SMap.Point(116.3738450000, 39.9497120000);
		var circle = new G7SMap.Circle(point,1000);
  	var editable = true;
  
  	document.querySelector('.add-circle').addEventListener('click', function () {
      	map.addOverlay(circle);
    });
  
  	document.querySelector('.remove-circle').addEventListener('click', function () {
        map.removeOverlay(circle);
    });
  
  	document.querySelector('.show-circle').addEventListener('click', function () {
      	circle.show();
    });
  
  	document.querySelector('.hide-circle').addEventListener('click', function () {
        circle.hide();
    });
  
  	document.querySelector('.get-options').addEventListener('click', function () {
        alert(JSON.stringify(circle.getOptions()));
    });
  
  	document.querySelector('.set-options').addEventListener('click', function () {
        circle.setOptions({
          	strokeColor: '#276D2A',
          	fillColor: '#276D2A',
          	strokeWeight: 2,
          	strokeOpacity: 1,
          	fillOpacity: 0.5,
          	strokeStyle: 'dashed'
        });
    });
  
  	document.querySelector('.get-center').addEventListener('click', function () {
        alert(circle.getCenter().toString());
    });
  
  	document.querySelector('.set-center').addEventListener('click', function () {
      	var point = new G7SMap.Point(116.4738450000, 39.9497120000);
      
      	circle.setCenter(point);
    });
  
  	document.querySelector('.get-radius').addEventListener('click', function () {
        alert(circle.getRadius());
    });
  
  	document.querySelector('.set-radius').addEventListener('click', function () {
        circle.setRadius(1500);
    });
  
  	document.querySelector('.get-path').addEventListener('click', function () {
        alert(JSON.stringify(circle.getPath()));
    });

  	document.querySelector('.set-editable').addEventListener('click', function () {
    		circle.setEditable(editable);
      	editable = editable ? false : true;
    });
  
  	document.querySelector('.get-bounds').addEventListener('click', function () {
        alert(JSON.stringify(circle.getBounds()));
    });
  
  	document.querySelector('.is-has').addEventListener('click', function () {
      	var point = new G7SMap.Point(116.3738450000, 39.9497120000);
      
        alert(circle.isContainsPoint(point));
    });
});

<div id="map" class="map"></div>
<div>
  <button class="add-circle">添加circle</button>
  <button class="remove-circle">移除circle</button>
  <button class="show-circle">显示circle</button>
  <button class="hide-circle">隐藏circle</button>
</div>
<div style="margin-top: 10px;">
  <button class="get-options">getOptions</button>
  <button class="set-options">setOptions</button>
  <button class="get-center">getCenter</button>
  <button class="set-center">setCenter</button>
  <button class="get-radius">getRadius</button>
  <button class="set-radius">setRadius</button>
</div>
<div style="margin-top: 10px;">
  <button class="get-path">getPath</button>
  <button class="set-editable">setEditable</button>
  <button class="get-bounds">getBounds</button>
  <button class="is-has">isContainsPoint</button>
</div>

.map {
  max-width: 800px;
  height: 500px;
}
.result {
  color: #f60;
}