You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

jquery.vmap.js报Uncaught TypeError 无法读取setFill属性问题求助

报错根因

报错的核心原因是setColors方法接收到字符串类型的key时,this.countries[key]返回undefined,尝试调用undefined的setFill方法触发了类型错误。
对比源码可以看到,批量设置颜色的else分支做了if (this.countries[code])的非空校验,但是单个key设置的if分支缺失这个校验,属于源码本身的逻辑疏漏。

常见触发场景
  • 传入的国家/区域编码不符合当前vmap地图的编码规范,比如大小写错误、使用了地图不支持的编码标准(如误用三位ISO国家码,而地图仅支持两位ISO编码)
  • 调用setColors的时机早于vmap地图初始化完成时间,this.countries对象还未完成填充
  • 使用自定义地图时,传入的区域编码没有在地图配置中提前注册
解决方法
  • 调用侧适配:调用setColors前先校验传入的编码是否在地图支持的编码列表中,避免传入非法编码
  • 源码修复:给单个key的处理分支增加非空判断,和批量处理逻辑对齐,修改后代码如下:
setColors: function (key, color) {
  if (typeof key == 'string') {
    // 新增非空校验,避免访问undefined属性
    if (this.countries[key]) {
      this.countries[key].setFill(color);
      this.countries[key].setAttribute("original", color);
    }
  } else {
    var colors = key;
    for (var code in colors) {
      if (this.countries[code]) {
        this.countries[code].setFill(colors[code]);
        this.countries[code].setAttribute("original", colors[code]);
      }
    }
  }
},
  • 调用时机调整:确保setColors在vmap地图的load事件回调中执行,不要在初始化阶段提前调用。

内容的提问来源于stack exchange,提问作者Andrija Petrovic

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.09.26 22:06:04