Google Map v3 Getting center of circle? - google-maps-api-3

Question

i'm using google v3 js and i am trying to get the center of the circle whenever the person drag the circle or expand the circle. currently i do not know any event that is able to tigger that
<script type="text/javascript">
var latt = 1.3738459931841047;
var longg = 103.79745483398437;
var radius = 1000;
function alertame(lat, long) {
document.getElementById("<%= lblLatitute.ClientID %>").textContent = lat;
document.getElementById("<%= lblLongitude.ClientID %>").textContent = long;
latt = lat;
longg = long;
}
function show_alert() {
alert(latt + "hello"+radius);
}
function initialize() {
var myOptions = {
center: new google.maps.LatLng(1.3738459931841047, 103.79745483398437),
zoom: 11,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
var circleOptions = {
center: new google.maps.LatLng(latt, longg),
radius: radius,
map: map,
editable: true
};
var circle = new google.maps.Circle(circleOptions);
google.maps.event.addListener(circle, 'radius_changed', function () {
radius = circle.getRadius();
alert("test");
});
google.maps.event.addListener(circle, 'drag', function () {
alert("test");
});
circle.setMap(map);
}
</script>
<style type="text/css">
.style1
{
width: 124px;
}
</style>

Answer 1

Solved by using the below
<script type="text/javascript">
var latt = 1.3738459931841047;
var longg = 103.79745483398437;
var radius = 1000;
var marker;
function show_alert() {
alert(latt + "hello"+radius);
}
function initialize() {
document.getElementById("<%= lblLatitute.ClientID %>").textContent = latt;
document.getElementById("<%= lblLongitude.ClientID %>").textContent = longg;
document.getElementById("<%= lblRadius.ClientID %>").textContent = radius;
var myOptions = {
center: new google.maps.LatLng(1.3738459931841047, 103.79745483398437),
zoom: 12,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
var circleOptions = {
center: new google.maps.LatLng(latt, longg),
radius: radius,
map: map,
editable: true
};
var circle = new google.maps.Circle(circleOptions);
google.maps.event.addListener(circle, 'radius_changed', function () {
radius = circle.getRadius();
latt = circle.getCenter().lat();
longg = circle.getCenter().lng();
document.getElementById("<%= lblRadius.ClientID %>").textContent = radius;
});
marker = new google.maps.Marker({
map: map,
draggable: true,
animation: google.maps.Animation.DROP,
position: new google.maps.LatLng(latt, longg),
});
circle.setMap(map);
google.maps.event.addListener(marker, 'dragstart', function() {
circle.setMap(null);
});
google.maps.event.addListener(marker, 'dragend', function() {
latt= marker.getPosition().lat();
longg = marker.getPosition().lng();
circle.setCenter(new google.maps.LatLng(latt, longg));
document.getElementById("<%= lblLatitute.ClientID %>").textContent = latt;
document.getElementById("<%= lblLongitude.ClientID %>").textContent = longg;
circle.setMap(map);
});
}
function toggleBounce() {
}
</script>

Answer 2

In short:
var latitude = circle.center.lat();
var longitude = circle.center.lng();

Answer 3

I think you might be looking for the events center_changed and radius_changed.
You can find all available events on the events table of google.maps.Circle class documentation page.