Javascript 如何让标记显示在谷歌地图上

我正试图让标记显示在谷歌地图上。我已经看过这里的各种SO页面。你能告诉我在地图上显示标记的代码吗

我有一个Javascript：

function geoFindMe() {
  var output = document.getElementById("latlongdiv");

      if (!navigator.geolocation){
        output.innerHTML = "<p>Geolocation is not supported by your browser</p>";
        return;
      }

      function success(position) {
        var latitude  = position.coords.latitude;
        var longitude = position.coords.longitude;

        output.innerHTML = '<p>Latitude is ' + latitude + '° <br>Longitude is ' + longitude + '°</p>';

        var img = new Image();
        img.src = "https://maps.googleapis.com/maps/api/staticmap?center=" + latitude + "," + longitude + "&zoom=13&size=300x300&sensor=false";

        output.appendChild(img);
      };

      function error() {
        output.innerHTML = "Unable to retrieve your location";
      };

      output.innerHTML = "<p>Locating</p>";

      navigator.geolocation.getCurrentPosition(success, error);
    }

    // Function for adding a marker to the page.
        function addMarker(location) {
            marker = new google.maps.Marker({
                position: latlng,
                map: map
            });
        }

函数geoFindMe（）{
var输出=document.getElementById（“latlongdiv”）；
如果（！navigator.geolocation）{
output.innerHTML=“您的浏览器不支持地理位置”
”；
返回；
}
功能成功（职位）{
变量纬度=位置坐标纬度；
var经度=position.coords.longitude；
output.innerHTML='纬度为'+Latitude+'''”
经度为'+Latitude+'''”
；
var img=新图像（）；
img.src=”https://maps.googleapis.com/maps/api/staticmap?center=“+纬度+”、“+经度+”&zoom=13&size=300x300&sensor=false”；
输出。追加子项（img）；
};
函数错误（）{
output.innerHTML=“无法检索您的位置”；
};
output.innerHTML=“定位
”；
navigator.geolocation.getCurrentPosition（成功，错误）；
}
//用于向页面添加标记的函数。
功能添加标记（位置）{
marker=新的google.maps.marker({
位置：latlng，
地图：地图
});
}

以下是jsbin：

以下是我已经检查过的其他页面：

---

在成功回调中，您需要使用经度和纬度生成地图和标记对象

典型程序如下所示：

调用navigator.geolocation.getCurrentPosition（）

在getCurrentPosition（）的成功回调中

获取具有正确位置的地图对象：

var pos=新的google.maps.LatLng（position.coords.lation，position.coords.longitude）

变量映射选项={

缩放：13

中心：pos

})

var map=new google.maps.map（document.getElementById（'map-canvas'），mapOptions）

用地图生成一个标记

var marker=new google.maps.marker({

地图：地图

职位：pos

}))

以下是很好的参考：

---

更改图像url以添加标记，如下所示：

img.src=“+纬度+”，“+经度+”&缩放=13&size=300x300&sensor=false&markers=“+纬度+”，“+经度

请参阅。要在地图上放置标记，请使用标记=纬度、经度

标记

markers参数在一组位置定义一组一个或多个标记

代码片段：

函数geoFindMe（）{
var输出=document.getElementById（“latlongdiv”）；
如果（！navigator.geolocation）{
output.innerHTML=“您的浏览器不支持地理位置”
”；
返回；
}
功能成功（职位）{
变量纬度=位置坐标纬度；
var经度=position.coords.longitude；
output.innerHTML='纬度为'+Latitude+'''”
经度为'+Latitude+'''”
；
var img=新图像（）；
img.src=”https://maps.googleapis.com/maps/api/staticmap?markers=“+纬度+”、“+经度+”&zoom=13&size=300x300&sensor=false”；
输出。追加子项（img）；
}
函数错误（）{
output.innerHTML=“无法检索您的位置”；
}
output.innerHTML=“定位
”；
navigator.geolocation.getCurrentPosition（成功，错误）；
}
geoFindMe（）；
//用于向页面添加标记的函数。
功能添加标记（位置）{
marker=新的google.maps.marker({
位置：latlng，
地图：地图
});
}

---

您的示例几乎只是将“位置：latlng”更改为→ “position:pos”，对吗？谢谢。我打算明天做这件事。这里已经是午夜了，这很有效！非常感谢。你应该在这里享有更高的声誉。这不起作用。我不是JS类型的人，但我认为示例URL末尾的分号不应该出现。无论如何，谢谢。我以为你们能看到地图，只是你们不能放置标记。所以，如果地图不可见，您必须做3件事才能使代码正常工作。（1） 在正文中添加div（2）调用geoFindMe（）方法。您可以在addMarker（location）函数的末尾添加geoFindMe（）（3）修改image.src url以添加&markers=“+纬度+”，“+经度；这是jsbin是的，地图已经可见。它只是缺少标记。谢谢。