GitHubActions + Blender で GitHub Profile に 3D の草を生やしてみた！

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322603/7f358d31-eed4-9aef-2cb1-e97ae8260dec.png)

<font color="grey">草が少なくてお恥ずかしい</font>

## これは何

GitHub Contributions (いわゆる草) をもとに 3D の草を生やし, 画像として出力する GitHub Actions を作りました. GitHub Profile に配置したりできます. 
名前は, 安直ですが cgrass (**C**ontribution to 3D **Grass**) にしました.

### 処理のざっくり説明
作成に当たって, GitHub Actions と Blender Python を使用しました.

Blender Python では, オブジェクトの配置やマテリアルの適用, レンダー部分を行います. 外部の blend ファイルを読み込み, オブジェクトやマテリアルをインポートできます. よって, オブジェクト自体は Blender 上で予め作成しておけば, Python 側の処理は単純にできます.

GitHub Actions では, Blender のインストールと Blender Python の実行を行います. Blender のインストールは 40 秒ほどかかりますが, キャッシュが効くので 2 度目以降は大丈夫です. Blender Python の実行には 30 秒ほどかかりますが, 仕方ないですね.


※この記事では実装に関することについては触れませんが, ソースコードは公開しています.

**↓GitHub Repository**

https://github.com/nrysk/cgrass

**↓Marketplace**

https://github.com/marketplace/actions/contribution-to-3d-grass

## 使い方

### 1. プロフィールページを作成します

GitHub で使用しているユーザネームと同じ名前のリポジトリを作成します.
GitHub のユーザネームが `nrysk` なら, そのまま `nrysk` というリポジトリを作成します.

### 2. ワークフローを作成します

`.github/workflows/cgrass.yml` という名前のファイルを作成します.

```.github/workflows/cgrass.yaml
name: Generate Picture and Push to output branch

on:
    push:
        branches:
            - main
    schedule:
        - cron: '0 0 * * *' # 好きな時刻にしてください
    
permissions:
    contents: write

jobs:
    generate:
        runs-on: ubuntu-24.04

        steps:
          - name: Checkout
            uses: actions/checkout@v4

          - name: Generate Picture
            uses: nrysk/cgrass@v1.0.0
            with:
                github_username: ${{ github.repository_owner }}
                github_token: ${{ secrets.GITHUB_TOKEN }}
                output_path: output/output.png
                command: "theme"
                argument: "github"

          - name: Push output image to output branch
            uses: crazy-max/ghaction-github-pages@v4
            with:
                target_branch: output
                build_dir: output
                commit_message: "Generate Output Image"
            env:
                GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
```

push (GitHub 上なら Commit) をすると, GitHub Actions が動作します.
Action が完了すると, `output` ブランチに生成された画像が配置されます.
稀ですが, Segmentation Fault を起こした場合は, 再実行してください.

### 3. テーマを変更する

argument に渡す文字列を変更することで, テーマを切り替えられます.

```.github/workflows/cgrass.yaml
  - name: Generate Picture
    uses: nrysk/cgrass@v1.0.0
    with:
        github_username: ${{ github.repository_owner }}
        github_token: ${{ secrets.GITHUB_TOKEN }}
        output_path: output/output.png
        command: "theme"
        argument: "github" # ここを変更する
```


#### github

![github.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322603/39f211cd-eb7d-add6-6450-c42d25b477e3.png)

#### github-nograss

![github-nograss.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322603/8f593dd0-3e72-1277-a962-46ed6f242e13.png)

#### planet

![planet.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322603/8b5beed5-d76b-3848-7254-b390c5ebccff.png)

#### planet-nograss

![planet-nograss.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3322603/0f847458-f84b-6b0f-c339-6f9ed4209a4d.png)

### 4. プロフィールに画像を載せる

画像は `output` ブランチに生成されます. デフォルトでは `output.png` というファイルが生成されます.
プロフィールの README.md に以下を記述することで, 画像を表示できます.
`<username>` 部分はご自身のユーザ名で置き換えてください.

```README.md
![Contribution to Grass](https://raw.githubusercontent.com/<username>/<username>/refs/heads/output/output.png)
```

これでできるはずです.

### オリジナルテーマを作成する場合

`command` 部分を `"themefile"` とすることで, テーマファイルパスを直接指定することができます. `argument` にテーマファイルへのパスを設定してください.
例えば, プロジェクトルートに `mytheme.toml` を作成したとします.

```.github/workflow/cgrass.yaml
  - name: Generate Picture
    uses: nrysk/cgrass@v1.0.0
    with:
        github_username: ${{ github.repository_owner }}
        github_token: ${{ secrets.GITHUB_TOKEN }}
        output_path: output/output.png
        command: "themefile" # ここを変更する
        argument: ${{ github.workspace }}/mytheme.toml # ここを変更する
```

テーマファイルの例は [mytheme.toml](https://github.com/nrysk/cgrass/blob/main/mytheme.toml) から見られます.

#### テーマファイルで設定できること
現時点 (v1.0.0) では, 以下が変更できます. 
- 地面の色1
- 地面の色2
- 草の色1
- 草の色2
- 草の密度
- 草の高さ倍率
- 太陽の色
- 太陽の強さ
- 太陽の角度
- レンダリングのサンプル回数

※地面と草は Contribution Level 毎に設定できます.

## 最後に

現時点では, 最小限の機能しか備えられておりません. 
今後は
- アニメーション
- テーマファイル
- テーマファイルを簡単に作れるサイト
- Contribution の種類に応じて草の種類を変える
などの機能を追加したいと考えています.

最後に, 感想など頂けると励みになります