企業のサイトを構築していると、グラフやチャートが必要になることが多いです。

小難しいことをダラダラと書くよりも、グラフでデータを見せる方が、ユーザーの方々に分かりやすくていいですよね。

っちゅうわけで、本日はグラフを描くIllustrator系チュートリアルから、CSSを使ったグラフなど、なるべくデザイン的にきれいなものを、いろいろまとめてみました。

1. Creating graphs | Bartelme Design

Illustratorのチュートリアル。とってもきれいなグラフですね。パート2では3Dのやり方の詳細が説明されています。

2. Step-by-step Tutorial by Veerle

こちらもIllustratorのパイチャートツールを使ったチュートリアル。

3. 3D Graphs | N.DESIGN STUDIO

パイの一部がぴょこっと離れたパイチャートのチュートリアル。ファイルもダウンロードできます。

4. 3D Charts in Adobe Illustrator CS

ゼリー状のきれいなチャートもいいですね。

5. Pie Charts in Illustrator | GoSquared

シンプルな3Dチャート。

6. HowTo: Make Pretty Pie Charts | modern life.

ポップでかわいいパイチャートですね。

7. amCharts

パイチャート、折れ線グラフ、棒グラフ、バブルチャートがとりあえず、お試しでファイルをダウンロードできます。そこで気に入ってサイト上で使いたい！っと思ったら購入できます。

8. Create a Graph

チャートジェネレータです。サイト上でデータを入力して、そのままプリントもしくは、ダウンロードが選択できます。

9. Ajax MGraph

Prototype.jsベースのAjax棒グラフです。

10. PlotKit – Javascript Chart Plotting

MochiKitというライブラリをベースにしたグラフ。

11. Plotr | Solutoire.com

↑のPlotkitの派生版です。

12. Real World Bar Graphs | Khmerang.com

こちらは、HTMLとCSSできれいな棒グラフを作るチュートリアルです。

13. CSS FOR BAR GRAPHS | Apples to Oranges

こちらもCSSで作るきれいなグラフチュートリアルです。

グラフやチャートも見せ方次第でとってもきれいになりますね。。