Uncaught ReferenceError: pos is not defined

Question

js:

var map;

function initialize() {
  $('#refreshmap').on('click',initialize);
  var mapOptions = {
    zoom: 6,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };


  map = new google.maps.Map(document.getElementById('map-canvas'),mapOptions);

  // Try HTML5 geolocation
  if(navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
      var pos = new google.maps.LatLng(position.coords.latitude,
                                       position.coords.longitude);

      map.setCenter(pos);
    }, function() {
      handleNoGeolocation(true);
    });
  } else {
    // Browser doesn't support Geolocation
    handleNoGeolocation(false);
  }

function handleNoGeolocation(errorFlag) {
  if (errorFlag) {
    var content = 'Error: The Geolocation service failed.';
  } else {
    var content = 'Error: Your browser doesn\'t support geolocation.';
  }

  var options = {
    map: map,
    position: new google.maps.LatLng(-29.3456, 151.4346),
    content: content
  };
  var infowindow = new google.maps.InfoWindow(options);
  map.setCenter(options.position);
}

var marker = new google.maps.Marker({
    position: pos,
    title: 'Position',
    map: map,
    draggable: true,
    visible:true
  });

 updateMarkerPosition(pos);
  geocodePosition(pos); 
   google.maps.event.addListener(marker, 'drag', function() {

    updateMarkerPosition(marker.getPosition());
  });
  $('#button').click(function(){
    marker.setVisible(true);  
  });

}

google.maps.event.addDomListener(window, 'load', initialize);

html:

<div id="map-canvas"></div> 
<button  type="button" id="button" class="map_buttons button_style">Add marker</button>

The above code is for display marker on current location by clicking a button.Map is showing the current location but marker is not working.

I am getting this error in console "Uncaught ReferenceError: pos is not defined".

In this line: `position: pos` during creation of the marker map, `pos` is undefined in the scope — karthikr, Jun 06 '13 at 13:41
read this http://stackoverflow.com/questions/500431/javascript-variable-scope — wirey00, Jun 06 '13 at 13:42

score 2 · Accepted Answer · answered Jun 06 '13 at 13:43

Try this:

var map;
var pos;
function initialize() {
    $('#refreshmap').on('click', initialize);
    var mapOptions = {
        zoom: 6,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };


    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

    // Try HTML5 geolocation
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function (position) {
            pos = new google.maps.LatLng(position.coords.latitude,
            position.coords.longitude);

            map.setCenter(pos);
        }, function () {
            handleNoGeolocation(true);
        });
    } else {
        // Browser doesn't support Geolocation
        handleNoGeolocation(false);
    }

    function handleNoGeolocation(errorFlag) {
        if (errorFlag) {
            var content = 'Error: The Geolocation service failed.';
        } else {
            var content = 'Error: Your browser doesn\'t support geolocation.';
        }

        var options = {
            map: map,
            position: new google.maps.LatLng(-29.3456, 151.4346),
            content: content
        };
        var infowindow = new google.maps.InfoWindow(options);
        map.setCenter(options.position);
    }

    var marker = new google.maps.Marker({
        position: pos,
        title: 'Position',
        map: map,
        draggable: true,
        visible: true
    });

    updateMarkerPosition(pos);
    geocodePosition(pos);
    google.maps.event.addListener(marker, 'drag', function () {

        updateMarkerPosition(marker.getPosition());
    });
    $('#button').click(function () {
        marker.setVisible(true);
    });

}

Basically, declare var pos in the global scope, and remove var while initializing pos

The issue is that

During creation of the marker object, pos is undefined in the scope

now it is giving me the error "Uncaught ReferenceError: updateMarkerPosition is not defined" — Monk L, Jun 06 '13 at 13:49
You have not declared a function with that name anywhere in the file. — karthikr, Jun 06 '13 at 13:52

score 1 · Answer 2 · answered Jun 06 '13 at 13:42

1

try to declare pos global, like your map

 var map;
 var pos;

answered Jun 06 '13 at 13:42

flow

4,828
6
26
41

Uncaught ReferenceError: pos is not defined

2 Answers2