javascript - Changing the Google Maps Marker HTML after a function is ran - Stack Overflow

admin管理员组

文章数量:1302273

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.

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);
        });
    }

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.

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);
        });
    }

• javascript
• google-maps-api-3

Share Improve this question Follow edited Sep 14, 2016 at 10:59 Danish Adeel 73044 gold badges1111 silver badges2727 bronze badges asked Nov 22, 2012 at 1:07 HondaKillrsxHondaKillrsx 34922 gold badges55 silver badges1111 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 11

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 plicated).

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);
      });
  }

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'>";

本文标签： javascriptChanging the Google Maps Marker HTML after a function is ranStack Overflow