Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Google maps api v3 DrawingManager no work

I'm trying to use the Google Maps APIs v3 but I have always an error

I added the script in the page:

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=drawing"></script>

and I've implemented:

var drawingManager = new google.maps.drawing.DrawingManager({
      drawingMode: google.maps.drawing.OverlayType.MARKER,
      drawingControl: true,
      drawingControlOptions: {
        position: google.maps.ControlPosition.TOP_CENTER,
        drawingModes: [google.maps.drawing.OverlayType.MARKER, google.maps.drawing.OverlayType.CIRCLE]
      },
      /*markerOptions: {
        icon: new google.maps.MarkerImage('http://www.example.com/icon.png')
      },*/
      circleOptions: {
        fillColor: '#ffff00',
        fillOpacity: 1,
        strokeWeight: 5,
        clickable: false,
        zIndex: 1,
        editable: true
      }

I got the same error always:

Uncaught TypeError: Cannot read property 'DrawingManager' of undefined

like image 775
ralph Avatar asked Feb 24 '12 16:02

ralph


2 Answers

'The concepts within this document refer to features only available within the google.maps.drawing library. This library is not loaded by default when you load the Maps Javascript API but must be explicitly specified through use of a libraries bootstrap parameter: '

http://maps.googleapis.com/maps/api/js?sensor=false&libraries=drawing

like image 96
Ray Suelzer Avatar answered Nov 12 '22 03:11

Ray Suelzer


use this:

<script async defer src="https://maps.googleapis.com/maps/api/js?libraries=geometry,drawing&key=YOURKEY&v=3&callback=initMapfUNCTION"></script>

YOURKEY ==> replace this word with your Map API Key initMapfUNCTION ==> replace this word with the name of your initial function to your map

like image 22
محمد صبرى فضه Avatar answered Nov 12 '22 03:11

محمد صبرى فضه