添加基本​​標記到谷歌地圖api v3

Question

我正在嘗試為自定義的Google地圖API v3添加標記。 地圖顯示正常但我似乎無法添加標記。 這似乎是一件基本的事情，但我一直陷入困境。 我已嘗試按照https://developers.google.com/maps/documentation/javascript/overlays#AddingOverlays上的說明操作

但是，我對javascript和API的了解非常有限，所以我覺得必須缺少一些基本的東西。 基本的說法，Google指令可能不會涵蓋它。 缺少冒號，支架。 也許變量序列錯誤？ 任何輸入非常感謝！ 這是下面的代碼：

<script type="text/javascript">
function initialize() {

    var myLatlng = new google.maps.LatLng(51.60505, -0.18989);

    var mapOptions = {
        center: myLatlng,
        zoom: 18,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      };

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

    //the code for the marker, as copy pasted from google
    var marker = new google.maps.Marker({
        position: myLatlng,
        title:"Hello World!"
    });

    var styles = [
      {featureType: "landscape",
        stylers: [
          { color: "#378fb5" }
        ]
      },{
       ETC
       ETC
       ETC
        }
   ];

    map.setOptions({styles: styles});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>

Answer 1

你需要打電話

marker.setMap(map)

在你創建之后，即

<script type="text/javascript">
function initialize() {

var myLatlng = new google.maps.LatLng(51.60505, -0.18989);

var mapOptions = {
    center: myLatlng,
    zoom: 18,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };

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

//the code for the marker, as copy pasted from google
var marker = new google.maps.Marker({
    position: myLatlng,
    title:"Hello World!"
});

// Add the marker to the map
marker.setMap(map);

var styles = [
  {featureType: "landscape",
    stylers: [
      { color: "#378fb5" }
    ]
  },{
   ETC
   ETC
   ETC
    }
];

map.setOptions({styles: styles});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>

Answer 2

你必須精確地想要用於標記的地圖，如下所示：

var marker = new google.maps.Marker({
    map: map,
    position: myLatlng,
    title:"Hello World!"
});

祝你今天愉快 ！

Answer 3

如果要將標記拖放到所需位置，請設置draggable = true。

var marker = new google.maps.Marker（{map：map，draggable：true}）;