【问题标题】:Changing google maps marker property after clicking button inside info window单击信息窗口内的按钮后更改谷歌地图标记属性
【发布时间】:2017-11-15 13:16:16
【问题描述】:

我在地图上有标记。我根据 JSON 中的日期设置标记的不透明度。

因此,当地图加载时,一些标记是 0.5 不透明度,一些是 1 不透明度。

在标记的信息窗口内有一个按钮。当我单击此按钮时,我想将不透明度更改为 1。

下面是我的代码的一些 sn-ps,向您展示我目前是如何设置它的。

任何帮助将不胜感激


//For every item in JSON
$.each(dbJSON, function(key, data) {

    var opacity = 1;
    var today = new Date();
    var fadeDate = new Date(data.last_rated); //get the date last rated                 
    fadeDate.setDate(fadeDate.getDate() + 1); //and add 1 date to it to specify the day when the icon should fade

    if(Date.parse(today) > Date.parse(fadeDate)) {
        console.log('fade');
        opacity = 0.5;
    } else {
        console.log('show');
        opacity = 1;
    }

    var postal_town = data.location;
    geocoder.geocode( { 'address': postal_town}, function(results, status) {
        //...
        console.log(opacity);

        var marker = new google.maps.Marker({
            map: map,
            position: results[0].geometry.location,
            title: data.manufacturer_name,
            icon: image,
            rating: data.rating,
            opacity: opacity
        });

        markers[data.id] = marker;

        marker.addListener('click', function() {

            var contentString = '<div id="content">'+
                '<h1>' + data.manufacturer_name + '</h1>' +
                '<button id="seen-it" data-rating="' + data.rating + '" data-entry-id="' + data.id + '">Seen it</button>' +
                '<p><strong>Rating: </strong><span id="rating">' + markers[data.id].rating + '</span></p>' +
                '</div>';

            infowindow.setContent(contentString);
            infowindow.open(map, marker);
        });
    });
});

//Do something when the #seen-it button is clicked
$(document).on('click', '#seen-it', function(event){
    //...
});

【问题讨论】:

    标签: javascript google-maps google-maps-api-3 infowindow


    【解决方案1】:

    由于您将标记的 id 存储在 data-entry-id 中,您可以使用(假设您的处理程序可以访问 markers 变量

    $(document).on('click', '#seen-it', function(event){
        var markerId = $(this).data('entry-id');
        markers[markerId].setOpacity(1);
    });
    

    【讨论】:

    • 这行得通,我不完全确定为什么! :) 谢谢
    • @OliverEvans 让我知道哪一部分让你感到困惑,我会尽力解释。
    • 没关系,我明白了。我以为您正在更改对象的不透明度值,而错过了您正在使用 setOpacity 方法。谢谢
    • @OliverEvans 完全正确。很高兴能提供帮助。
    猜你喜欢
    • 2020-11-30
    • 2016-08-26
    • 1970-01-01
    • 2011-08-21
    • 1970-01-01
    • 2015-10-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多