LEGO®ライクなグラフィックを描ける軽量なJavaScriptライブラリ・「Legra」

Legra

LegraはLEGO®ぽいグラフィックを手軽に描ける軽量なJSライブラリです。Legraは「Lego® brick Graphics」を略したものだそうです

canvasにLEGO®を並べたようなグラフィックで色なども自由に描くことが出来ます

試しに使ってみました

使ってみる

英語だと大変そうだったのでカタカナで「かちびと」と書いてみました。描き方は線画や四角、パス、サークル、ポリゴン、ペジェなど自由度も高く、細かい描写も可能のようです

サンプルではパスを使ってます。基本的には座標と色などを指定するシンプルなものになります

import Legra from 'https://unpkg.com/legra?module'
const ctx = document.querySelector('canvas').getContext('2d');
const legra = new Legra(ctx, 20);

CDNが用意されていますので利用させてもらいましょう

legra.linearPath([
  [3, 3],
  [10, 3],
  [7, 10]
]);
legra.linearPath([
  [6, 1],
  [3, 10]
]);

座標を指定すれば自動で描いてくれます

案件でそのまま使う可能性はほぼありませんが面白いですね。応用すれば面白いものが手軽に作れそうです、ライセンスはMIT。

Legra