← Back to plugins index

🌇 GitHub Skyline

This plugin displays the 3D commits calendar from skyline.github.com.

⚠ī¸ This plugin significantly increase file size, consider using it as standalone.

Supported features
→ Full specification		 📗 Classic template
👤 Users
No tokens are required for this plugin
GitHub Skyline
GitHub City
## ➡ī¸ Available options
OptionDescription

plugin_skyline

Enable skyline plugin
🌐 Web instances must configure settings.json:
  • metrics.cpu.overuse
  • metrics.npm.optional.gifencoder
  • metrics.run.puppeteer.scrapping
type: boolean
default: no

plugin_skyline_year

Displayed year
type: number (2008 ≤ đ‘Ĩ)
default: current-year

plugin_skyline_frames

Frames count

Use 120 for a full-loop and 60 for a half-loop. A higher number of frames will increase file size.
type: number (1 ≤ đ‘Ĩ ≤ 120)
default: 60

plugin_skyline_quality

Image quality

A higher image quality will increase file size.
type: number (0.1 ≤ đ‘Ĩ ≤ 1)
default: 0.5

plugin_skyline_compatibility

Compatibility mode

This uses CSS animations rather than embedded GIF to support a wider range of browsers, like Firefox and Safari. Using this mode significantly increase file size as each frame is encoded separately
type: boolean
default: no

plugin_skyline_settings

Advanced settings

Can be configured to use alternate skyline websites different from skyline.github.com, such as honzaap's GitHub City.

  • url: Target URL (mandatory)
  • ready: Readiness condition (A JS function that returns a boolean)
  • wait: Time to wait after readiness condition is met (in seconds)
  • hide: HTML elements to hide (A CSS selector)

For url and ready options, ${login} and ${year} will be respectively templated to user's login and specified year
✨ On master/main
🌐 Web instances must configure settings.json:
  • metrics.run.puppeteer.user.js
type: json
default: { "url": "https://skyline.github.com/${login}/${year}", "ready": "[...document.querySelectorAll('span')].map(span => span.innerText).includes('Share on Twitter')", "wait": 1, "hide": "button, footer, a" }
## ℹī¸ Examples workflows ```yaml name: GitHub Skyline uses: lowlighter/metrics@latest with: filename: metrics.plugin.skyline.svg token: NOT_NEEDED base: "" plugin_skyline: yes plugin_skyline_year: 2020 plugin_skyline_frames: 6 plugin_skyline_quality: 1 ``` ```yaml name: GitHub City uses: lowlighter/metrics@latest with: filename: metrics.plugin.skyline.city.svg token: NOT_NEEDED base: "" plugin_skyline: yes plugin_skyline_year: 2020 plugin_skyline_frames: 6 plugin_skyline_quality: 1 plugin_skyline_settings: | { "url": "https://honzaap.github.io/GithubCity?name=${login}&year=${year}", "ready": "[...document.querySelectorAll('.display-info span')].map(span => span.innerText).includes('${login}')", "wait": 4, "hide": ".github-corner, .footer-link, .buttons-options, .mobile-rotate, .display-info span:first-child" } ```