LCircle
> Draw a path in the shape of a circle around a center positioned at latLng coordinates
## Demo
> 示例链接：[https://codesandbox.io/s/dspvk](https://codesandbox.io/s/dspvk)
```html
<template>
<l-map style="height: 350px" :zoom="zoom" :center="center">
<l-tile-layer :url="url"></l-tile-layer>
<l-circle
:lat-lng="circle.center"
:radius="circle.radius"
:color="circle.color"
/>
</l-map>
</template>
<script>
import {LMap, LTileLayer, LCircle} from 'vue2-leaflet';
export default {
components: {
LMap,
LTileLayer,
LCircle
},
data () {
return {
url: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
zoom: 8,
center: [47.313220, -1.319482],
circle: {
center: [47.413220, -1.0482],
radius: 4500,
color: 'red'
}
};
}
}
</script>
```
## [#](https://vue2-leaflet.netlify.app/components/LCircle.html#props)Props
| Prop name | Description | Type | Values | Default |
| ------------------- | ---------------------------------------------------- | ------------- | ------ | ------------- |
| pane | | string | - | 'overlayPane' |
| attribution | | string | - | null |
| name | | string | - | undefined |
| layerType | | string | - | undefined |
| visible | | boolean | - | true |
| interactive | | boolean | - | true |
| bubblingMouseEvents | | boolean | - | true |
| lStyle | | object | - | null |
| stroke | | boolean | - | true |
| color | | string | - | '#3388ff' |
| weight | | number | - | 3 |
| opacity | | number | - | 1.0 |
| lineCap | | string | - | 'round' |
| lineJoin | | string | - | 'round' |
| dashArray | | string | - | null |
| dashOffset | | string | - | null |
| fill | | boolean | - | true |
| fillColor | | string | - | '#3388ff' |
| fillOpacity | | number | - | 0.2 |
| fillRule | | string | - | 'evenodd' |
| className | | string | - | null |
| radius | | number | - | null |
| options | Leaflet options to pass to the component constructor | object | - | {} |
| latLng | | object\|array | - | () => [0, 0] |
## [#](https://vue2-leaflet.netlify.app/components/LCircle.html#events)Events
| Event name | Type | Description |
| -------------- | ------- | -------------------------------------------------- |
| update:visible | boolean | Triggers when the visible prop needs to be updated |
| ready | object | Triggers when the component is ready |
## [#](https://vue2-leaflet.netlify.app/components/LCircle.html#slots)Slots
| Name | Description | Bindings |
| ------- | ----------- | -------- |
| default | | shi