GoogleMaps：在用户点击时设置一个标记 [英] GoogleMaps: Setting a marker on user click

问题描述

目前我正尝试在用户点击的基础上设置地图上的标记。我尝试了所有我能想到的和没有作品的东西。看起来好像我的地图甚至没有检测到点击。目前，我正在努力保持脚本尽可能简单，我只是想在这一点上检测地图上的点击次数：

Currently I'm trying to set markers on a map based on user clicks. I have tried everything I can think of and NOTHING works. It seems as though my map doesn't even detect clicks. Currently, I'm trying to keep the script as simple as possible, I'm just trying to detect clicks on the map at this point:

<script type="text/javascript">
    function initialize() 
    {
        <!-- Set the initial location-->
        var latlng = new google.maps.LatLng(44, -71);

        <!-- initialization options -->
        var myOptions = {
            zoom: 8,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.HYBRID
        };

        <!-- The map variable
        var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
        <!-- END INITIALIZE -->
    }
    google.maps.event.addDomListener(window, 'load', initialize);

    function placeMarker(location) {
       var marker = new google.maps.Marker({
          position: location,
          map: map
       });
    }

    google.maps.event.addListener(map, 'click', function(event) {
       placeMarker(event.latLng);
    });
</script>

我在这类代码上试过这么多变体，每一个代码都不会工作。如果我将它更改为addDomListener（window，...），它可以工作，但从不使用地图作为侦听器。想法？

I've tried so many variants on this sort of code, every it never works. If I change it to "addDomListener(window, ...)" it works, but never using the map as the listener. Ideas?

编辑：好的，通过改变函数并改变它在脚本中的位置来解决它：

OK, solved it by changing the function somewhat and changing its location in the script:

<script type="text/javascript">
        function initialize() {
            <!-- Set the initial location -->
            var latlng = new google.maps.LatLng(44, -71);

            <!-- initialization options -->
            var myOptions = {
                minZoom: 3,
                zoom: 8,
                maxZoom: 9,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.HYBRID
            };  
            <!-- The map variable-->
            var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

            <!-- Add the functionality of placing a marker on a click-->
            google.maps.event.addListener(map, 'click', function(event) {
                var marker = new google.maps.Marker({
                    position: event.latLng,
                    map: map
                   });
                alert('You clicked the map.'+event.latLng);
            }); 
            <!-- END INITIALIZE -->
        }
        google.maps.event.addDomListener(window, 'load', initialize);

        <!-- Add the functionality of placing a marker on a click-->
        google.maps.event.addListener(map, 'click', function(event) {
            var marker = new google.maps.Marker({
                position: event.latLng,
                map: map
               });
            alert('You clicked the map.'+event.latLng);
        }); 
    </script>

推荐答案

我猜你把这段代码放在不适当的地方在不适当的时间做）。最近我遇到了同样的问题，需要一些时间来解决它。看看对我有用：

I guess you place this code in improper place (or do it in improper time). Recently I've encountered with the same problem and it took some time to solve it. Look what works for me:

var mapservice = {};

mapservice.map = {};
mapservice.options = {};
mapservice.putMarker = {};

mapservice.init = function (divName, textSearch)
{
    this.options =
    {
        center: new google.maps.LatLng(-34.397, 150.644),
        zoom: 8,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    this.map = new google.maps.Map($(divName)[0], this.options);

    google.maps.event.addListener(this.map, 'click', function (event)
    {
        mapservice.putMarker(event.latLng);
    });
    }
mapservice.putMarker = function (location)
{
//...
}

这篇关于GoogleMaps：在用户点击时设置一个标记的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！