标记不适用于Google Maps V3

时间:2016-07-04 18:37:32

标签: javascript google-maps google-maps-api-3 google-maps-markers

所以这就是我如何尝试将标记放在我的地图上。正在加载地图,但标记不是。 在

var myLatLng = new google.maps.LatLng(27.681874953576184, 85.32536029815674);

      myMarker = new google.maps.Marker({
                  position: myLatLng,
                  map: map,
                });
        myMarker.setMap(map);

假设工作但不是。任何人都可以帮我指出我的错误吗?



 var myMarker;
    var myLatLng;
    var mapData = [];
    var markerArray = [];
    var map;
    var lcoationsArray = [];

    var infowindow = new google.maps.InfoWindow();
    var formStr = "<input type='text' id='text4mrkr' class='textinput textInput form-control' /><input type='button' class='btn btn-success' value='Add Bus Stop' onclick='addPlace();' />"

    var loadMap = function() {
      var myPosition = new google.maps.LatLng(27.685280944522653, 85.31990468502045);
      var mapOptions = {
        center: myPosition,
        zoom: 10,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        disableDefaultUI: true,
        clickable: true,
        scrollwheel: false,
        navigationControl: false,
        mapTypeControl: false,
        scaleControl: false,
        zoomControl: true
      };
      map = new google.maps.Map(document.getElementById("mapcontainer"), mapOptions);

      google.maps.event.addListener(map, 'click', function(event) {
        this.setOptions({scrollwheel:true});
      });
      google.maps.event.addListener(map, 'mouseover', function(event){
        self = this;
        timer = setTimeout(function() {
          self.setOptions({scrollwheel:true});
        }, 1000);
      });
      google.maps.event.addListener(map, 'mouseout', function(event){
        this.setOptions({scrollwheel:false});
        clearTimeout(timer);
      });


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

 
      var myLatLng = new google.maps.LatLng(27.681874953576184, 85.32536029815674);

      myMarker = new google.maps.Marker({
                  position: myLatLng,
                  map: map,
                });
        myMarker.setMap(map);
&#13;
html, body, #mapcontainer {
    height: 100%;
    width: 100%;
}
&#13;
   <script src = "http://maps.googleapis.com/maps/api/js"></script>
<div class="col-md-12" id = "mapcontainer" style = "height:580px;"></div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

您正在loadMap函数之外创建标记,因此在创建地图之前创建它(在onload事件触发时创建)。将标记创建移动到loadMap函数内。

&#13;
&#13;
var myMarker;
var myLatLng;
var mapData = [];
var markerArray = [];
var map;
var lcoationsArray = [];

var infowindow = new google.maps.InfoWindow();
var formStr = "<input type='text' id='text4mrkr' class='textinput textInput form-control' /><input type='button' class='btn btn-success' value='Add Bus Stop' onclick='addPlace();' />"

var loadMap = function() {
  var myPosition = new google.maps.LatLng(27.685280944522653, 85.31990468502045);
  var mapOptions = {
    center: myPosition,
    zoom: 10,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    disableDefaultUI: true,
    clickable: true,
    scrollwheel: false,
    navigationControl: false,
    mapTypeControl: false,
    scaleControl: false,
    zoomControl: true
  };
  map = new google.maps.Map(document.getElementById("mapcontainer"), mapOptions);

  google.maps.event.addListener(map, 'click', function(event) {
    this.setOptions({
      scrollwheel: true
    });
  });
  google.maps.event.addListener(map, 'mouseover', function(event) {
    self = this;
    timer = setTimeout(function() {
      self.setOptions({
        scrollwheel: true
      });
    }, 1000);
  });
  google.maps.event.addListener(map, 'mouseout', function(event) {
    this.setOptions({
      scrollwheel: false
    });
    clearTimeout(timer);
  });

  var myLatLng = new google.maps.LatLng(27.681874953576184, 85.32536029815674);

  myMarker = new google.maps.Marker({
    position: myLatLng,
    map: map,
  });
  myMarker.setMap(map);
};
google.maps.event.addDomListener(window, 'load', loadMap);


var myLatLng = new google.maps.LatLng(27.681874953576184, 85.32536029815674);

myMarker = new google.maps.Marker({
  position: myLatLng,
  map: map,
});
myMarker.setMap(map);
&#13;
html,
body,
#mapcontainer {
  height: 100%;
  width: 100%;
}
&#13;
<script src="http://maps.googleapis.com/maps/api/js"></script>
<div class="col-md-12" id="mapcontainer" style="height:580px;"></div>
&#13;
&#13;
&#13;