Jquery Jvectormap-为每个区域设置悬停颜色？

我想为JVectorMap插件设置单独的区域和悬停颜色，并将没有数据的区域保留为默认的白色

到目前为止，我已经去掉了比例数据，并用颜色代码替换了它（如下面的代码所示）。这太棒了，但我不知道如何添加悬停数据

如果可能的话，我还想为document.body.style.cursor添加数据，这样我就可以关闭各个区域（例如，在这些区域中，实体被禁止进行交易），这样它就不会显示为活动链接

你也会注意到我有代码在里面打开一个面板。它用于显示一个完整的弹出div，其中包含我有数据的每个区域的个性化内容。它是继承的代码，所以说实话，我不确定它是如何工作的

如果我忘了什么，请告诉我

jQuery.noConflict();
jQuery(function(){
    var $ = jQuery;   
    $('#map_custom').vectorMap({
        map: 'world_mill_en',   
        backgroundColor : "#b8b8b8",
        regionStyle : {
            initial : {
                fill : "white",
                "fill-opacity" : 1,
                stroke : "none",
                "stroke-width" : 0,
                "stroke-opacity" : 1
            },
            hover : {
                "fill-opacity": 0.7,
            },
            selectedHover : {}
        },
        onRegionOver: function (event, code, region) {
            document.body.style.cursor = "pointer";
        },
        onRegionOut: function (element, code, region) {
            document.body.style.cursor = "default";

        },  
        onRegionClick: function(event, code, region){   
            if (code == "CA") {window.location = 'CalRamic-distributors-Canada.html'}
                if (code == "US") {window.location = 'CalRamic-distributors-USA.html'}
                    if (code == "IE") {
                        $(".panel").hide("fast");
                        $("#ireland").show("slow");   
                        document.getElementById('test_data').innerHTML=code;
                    }
                    if (code == "GB") {
                        $(".panel").hide("fast");
                        $("#unitedkingdom").show("slow");     
                        document.getElementById('test_data').innerHTML=code;
                    }
                    if (code == "ES") {
                        $(".panel").hide("fast");
                        $("#spain").show("slow");     
                        document.getElementById('test_data').innerHTML=code;
                    }
                    if (code == "PT") {
                        $(".panel").hide("fast");
                        $("#portugal").show("slow");      
                        document.getElementById('test_data').innerHTML=code;
                    }
                    if (code == "IL") {
                        $(".panel").hide("fast");
                        $("#israel").show("slow");    
                        document.getElementById('test_data').innerHTML=code;
                    }   
        // I've got a LOT more countries in my code, but you don't need all of them
        else if (code){
            event.preventDefault();     
        }
    },      
    series: {
        regions: [{
            values: sample_data
        }]
    }
});

  /* Close the Panel */
        $("body").click(function(e) {       
            if (e.target.id == "close" || $(e.target).parents("#close").size()) 
            {               
                 $(".panel").hide("slow");
            }
        });

})

目前，此代码从sample_data.js文件中提取颜色数据，其格式如下：

    var sample_data = {
      "CA": '#0071a4',
      "US": '#0071a4',
      "IE": '#0071a4',
      "GB": '#0071a4',
      "ES": '#0071a4',
    }

---

多亏了这里的社区，作为一个新手，我已经走得很远了，但是我被要求使用jvectormap比以前走得更远。不幸的是，我只会使用这种编程代码，所以我会联系专家。

首先，这只是一个建议，你应该摆脱疯狂的if逻辑，让它成为一个通用的函数

例如：

function panelHandler(element, hideSpeed, showSpeed){
  $('.panel').hide(hideSpeed);
  $(element).show(showSpeed);
  $('#test_data').innerHTML('code');
}

if (code == "IE") {
    panelHandler("#unitedKingdom", "slow", "fast");
}

if (code == "GB") {
   panelHandler("#spain", "slow", "fast");
}

etc...

至于你的问题，只需附上相应的课堂设置即可。然后在事件上检查它，并按如下方式执行：

$('#selector').css('cursor', 'pointer');

---

希望这能有所帮助。如果您需要更详细的信息，请告诉我，我可以帮助您。

感谢您抽出时间查看此信息！我确实有几个问题。是否需要完全删除onRegionClick:函数（事件、代码、区域）{代码的一部分，还是仍然存在？onRegionOver:和onRegionOut:bits上也是一样？最后一个问题，我不确定我是否理解代码的最后一位以及如何检查它。我在代码中找不到任何地方专门用CSS代码的任何一位调用区域，只有一些适用于所有区域的全局类。我有没有办法使用示例数据调用游标和悬停颜色？