Keep README charts in sync with a simple GitHub Action

Question

I got tired of updating chart screenshots in READMEs by hand.

Either the numbers were stale, or I’d regenerate an image, commit it, and forget the next week. For docs and GitHub READMEs I don’t need a full chart library on the page — I need a vector file that still looks sharp.

So I wired ProvChart’s SVG API into a GitHub Action.

What it does

1. You describe charts in .provchart/charts.json
2. On schedule or workflow_dispatch, the Action calls the API
3. It writes .svg files into the repo (e.g. docs/charts/)
4. A commit step pushes them if anything changed

README stays simple:

![API traffic](./docs/charts/demo.svg)

No Chart.js in the README. No screenshot pipeline.

Minimal setup

Secret: PROVCHART_API_KEY (from the ProvChart dashboard)

Config (array of payloads):

[
  {
    "file": "demo.svg",
    "type": "area",
    "theme": "midnight",
    "width": 640,
    "height": 320,
    "axisX": ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
    "series": [
      {
        "name": "Requests",
        "color": "#8b7bff",
        "points": [20, 85, 40, 60, 10, 40, 95]
      }
    ]
  }
]

Workflow sketch:

- uses: fscss-ttr/provchart-readme-action@v1.0.4
  with:
    api-key: ${{ secrets.PROVCHART_API_KEY }}
    config: .provchart/charts.json
    output-dir: docs/charts

Then auto-commit the docs/charts/*.svg files if you want.

Why this shape

• SVG fits Markdown and docs better than a heavy client chart stack
• CI owns refresh; the README only references files
• Same JSON model as the rest of ProvChart (line, area, bar, gauge, …)

Gauges at about 220×220 work well in a README.

Try without starting from zero

Sample repo (fork → add the secret → run the workflow):

github.com/Figsh/provchart-charts

Action:

github.com/fscss-ttr/provchart-readme-action

---

Not a replacement for interactive dashboards. Just a practical way to keep docs charts honest without babysitting PNGs.

---