在我的Jvectormap的Chrome中没有显示悬停功能

时间:2013-03-26 15:48:39

标签: javascript jquery google-chrome jvectormap

无法弄清楚为什么只有Chrome不起作用,它在IE和Firefox中运行良好。

$(function () {
$('#jvectormap-mill').vectorMap({
    map: 'world_mill_en',
    backgroundColor: 'white',
    regionStyle: {
        initial: {
            fill: '#002d62'
        },
        hover: {
            fill: '#FEC057',
            "fill-opacity": 1
        }
    },
    series: {
        regions: [{
            scale: ['#00B5E6'],
            attribute: 'fill',
            values: SavillePartnerArray()
        }]
    },
    onRegionLabelShow: function (e, label, code) {
        for (var partner in SavillePartners) {
            if (partner == code) {

                $("#jvectormap-label").position = e.position;
                return false;
            }
        }
    },
    onRegionOver: function (e, code) {
        var label = $("#jvectormap-label");
        var region = $(".jvectormap-region[data-code='" + code + "']");

        for (var partner in SavillePartners) {
            if (partner == code) {
                var Title = SavillePartners[code].name;

                // Create HTML 
                var stringHtml = '<div class="jvectormap-label2"><div id="titleTextbox"><span id="titleSpan">' + Title + '</span></div><div class="globeLogoDiv"><img src="/images/international-partner-logos/saville-globe.jpg" alt="globe"/></div><div class="savilleLogoDiv"><img src="/images/international-partner-logos/saville-logo.jpg" alt="savilleconsulting" class="savilleLogoImg"/></div>';
                if (SavillePartners[code].accreditedTrainer == 1) {
                    stringHtml = stringHtml + '<div class="internationalPartnersContainer"><div class="internationalContainer"><strong>INTERNATIONAL</strong></div><div class="partnersContainer">PARTNER</div></div><div class="accreditedTrainerContainer" ><div class="accreditedContainer"><strong>ACCREDITED</strong></div><div class="trainerContainer">TRAINER</div></div>';
                }
                else {
                    stringHtml = stringHtml + '<div class="internationPartnersSingle"><strong>INTERNATIONAL PARTNER</strong></div>';
                }
                stringHtml = stringHtml + '</div>';
                label.html(stringHtml);
                label = region.mousemove(function (t) {
                    var label = $("#jvectormap-label");
                    label.css({
                    left: t.pageX + 15,
                    top: t.pageY + 15
                    });
                });

                // Expand the title text to fit
                var spanWidth = $("#titleSpan").width();
                var newFontSize = (250 / spanWidth * 12);
                $("#titleSpan").css({ "font-size": newFontSize, "line-height": newFontSize / 1.2 + "px" });

                return;
            }
        }
        e.preventDefault();
    },
    onRegionOut: function (e, code) {
        var label = $("#jvectormap-label");
        label.html('');
        label.display = 'none';
    },
    onRegionClick: function (e, code) {
        for (var partner in SavillePartners) {
            if (partner == code) {
                var link = SavillePartners[code].link;
                document.location.href = '/International/' + link;
            }
        }
    },
    focusOn: {
        x: mapXFocus,
        y: mapYFocus,
        scale: mapScale
    }
});

});

开发人员工具没有显示任何指示我的方向......

如果您想亲自了解它在FF和IE中的工作情况,而不是Chrome,请点击here并将鼠标悬停在较浅的国家/地区。任何帮助将不胜感激,因为我已经坚持了几个小时。

1 个答案:

答案 0 :(得分:0)

我使用的是Chrome版本25.0.1364.172,它对我有用。您使用的是哪个版本,是否有更多数据?颜色会发生变化,你究竟想要解决什么?