Open 422vishal opened 9 years ago
Try this
$scope.$watch('map.drawingManagerControl.getDrawingManager', function (val) {
if (!$scope.map.drawingManagerControl.getDrawingManager) {
return;
}
google.maps.event.addListener($scope.map.drawingManagerControl.getDrawingManager(), 'circlecomplete', function (e) {
console.log(e.getBounds());
});
});
Is there any dependency for using the above. It's leaving an error " Cannot read property 'getDrawingManager' of undefined "
My controller:-
demo = angular.module('myApplicationModule', ['uiGmapgoogle-maps']);
demo.controller('ExampleController', function ($scope) {
$scope.map = {
center: {
latitude: 44,
longitude: -108
},
zoom: 4
};
$scope.options = {
scrollwheel: true
};
$scope.circles = [
{
id: 1,
center: {
latitude: 40.1451,
longitude: -99.6680
},
radius: 500000,
stroke: {
color: '#08B21F',
weight: 2,
opacity: 1
},
fill: {
color: '#08B21F',
opacity: 0.5
},
events: {
center_changed: function () {
console.log("Done");
// var a = $scope.circles.getBounds();
}
},
geodesic: true, // optional: defaults to false
draggable: true, // optional: defaults to false
clickable: true, // optional: defaults to true
editable: true, // optional: defaults to false
visible: true // optional: defaults to true
}
];
$scope.marker = {
id: 0,
coords: {
latitude: 40.1451,
longitude: -99.6680
},
options: {
draggable: true
},
icon: {
url: "temop/download.png"
},
events: {
dragend: function () {
var lat = $scope.marker.getPosition().lat();
}
}
}
$scope.$watch('map.drawingManagerControl.getDrawingManager', function (val) {
if (!$scope.map.drawingManagerControl.getDrawingManager) {
return;
}
google.maps.event.addListener($scope.map.drawingManagerControl.getDrawingManager(), 'circlecomplete', function (e) {
console.log(e);
});
});
console.log($scope.circles);
});
$scope.map = {
center: {
latitude: 44,
longitude: -108
},
zoom: 4,
polyOptions: {
strokeWeight: 0,
fillOpacity: 0.45,
editable: true
},
//waypoints
drawingManagerOptions: {
drawingMode: null,
drawingControl: false,
drawingControlOptions: {
position: google.maps.ControlPosition.TOP_CENTER,
drawingModes: [
google.maps.drawing.OverlayType.CIRCLE,
google.maps.drawing.OverlayType.POLYGON,
google.maps.drawing.OverlayType.POLYLINE,
google.maps.drawing.OverlayType.RECTANGLE
]
},
rectangleOptions: this.polyOptions,
polygonOptions: this.polyOptions,
circleOptions: this.polyOptions
},
markersAndCircleFlag: true,
drawingManagerControl: {}
};
HTML
<ui-gmap-drawing-manager options="map.drawingManagerOptions" control="map.drawingManagerControl"></ui-gmap-drawing-manager>
remember libraries=drawing
<script src='http://maps.googleapis.com/maps/api/js?v=3.17&sensor=false&libraries=places,weather,geometry,visualization,drawing&language=en-US'></script>
How can I remove all shapes drawn in Drawing manager.
I need to include an option for user to be able to clear the map while drawing in map.
I do not find anything.
Are there any methods like getBound() and stuff for circles in angular-map. If so how to implement that?