ブログプロフィールBlogフローWordPressWebフロントエンドWebデザイン検証Processing2010.09.25Processingで棒グラフとある案件の版下の中に棒グラフを入れる機会に遭遇。試しにProcessingを使ってグラフを作ってみたので、そのコードについて。資料はビジュアライジング・データの4章「時系列」を参照。した改変しかしておらず、すべてのコードを公開するとオライリーさんに怒られそうなので、改変部分だけを公開。Processing.orgより。左右方向のグラデーションで塗りつぶされた正方形を描画するサンプル。//120px角のイメージとして設定。ARGBのAはアルファ。Processing.orgより。20ピクセルずつ均等に描画された白い円の半径が、マウスポインタの位置にあわせて、大きくなったり小さくなったりするサンプル。円の大きさはマウスポインタに近い程、小さくなるように設定されている。Processing.orgより。写真を読み込んで、左上から順番に、おおげさに液晶ディスプレイらしく描画するサンプル。Processing.orgより。カラーホイールを描画するサンプル。ホイールの中心に近づくほど、明度を落としたホイールが描かれる。Processing.orgより。画面内にマウスポインタを持っていくと、カラースペクトルに沿った縦長の長方形が描かれるサンプル。マウスのY座標で、長方形の明度が決まる。