記事や資料にグラフを入れたいけれど、Excelやスプレッドシートで作って、画像にして、デザインツールへ持っていくのが少し面倒。
そんなときに、ブラウザ上ですぐグラフを作成し、FigmaやIllustratorで編集できるSVG形式で書き出せる無料ツールを作りました。
無料SVGグラフ作成ツール「Graphico」
登録やログインは不要です。ブラウザ上ですぐに利用できます。
Graphicoでできること
Graphicoでは、入力した項目名と数値から、棒グラフや折れ線グラフ、円グラフなどを作成できます。
作成したグラフは、SVGまたはPNG形式で書き出せます。
主な機能は以下のとおりです。
- 棒グラフ・2列グラフ・積み上げグラフの作成
- 折れ線グラフ・面グラフの作成
- 円グラフ・ドーナツグラフの作成
- 1つまたは2つのデータを使ったグラフ作成
- グラフの色や配色の変更
- ゴシック体・明朝体の切り替え
- 棒グラフの角丸・直角の切り替え
- SVG・PNG形式での書き出し
- 複数グラフのZIP一括ダウンロード
すべて無料で利用できます。
グラフ上の文字や数値を直接編集できます
このツールの特徴は、グラフのプレビューを見ながら、表示されている文字や数値を直接編集できることです。
グラフの見出し、サブラベル、項目名、数値などをクリックすると、その場で内容を変更できます。
「左側のどの入力欄が、グラフのどこに反映されるのか分からない」
グラフ作成ツールを使っていて、こう感じることがよくありました。
Graphicoでは、左側の設定項目から編集する方法に加えて、グラフ上の変更したい箇所を直接クリックして編集できます。
プレビュー上で変更した内容は左側の設定にも反映され、左側で変更した内容もグラフへ反映されます。
項目名と数値をまとめて入力できます
グラフを作るとき、項目を1つずつ追加して数値を入力する作業は意外と時間がかかります。
Graphicoでは、複数の項目名や数値を改行区切りでまとめて入力できます。
例えば、項目名の入力欄に、
1月
2月
3月
4月数値の入力欄に、
120
180
240
210と入力すれば、それぞれ同じ行の項目と数値が対応します。
2種類のデータを比較するグラフでは、3列目に2つ目の数値をまとめて入力できます。
Excelやスプレッドシートからコピーしたデータを整理するときにも使いやすい形にしています。
SVGだからFigmaやIllustratorで再編集できます
作成したグラフは、SVG形式でダウンロードできます。
SVGは拡大しても画質が劣化しにくいベクター形式です。ダウンロードした後も、FigmaやIllustratorなどで編集できます。
例えば、以下のような調整が可能です。
- 文字のフォントやサイズを変更する
- グラフの色を変更する
- 棒や線の形を調整する
- 項目の位置を移動する
- 自社の資料や記事デザインに合わせる
ツール上だけですべてを完成させるのではなく、まずグラフのベースを素早く作り、必要に応じて使い慣れたデザインツールで仕上げる使い方を想定しています。
複数のグラフをアートボードで管理できます
記事や資料を制作していると、必要なグラフが1枚だけとは限りません。
Graphicoには、複数のグラフをブラウザ上で保持できるアートボード機能があります。
1枚目のグラフを作成した後に新しいアートボードを追加したり、現在のグラフを複製して、数字や項目だけ変更したりできます。
作成したアートボードには、それぞれグラフのサムネイルが表示されます。必要なアートボードを選択して、SVGまたはPNG形式のZIPファイルとしてまとめて書き出すことも可能です。
なお、作成内容はサーバーには送信されず、利用しているブラウザ内に保存されます。
ログインせずに使える一方で、ブラウザのデータを削除すると保存内容も消えるため、完成したグラフはSVGまたはPNGで保存してください。
こんな人におすすめです
Graphicoは、次のような場面で使えます。
- WordPressの記事にグラフを掲載したい
- オウンドメディア用のグラフ画像を作りたい
- プレゼン資料にグラフを入れたい
- Figmaで編集できるグラフのベースが欲しい
- Illustratorで細かく調整できるSVGが欲しい
- 複数のグラフを同じデザインで作りたい
- Excelのグラフを作り直す手間を減らしたい
- 登録不要ですぐ使えるグラフ作成ツールを探している
PCのブラウザでの利用を中心に設計しています。
無料・登録不要で利用できます
Graphicoは無料で利用できます。
アカウント登録やログインも必要ありません。
入力した数値や作成したグラフはサーバーへ保存せず、基本的にブラウザ内で処理されます。
記事制作や資料作成の途中でグラフが必要になったときに、気軽に使ってみてください。
今後も実際に使いながら、操作性やグラフ形式などを改善していく予定です。
