繁体   English   中英

在jVectorMap中,仅在满足条件的情况下如何选择区域?

[英]In jVectorMap, how to select a region ONLY IF a condition is met?

我正在使用jVectorMaps。 默认情况下,不允许选择区域,除非>> regionsSelected: true

这是我要实现的目标:

当用户单击区域时,会提示他/她从加载的JSON文件中提取一个问题。 在问题答案正确的情况下,我才需要更改区域颜色。

到目前为止,我的代码:

$(function(){
  map = new jvm.Map({
    container: $('#map'),
    map: 'world_mill_en',//map file
    backgroundColor: ['#1E90FF'],//map background color    
    regionsSelectable:true,//this needs to be true to be able to select a region

    onRegionClick: function(event, code){
      var map = $('#map').vectorMap('get', 'mapObject');
      var regionName = map.getRegionName(code);
      $.getJSON('../countries.json', function(data) {
        for (var i in data.country) {
          if (data.country[i].name === regionName){
            var answer = prompt(data.country[i].question, "Type your answer here.");
            if(data.country[i].answer === answer){
              alert("Correct!");
            }else{
              alert("Wrong. Try again.");
            }
          }
        }
      });
    },

  });
});

我认为我必须找到一种方法,在满足if(data.country[i].answer === answer)条件后,动态更改regionsSelectable的属性值。 如果不是,那么regionsSelectable的属性值应保持为false

我是一个初学者,因此任何批评都值得欢迎,无论如何,我在这里可能还差得远! :)

试试看..

 $(function(){
          map = new jvm.Map({
            container: $('#map'),
            map: 'world_mill_en',//map file
            backgroundColor: ['#1E90FF'],//map background color    
            regionsSelectable:true,//this needs to be true to be able to select a region

            onRegionClick: function(event, code){
              var map = $('#map').vectorMap('get', 'mapObject');
              var regionName = map.getRegionName(code);
              $.getJSON('../countries.json', function(data) {
                for (var i in data.country) {
                  if (data.country[i].name === regionName){
                    var answer = prompt(data.country[i].question, "Type your answer here.");
                    if(data.country[i].answer === answer){
                      map.setSelectedRegions(code);;
                    }else{
                     map.clearSelectedRegions();

                    }
                  }
                }
              });
            },

          });
        });

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM