Google maps Google Maps API v3:marker-setImage在地图上设置多个标记

我有一张有一套记号笔的地图。每个标记都指定了一个侦听器（单击）。 单击事件触发器

setImage

methodofself，还应检查地图上是否存在相同的图像（分配给另一个标记）-如果是，则应使用另一张图片替换另一个标记图像

问题：执行

setImage

方法后，它将当前单击的图像填充到所有已单击的标记（标记存储为数组）。侦听器代码中有一个同步调用。代码包含几个RoR包装器

function initialize() {
  var myLatlng = new google.maps.LatLng(15.000, 0);
  var myOptions = {
    scrollwheel: false,
    center: myLatlng,
    zoom: 2,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };

  var map = new google.maps.Map(document.getElementById("map_canvas"),
      myOptions);

  var locations = <%= array_or_string_for_javascript(@locations) %>;

  var art_img = new google.maps.MarkerImage('<%= image_path(@artist.img_name + "_small.png") %>',
      new google.maps.Size(70, 61),
      new google.maps.Point(0,0),
      new google.maps.Point(0, 61));

  var shadow = new google.maps.MarkerImage('<%= image_path("flag_shadow.png") %>',
      new google.maps.Size(75, 75),
      new google.maps.Point(0,0),
      new google.maps.Point(-7, 72));
  var markers = [];
  var markers_tmp = [];
  <% @locations.each do |location| %>
    var location = <%= location %>;
    var image_url = location['result'];
    if (image_url == "") {
      image_url = '<%= image_path("flag_unselect.png") %>';
    }
    var image = new google.maps.MarkerImage(image_url,
        new google.maps.Size(70, 61),
        new google.maps.Point(0,0),
        new google.maps.Point(0, 61));

    var unsel_image = new google.maps.MarkerImage('<%= image_path("flag_unselect.png") %>',
        new google.maps.Size(70, 61),
        new google.maps.Point(0,0),
        new google.maps.Point(0, 61));

    var art_img = new google.maps.MarkerImage('<%= image_path(@artist.img_name + "_small.png") %>',
        new google.maps.Size(70, 61),
        new google.maps.Point(0,0),
        new google.maps.Point(0, 61));

    var myLatLng = new google.maps.LatLng(location['posx'], location['posy']);
    var marker = new google.maps.Marker({
        position: myLatLng,
        map: map,
        shadow: shadow,
        icon: image,
        zIndex: location['loc_id']
    });

    markers.push(marker);

    google.maps.event.addListener(marker, 'click', function() {

      $.__customStorage = {};
      $.ajax({
        url: "/main/get_current_artist",
        dataType: 'json',
        async: false,
        success: function(data) {
          $.__customStorage.ajaxResponse = data;
        }
      })
      var current_artist = '/assets/' + $.__customStorage.ajaxResponse + '_small.png';
      art_img.url = '/assets/' + $.__customStorage.ajaxResponse + '_small.png';

      for (var i = 0; i < markers.length; i++) {
        if (markers[i] == this) {
          markers[i].setIcon(art_img);
        }
      }

  });

  <% end %>
}
google.maps.event.addDomListener(window, 'load', initialize);

