Circle

A newer version of Maps for web SDK is available

A newer version of the SDK is available and is recommended for all users. Learn about the latest version, V2.0, in the Maps for web v2.0 documentation

Draw a circle on the map.

Parameters

Name	Description	default
center	`required` The center coordinate of the circle	/
map	`required` The map instance to which the marker attaches to	/
radius	`optional` `number` The radius of the circle (meters)	/
strokeColor	`optional` `string`The stroke color of the circle	'#3388ff'
strokeOpacity	`optional` `number` The opacity of the circle, in the middle of 0-1	1.0
strokeWeight	`optional` `number` The stroke weight of the circle	3
fillColor	`optional` `string` The fill color of the circle	'#3388ff'
fillOpacity	`optional` `number` The fill opacity of the circle	0.2
fill	`optional` `string` Whether to fill the path with color	false

Methods

Name	Description
enableEdit	To enable editing mode to the shape. (Not available for NextBillion.ai Maps GL)
remove	To remove the shape from the map

Example

1
var circle = new nextbillion.maps.Circle({
2
  center: { lat: 36.0671, lng: 120.3826 },
3
  map: map,
4
  radius: 600,
5
  color: 'red',
6
})
7

8
// To enable editing mode
9
// The method "enableEdit" is not available for NextBillion.ai Maps GL
10
circle.enableEdit()
11

12
// To remove from the map
13
circle.remove()