首页
/ GitHub Readme Activity Graph 新增网格隐藏与颜色自定义功能

GitHub Readme Activity Graph 新增网格隐藏与颜色自定义功能

2025-07-07 22:09:06作者:裴麒琰

GitHub Readme Activity Graph 是一个流行的开源项目,用于在 GitHub 个人资料页面的 README 中生成美观的活动贡献图表。近期,该项目新增了一项实用功能,允许用户自定义图表背景网格的显示状态和颜色。

功能背景

在之前的版本中,活动图表默认显示灰色虚线网格作为背景。虽然这有助于视觉参考,但部分用户希望有更简洁的界面,或者希望网格颜色能与自己的个人主题更协调。基于这一需求,开发团队实现了网格显示控制和颜色自定义功能。

功能详解

新功能通过 URL 参数实现,无需额外安装或配置:

  1. 隐藏网格功能
    添加 grid=false 参数即可完全隐藏背景网格线,使图表更加简洁。例如:

    https://github-readme-activity-graph.vercel.app/graph?username=yourusername&grid=false
    
  2. 网格颜色自定义
    使用 grid_color 参数可以指定网格线的颜色,采用十六进制颜色码(不带#前缀)。例如:

    https://github-readme-activity-graph.vercel.app/graph?username=yourusername&grid_color=FF5733
    

技术实现原理

这一功能的实现涉及 SVG 图形的动态渲染。项目后端接收到参数后,会相应调整生成的 SVG 代码:

  • 对于网格隐藏功能,系统会移除或禁用 SVG 中的网格线绘制指令
  • 对于颜色自定义,系统会将指定的颜色值注入到 SVG 的 stroke 属性中

这种实现方式保持了项目的轻量级特性,所有渲染逻辑仍在服务端完成,用户只需通过简单的 URL 参数即可获得定制化的图表。

使用建议

  1. 当图表数据点密集时,隐藏网格可以减少视觉干扰
  2. 选择网格颜色时,建议考虑与图表主题色的协调性
  3. 可以结合现有的 areatheme 等参数一起使用,创建完全个性化的活动图表

这一更新进一步提升了 GitHub Readme Activity Graph 的定制灵活性,使开发者能够更好地将活动图表融入个人 GitHub 页面的整体设计风格中。

登录后查看全文
热门项目推荐
相关项目推荐