Plotly Tooltip无法显示自定义数据：Hovertemplate无法识别name变量问题求助

这个问题我之前在做Plotly可视化的时候也碰到过，其实核心是没搞清楚Plotly hovertemplate里能直接插值的变量范围——这里给你两个更简洁的解决方案，比用customdata构造重复数组要方便得多：

方法1：直接拼接静态/动态name字符串 #

因为name是整个trace的固定属性，不是随每个数据点变化的字段，所以完全不需要用%{name}插值，直接把name值写在hovertemplate里就行：

如果name是固定字符串：

var data = { 
  x : timestamps, 
  y : values, 
  mode : 'lines+markers', 
  type : 'scatter', 
  name : 'Test', 
  hovertemplate: '%{y} Test' 
};

如果name是变量（比如循环生成多个trace的场景），用JS模板字符串动态拼接：

const traceName = 'Test';
var data = { 
  x : timestamps, 
  y : values, 
  mode : 'lines+markers', 
  type : 'scatter', 
  name : traceName, 
  hovertemplate: `%{y} ${traceName}` 
};

方法2：使用%{fullData.name}访问trace元数据 #

Plotly的hovertemplate支持引用fullData对象（当前trace的完整配置信息），通过它可以直接获取trace的name属性。这种方法适合需要统一模板、批量生成多个trace的场景，不用每个trace都单独拼接字符串：

var data = { 
  x : timestamps, 
  y : values, 
  mode : 'lines+markers', 
  type : 'scatter', 
  name : 'Test', 
  hovertemplate: '%{y} %{fullData.name}' 
};

为什么原来的%{name}不生效？ #

Plotly的hovertemplate默认只允许直接插值数据级字段（比如x、y、customdata这些数组类型的字段），而name属于trace的元数据字符串，不在默认的插值变量列表里，所以会抛出"Variable 'name' in hovertemplate could not be found!"的错误。

相比你之前用customdata构造重复数组的方案，上面两种方法都不需要额外处理数据，代码更简洁高效。

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