功能运行后更改Google Maps Marker HTML [英] Changing the Google Maps Marker HTML after a function is ran

问题描述

因此，我试图找出一种方法，在从数据库中提取Google Maps V3标记的HTML之后，但在将它们推送到阵列之前，更改它的HTML。

So I'm trying to figure out a way to change the HTML of Google Maps V3 markers after they have been pulled from the database but before they are pushed up to the array.

调用getFishing（）时，我想运行convertRate（rate），这样如果rate变量等于两个或更多，它会显示一张图片在标记本身的HTML中。我试过把它放在bindInfoWindow4（）中，我尝试了getFishing（）函数中的几个地方，但没有成功。有没有人做过这个？是否有可能在标记被推到fishArray之后？

When getFishing() is called, I'd like to run convertRate(rate) so that if the rate variable is equal to two or more, it shows a picture which is within the HTML of the Markers themselves. I've tried putting it in the bindInfoWindow4() and I've tried several places within the getFishing() function with no success. Has anyone done this before? Is it possible after the markers have been pushed up to the fishArray?

     function getFishing() {
        fishingUrl("XML_Fishing.php", function (data) {
            var xml = data.responseXML;
            var markers = xml.documentElement.getElementsByTagName("marker");
            for (var i = 0; i < markers.length; i++) {
                var id = markers[i].getAttribute("id");
                var title = markers[i].getAttribute("title");
                var rate = markers[i].getAttribute("rate");
                var Fishhtml = "<img id='1star' src='images/1star.png' style='visibility:hidden'>";
                var icon = FishingIcon;
                var Fishmark = new google.maps.Marker({
                    map: map,
                    position: point,
                    icon: icon.icon
                });
                fishArray.push(Fishmark);
                bindInfoWindow4(Fishmark, map, Fishinfo, Fishhtml);

            }
        });
    }
    function convertRate(rate) {
        if (rate >= 2) {
            document.getElementById("1star").style.visibility = 'visible';
        }
    }

    function bindInfoWindow4(marker, map, infoWindow, html) {
        google.maps.event.addListener(marker, 'click', function () {
            infoWindow.setContent(html);
            infoWindow.open(map, marker);
        });
    }

推荐答案

要显示保存在标记的成员变量中的HTML，可以随时更改它。如果InfoWindow处于打开状态，您可能需要关闭它并重新打开它（或更新其内容，但这会变得更复杂）。

If you change your click listener to display the HTML saved in a member variable of the marker, you can change it at any time. If the InfoWindow is open, you may want to close it and reopen it (or update its content in place, but that gets more complicated).

类似于： p>

Something like:

  function bindInfoWindow4(marker, map, infoWindow, html) {
      marker.myHtmlContent = html;
      google.maps.event.addListener(marker, 'click', function() {
        infoWindow.setContent(marker.myHtmlContent);
        infoWindow.open(map, marker);
      });
  }

然后通过更改marker.myHtmlContent中的值来更新内容。为了让它看起来像这样：

Then update the content by changing the value in marker.myHtmlContent. To make it visible, somthing like this:

  marker.myHtmlContent = "<img id='1star' src='images/1star.png' style='visibility:visible'>";

这篇关于功能运行后更改Google Maps Marker HTML的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！