【问题标题】:jqvMap Custom TooltipsjqvMap 自定义工具提示
【发布时间】:2016-06-12 07:30:53
【问题描述】:

我确实意识到已经回答了其他 jqvMap 自定义工具提示主题,但是,该解决方案对我不起作用。

这是我当前用于 jQuery 的 jqvMap 代码:

  jQuery(document).ready(function () {
    jQuery('#vmap').vectorMap({
      map: 'usa_en',
      enableZoom: true,
      showTooltip: true,
      selectedColor: null,
      hoverColor: null,
      backgroundColor: '#fffff',
      colors: {
        fl: '#016ea1',
        ma: '#016ea1',
        md: '#016ea1',  
        wa: '#016ea1',
        mn: '#016ea1',
        ny: '#016ea1',
        wi: '#016ea1',
        hi: '#016ea1',
        vt: '#016ea1',
        nv: '#016ea1',
        ia: '#016ea1',
        ca: '#016ea1',
        or: '#016ea1',
        nj: '#016ea1',
      },
onRegionClick: function(element, code, region)
{
        window.location = 'http://google.com/' + region;

},
            onLabelShow: function(event, label, code) {
                if (states.toLowerCase().indexOf(code) <= -1) {
                    event.preventDefault();
                } else if (label[0].innerHTML == "Colorado") {
                    label[0].innerHTML = label[0].innerHTML + " - The state where I live!!";
                }
            },
    });
  });

我尝试使用带有“onLabelShow”部分的其他主题的代码,但它只会让我的工具提示整体消失。有什么解决办法吗?

谢谢!

链接: https://github.com/manifestinteractive/jqvmap(jqvMap 文档) Custom Tooltips JQVMap(其他话题)

【问题讨论】:

    标签: javascript jquery jqvmap


    【解决方案1】:

    如果您查看浏览器控制台,您会发现 states 变量根本没有定义。如果要防止工具提示显示在不存在的状态上,则需要定义states,如果没有,只需删除第一个 if 语句。 onLabelShow 应该如下所示:

    onLabelShow: function(event, label, code) {
            states =["fl","ma","md","wa","mn","ny","wi","hi","vt","nv","ia","ca","or","nj"];
            if (states.indexOf(code) <= -1) {
                event.preventDefault();
            } else if (label[0].innerHTML == "Florida") {
                label[0].innerHTML = label[0].innerHTML + " - The state where I live!!";
            }
        },
    });
    

    您可以找到工作示例Here

    希望有所帮助。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-06-23
      • 2011-09-28
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多