根据变量实时更改信息窗口标记

如何根据值是true还是false来更改标记的图标。 我创建了一个if函数,用于检查CameraStatus的值。默认情况下,我将其设置为false,但是标记仍不会更改为RedStatus。当我尝试这样的计时器时,它的确更改为RedStatus:

setTimeout(function () { MiamiMarker.setIcon(RedStatus) },10 * 1000);

当我尝试这样做时,它不会更改为RedStatus:

        var CameraStatus = false;
        function CheckStatus() {
            if (CameraStatus === false) {
                MiamiMarker.SetIcon(RedStatus)
            }
        }

如何根据我的if函数更改标记? 最终,我想使用从家庭控制器获得的布尔值更改所有标记。布尔值应决定标记是否具有GreenStats或RedStatus图标。首先,我试图基于硬编码值更改一个标记。 (请参见下面的代码)

我的代码:

<script>
    var map;
    function initMap() {

        var CenterLoc = { lat: 51.34,lng: 5.53 };
        map = new google.maps.Map(document.getElementById('map'),{
                center: CenterLoc,disableDefaultUI: true,zoom: 3,});

        google.maps.event.addDomListener(window,'load',initMap);

        var Miami = { lat: 25.774266,lng: -80.193659 };
        var MiamiMarker = new google.maps.Marker
            ({
                position: Miami,map: map,icon: GreenStatus
            });

        //Replace standard google maps markers with collored dots 
        var GreenStatus = "@ViewBag.GreenStatus";
        var OrangeStatus = "@ViewBag.OrangeStatus";
        var RedStatus = "@ViewBag.RedStatus";

        var CameraStatus = false;
        function CheckStatus() {
            if (CameraStatus === false) {
                MiamiMarker.SetIcon(RedStatus)
            }
        }

        var MiamiInfoCard = new google.maps.InfoWindow
           ({
               content: '<div id="map-dialog"><h3>Miami</h3></div>'
           });

        MiamiMarker.addListener('click',function () {
            MiamiInfoCard.open(map,MiamiMarker);
        });

        var position = new google.maps.LatLng(52.2305,5.9924);

    }
</script>
linyilun 回答:根据变量实时更改信息窗口标记

您可以使用 if else语句更改图标。请注意,它是 .setIcon() ,而不是 *。SetIcon(),就像您的代码一样。

if (CameraStatus == false) {
        MiamiMarker.setIcon(RedStatus)
    } else {
        MiamiMarker.setIcon(GreenStatus)
    }

您可以选中此sample code来复制您在用例中想要的内容。

我使用toggle switch CameraStatus 设置值,并调用 CheckStatus()函数,并传递了变量 CameraStatus 和 MiamiMarker 将在函数中处理。

 var switchStatus = document.getElementById("mySwitch");
    var CameraStatus;
    switchStatus.addEventListener('change',function() {
        if (switchStatus.checked) {
            CameraStatus = false;

        } else {
            CameraStatus = true;
        }
        CheckStatus(CameraStatus,MiamiMarker);
    });

我将CheckStatus()函数放在initMap()函数之外,并通过CameraStatus和MiamiMarker来基于CameraStatus的值更改标记的图标

function CheckStatus(CameraStatus,MiamiMarker) {
    if (CameraStatus == false) {
        MiamiMarker.setIcon(RedStatus)
    } else {
        MiamiMarker.setIcon(GreenStatus)
    }

希望这会有所帮助!

本文链接:https://www.f2er.com/3111102.html

大家都在问