函数初始化（）{
var mylatng=new google.maps.LatLng（15.000,0）；
变量myOptions={
滚轮：错误，
中心：myLatlng，
缩放：2，
mapTypeId:google.maps.mapTypeId.ROADMAP
};
var map=new google.maps.map（document.getElementById（“map_canvas”），
肌肽）；
var位置=；
var art_img=新的google.maps.MarkerImage（“”，
新谷歌地图大小（7061），
新google.maps.Point（0,0），
新的google.maps.Point（0,61））；
var shadow=new google.maps.MarkerImage（“”，
新google.maps.Size（75,75），
新google.maps.Point（0,0），
新的google.maps.Point（-7,72））；
var标记=[]；
var标记_tmp=[]；
var位置=；
var image_url=location['result']；
如果（图像url==“”）{
图像url=“”；
}
var image=new google.maps.MarkerImage（image\u url，
新谷歌地图大小（7061），
新google.maps.Point（0,0），
新的google.maps.Point（0,61））；
var unsel_image=new google.maps.MarkerImage（“”，
新谷歌地图大小（7061），
新google.maps.Point（0,0），
新的google.maps.Point（0,61））；
var art_img=新的google.maps.MarkerImage（“”，
新谷歌地图大小（7061），
新google.maps.Point（0,0），
新的google.maps.Point（0,61））；
var mylatng=new google.maps.LatLng（location['posx']，location['posy']）；
var marker=new google.maps.marker({
职位：myLatLng，
地图：地图，
影子：影子，
图标：图像，
zIndex:location['loc_id']
});
标记器。推（标记器）；
google.maps.event.addListener（标记'click'，函数（）{
$.\uuu customStorage={}；
$.ajax({
url:“/main/get\u current\u artist”，
数据类型：“json”，
async:false，
成功：功能（数据）{
$.\uuu customStorage.ajaxResponse=数据；
}
})
var current_artist='/assets/'+$。uuu customStorage.ajaxResponse+''u small.png'；
art_img.url='/assets/'+$。uu customStorage.ajaxResponse+''u small.png'；
对于（var i=0；i

我发现在调用SetIcon之前，必须随时初始化MarkerImage对象。 所以我替换了addListener函数体：

google.maps.event.addListener(marker, 'click', function() {

  $.__customStorage = {};
  $.ajax({
    url: "/main/get_current_artist",
    dataType: 'json',
    async: false,
    success: function(data) {
      $.__customStorage.ajaxResponse = data;
    }
  })
  var current_artist = '/assets/' + $.__customStorage.ajaxResponse + '_small.png';
  art_img.url = '/assets/' + $.__customStorage.ajaxResponse + '_small.png';

  for (var i = 0; i < markers.length; i++) {
    if (markers[i] == this) {
      markers[i].setIcon(art_img);
    }
  }

});

google.maps.event.addListener（标记，'click'，函数（）{
$.\uuu customStorage={}；
$.ajax({
url:“/main/get\u current\u artist”，
数据类型：“json”，
async:false，
成功：功能（数据）{
$.\uuu customStorage.ajaxResponse=数据；
}
})
var current_artist='/assets/'+$。uuu customStorage.ajaxResponse+''u small.png'；
art_img.url='/assets/'+$。uu customStorage.ajaxResponse+''u small.png'；
对于（var i=0；i

使用代码：

    google.maps.event.addListener(marker, 'click', function() {

      $.__customStorage = {};
      $.ajax({
        url: "/main/get_current_artist",
        dataType: 'json',
        async: false,
        success: function(data) {
          $.__customStorage.ajaxResponse = data;
        }
      })
      var art_img = new google.maps.MarkerImage('/assets/' + $.__customStorage.ajaxResponse + "_small.png",
        new google.maps.Size(70, 61),
        new google.maps.Point(0,0),
        new google.maps.Point(0, 61));
      this.setIcon(art_img);              
      $.ajax({
        url: "/main/set_markers" + '?image=' + art_img.url + '&locid=' + this.zIndex,
        dataType: 'json'
      }).done(function() {
      });

      for (var i = 0; i < markers.length; i++) {
        if ((markers[i].zIndex != this.zIndex) &&
            (markers[i].icon.url == this.icon.url)) {
          var unsel_image = new google.maps.MarkerImage('<%= image_path("flag_unselect.png") %>',
              new google.maps.Size(70, 61),
              new google.maps.Point(0,0),
              new google.maps.Point(0, 61));
          markers[i].setIcon(unsel_image);
          $.ajax({
            url: "/main/set_markers_unsel" + "?markers_unsel=" + markers[i].zIndex,
            dataType: 'json'
          }).done(function() {
          });
        }
      }
  });

google.maps.event.addListener（标记，'click'，函数（）{
$.\uuu customStorage={}；
$.ajax({
url:“/main/get\u current\u artist”，
数据类型：“json”，
async:false，
成功：功能（数据）{
$.\uuu customStorage.ajaxResponse=数据；
}
})
var art_img=new google.maps.MarkerImage（'/assets/'+$。uuu customStorage.ajaxResponse+“_small.png”，
新谷歌地图大小（7061），
新google.maps.Point（0,0），
新的google.maps.Point（0,61））；
这是setIcon（艺术图像）；
$.ajax({
url:“/main/set_markers”+”？image='+art_img.url+'&locid='+this.zIndex，
数据类型：“json”
}).done（函数（）{
});
对于（var i=0；i

能否发布浏览器中的Javascript（如果需要，循环会缩短一点），而不是服务器端代码？这个问题是否与只推标记而不弹出标记有关？