如何使标记可拖动，标记和删除？使用Google Maps JavaScript API

Question

First of all, I know Google has documentation on how to complete all of these features, but even when I add the exact coding, the map no longer shows up, or it simply does not work. 首先，我知道Google拥有有关如何完成所有这些功能的文档，但是即使我添加了准确的编码，地图也不再显示，或者根本无法使用。

I'm completely new to development, but the project I'm trying to complete is a Game of Thrones map, where other users may visit and add a marker, name the marker ( not a simple one-character label, more like an actual name, several characters long ), and delete their marker. 我对开发完全陌生，但是我要完成的项目是《权力的游戏》地图，其他用户可以在其中访问并添加标记，为标记命名（不是简单的单字符标签，更像是实际的名称（长几个字符），然后删除其标记。 If someone else adds a marker, I'd like to be able to see it. 如果其他人添加了一个标记，我希望能够看到它。 And vice versa, I want everyone's markers on the map to be visible. 反之亦然，我希望每个人在地图上的标记都可见。

So far, as a first step, all I'm trying to complete right now is creating markers and making them draggable. 到目前为止，第一步，我现在要完成的就是创建标记并使它们可拖动。 The map shows up fine, until I add the value "draggable:true" to the markers options. 在我将值“ draggable：true”添加到标记选项之前，地图显示得很好。 even though that's what the google documentation suggests. 即使那是google文档的建议。

Here's the google documentation: https://developers.google.com/maps/documentation/javascript/markers 这是Google文档： https : //developers.google.com/maps/documentation/javascript/markers

And here's the page i'm trying to get the project to work on: http://jamie-jabbours-fabulous-project.webflow.io/ 这是我正在尝试让该项目进行工作的页面： http : //jamie-jabbours-fabulous-project.webflow.io/

and here's the exact code i'm using: 这是我正在使用的确切代码：

<!DOCTYPE html>
<html>
  <head>
    <style>
       #map {
        height: 400px;
        width: 100%;
       }
    </style>
  </head>
  <body>
    <h3>My Google Maps Demo</h3>
    <div id="map"></div>
    <script>
      function initMap() {
        var uluru = {lat: -25.363, lng: 131.044};
        var map = new google.maps.Map(document.getElementById('map'), {
          zoom: 4,
          center: uluru
        });
        var marker = new google.maps.Marker({
          position: uluru,
          map: map
          draggable: true
        });
      }
    </script>
    <script async defer
    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB55_iwgWvg1_NjoIEqqXgeQOeDBrq8p5o&callback=initMap">
    </script>
  </body>
</html>

I'm sure there is something very simple I'm doing wrong, but I can't see it. 我敢肯定我做错了很简单的事情，但我看不到。

Answer 1

Just add a comma..after map and before draggable 只需在map和draggable之前添加一个逗号..

 function initMap() {
    var uluru = {lat: -25.363, lng: 131.044};
    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 4,
      center: uluru
    });
    var marker = new google.maps.Marker({
      position: uluru,
      map: map,
      draggable: true
    });
  }

Watch out for syntax bugs next time :) 下次请注意语法错误：）

如何使标记可拖动，标记和删除？使用Google Maps JavaScript API

问题描述

1 个解决方案

解决方案1
0 已采纳 2018-02-15 13:07:11

如何使标记可拖动，标记和删除？ 使用Google Maps JavaScript API

问题描述

1 个解决方案

解决方案1 0 已采纳 2018-02-15 13:07:11

如何使标记可拖动，标记和删除？使用Google Maps JavaScript API

解决方案1
0 已采纳 2018-02-15 13:07:11