在 chart.js 中，即使关闭网格线和边框显示，y 轴本身仍会默认渲染一条垂直轴线；只需将 `scales.y.display` 设为 `false` 即可完全移除该残留边框。

当你使用 Chart.js 创建无边框图表（如简洁的数据看板或嵌入式轻量图表）时，常会发现：尽管已设置 grid.display: false 和 showBorder: false，Y 轴方向仍残留一条细长的灰色竖直线——这并非网格线，而是 Y 轴自身的坐标轴线（axis line），它由 Chart.js 默认启用，独立于网格配置。

要彻底隐藏它，关键在于显式禁用整个 Y 轴的渲染，而非仅调整其子项。正确做法是：

chartjs-reporter

此技能用于在用户需要将结构化数据（查询结果、CSV 摘要、JSON 记录或 Python 字典/列表）转换为独立的 HTML 页面时使用。

下载

scales: {
  x: {
    grid: { display: false },
    ticks: {
      color: '#2D4059',
      font: { size: 14, family: 'Lexend-SemiBold' }
    }
  },
  y: {
    display: false, // ✅ 核心修复：禁用整个 Y 轴（含轴线、刻度、标签）
    grid: { display: false }, // 此处可省略，因 y 轴已整体隐藏
    ticks: { display: false }
  }
}

⚠️ 注意：y.display: false 会同时隐藏 Y 轴线、刻度线、刻度文字及标题。若你仅需隐藏轴线但保留刻度（例如带横向参考线的极简设计），则应改用：y: { border: { display: false }, // ✅ 仅隐藏轴线（v4.4+ / v5+ 推荐写法） grid: { display: false }, ticks: { ... } }——但需确认 Chart.js 版本：border.display 在 v3.x 中不被支持，v4.4+ 及 v5.x 才正式引入该配置项。本文示例基于广泛兼容的 v3.x（主流 LTS 版本），故推荐 display: false 方案。

此外，原配置中 legend 与 plugins.legend 并存属于冗余写法（v3.7+ 后 legend 已统一归入 plugins），建议精简为：

plugins: {
  legend: { display: false },
  datalabels: {
    anchor: 'end',
    align: 'top',
    color: '#2D4059',
    font: { size: 14, family: 'Lexend-SemiBold' }
  }
}

总结：Chart.js 的“顽固边框”本质是未被关闭的坐标轴容器本身。牢记——scales.{axis}.display: false 是清除该轴全部视觉元素（含边框）最直接、最可靠的方式，无需额外 hack 或 CSS 覆盖。