Vega-Lite中picked选择器失效问题咨询与排查

• 核心原因：混合字符串（如‘No Target Selected’）与整数类型的选项确实会导致筛选失效。Vega-Lite对数据类型匹配要求严格，当选择器的选项值类型和数据中Net-zero Target的整数类型不匹配时，筛选条件会因类型不一致无法匹配数据。
  比如选择器选项同时包含字符串"No Target Selected"和整数2030时，用户选择2030后，选择器值可能被自动转为字符串"2030"，和数据里的整数2030无法相等；选择字符串选项时，更是直接和整数类型的目标年份匹配失败，最终导致筛选失效。

• 两种可行修复方案：

  1. 用labels分离显示文本与实际值（推荐）
     选择器的options使用与数据类型一致的数值（或null表示全部显示），通过labels配置友好的显示文本，彻底避免类型混用：

     "selection": {
       "picked": {
         "type": "single",
         "bind": {
           "select": {
             "options": [null, 2030, 2050],
             "labels": ["No Target Selected", "2030", "2050"],
             "name": "Net-zero Target: "
           },
           "value": null
         }
       }
     },
     "transform": [
       {"filter": "picked == null || datum['Net-zero Target'] === picked"}
     ]
     

     这里null对应“显示全部数据”，选择具体年份时，值类型和数据里的整数完全匹配，筛选逻辑正常。

  2. 统一类型并在筛选时兼容转换
     将所有选项转为字符串，同时在筛选条件中把数据里的年份也转为字符串：

     "selection": {
       "picked": {
         "type": "single",
         "bind": {
           "select": {
             "options": ["No Target Selected", "2030", "2050"],
             "name": "Net-zero Target: "
           },
           "value": "No Target Selected"
         }
       }
     },
     "transform": [
       {"filter": "picked === 'No Target Selected' || datum['Net-zero Target'].toString() === picked"}
     ]
     

内容的提问来源于stack exchange，提问作者jantheman