クリエイター手抜きプロジェクト[147]Fireworks CS3編 ランダムな位置、色で図形を描画する/古籏一浩

投稿:  著者:  読了時間:7分(本文:約3,100文字)


今回は、Fireworks CS3でランダムな位置と色で各種図形を描くスクリプトです。Fireworks CS3で動作確認していますが、これらの処理系はver 3から変わっていないので事実上、どのバージョンのFireworksでも動作すると思います。最初のスクリプトはランダムに四角形を描くものです。


docObj = fw.getDocumentDOM();
for (i=0; i<10; i++)
{
var x = Math.random() * (docObj.left + docObj.width);
var y = Math.random() * (docObj.top + docObj.height);
var R = Math.floor(Math.random() * 256).toString(16);
var G = Math.floor(Math.random() * 256).toString(16);
var B = Math.floor(Math.random() * 256).toString(16);
if (R.length < 2) R = "0" + R;
if (G.length < 2) G = "0" + G;
if (B.length < 2) B = "0" + B;
docObj.setFillColor("#"+R+G+B);
docObj.addNewRectangle({left:x, top:y, right:x+100, bottom:y+100},0.25);
}

描かれる四角形のサイズを変えるには

docObj.addNewRectangle({left:x, top:y, right:x+100, bottom:y+100},0.25);



right:x+100, bottom:y+100

の100の値で調整してください。0.25の値は角丸の割合を示します。0〜1までの小数値で指定します。ちなみに、わざと10とか20などにすると、なかなか面白い図形を描く事ができます。

次のスクリプトはランダムに円を描くものです。描画されるサイズを変えるのは四角形を描く場合と同様です。

docObj = fw.getDocumentDOM();
for (i=0; i<10; i++)
{
var x = Math.random() * (docObj.left + docObj.width);
var y = Math.random() * (docObj.top + docObj.height);
var R = Math.floor(Math.random() * 256).toString(16);
var G = Math.floor(Math.random() * 256).toString(16);
var B = Math.floor(Math.random() * 256).toString(16);
if (R.length < 2) R = "0" + R;
if (G.length < 2) G = "0" + G;
if (B.length < 2) B = "0" + B;
docObj.setFillColor("#"+R+G+B);
docObj.addNewOval({left:x, top:y, right:x+100, bottom:y+100});
}

次のスクリプトは多角形を描くものです。

docObj = fw.getDocumentDOM();
for (i=0; i<10; i++)
{
var X = Math.random() * (docObj.left + docObj.width);
var Y = Math.random() * (docObj.top + docObj.height);
var R = Math.floor(Math.random() * 256).toString(16);
var G = Math.floor(Math.random() * 256).toString(16);
var B = Math.floor(Math.random() * 256).toString(16);
if (R.length < 2) R = "0" + R;
if (G.length < 2) G = "0" + G;
if (B.length < 2) B = "0" + B;
docObj.setFillColor("#"+R+G+B);
docObj.addNewStar(5, -1, true, {x:X, y:Y}, {x:X+20, y:Y+20});
}

描画される角の数は

docObj.addNewStar(5, -1, true, {x:X, y:Y}, {x:X+20, y:Y+20});

の5の値を変更してください。-1はへこみ具合で-1か0〜1までの小数値で指定します。星形かどうかは上記のtrueかfalseで決定されtrueであれば星形になります。falseであれば凸型の多角形になります。サイズは{x:X+20, y:Y+20}の20の値を変更します。

次のスクリプトはランダムに線を描画するものです。これは単純に座標値を指定しているだけの単純なものです。

docObj = fw.getDocumentDOM();
for (i=0; i<10; i++)
{
var X1 = Math.random() * (docObj.left + docObj.width);
var Y1 = Math.random() * (docObj.top + docObj.height);
var X2 = Math.random() * (docObj.left + docObj.width);
var Y2 = Math.random() * (docObj.top + docObj.height);
var R = Math.floor(Math.random() * 256).toString(16);
var G = Math.floor(Math.random() * 256).toString(16);
var B = Math.floor(Math.random() * 256).toString(16);
if (R.length < 2) R = "0" + R;
if (G.length < 2) G = "0" + G;
if (B.length < 2) B = "0" + B;
docObj.setFillColor("#"+R+G+B);
docObj.addNewLine({x:X1, y:Y1}, {x:X2, y:Y2});
}

【古籏一浩】openspc@po.shiojiri.ne.jp
< http://www.openspc2.org/ >
NHKのど自慢の公開録画に行ってきました。せっかくなのでレポートとしてページを用意しておきました。まあ、予選通過する云々のところは、話半分で読んでもらえばよいかなあと。
12月16日に放送されるNHKのど自慢で会場のどこかに私がいますf(^^;。
< http://www.openspc2.org/NHK/ >

アクセスどっちが多いかなあ。「のど自慢 vs 初音ミク」
初音ミクの次の鏡音リンも購入してページ作る予定です。まあ、UIは同じでしょうけど……。初音ミクでニコニコ動画など映像で風景とか使いたい場合は以下のページでどうぞ。(毎度同じ宣伝ですけど)
・ハイビジョン映像素材
< http://www.openspc2.org/HDTV/ >
あと、残っているのはGoogle潜入レポートくらいかなあ。

photo
ActionScript逆引きクイックリファレンス―5&MX&MX2004&8対応 for Windows & Macintosh
田中 康博 古籏 一浩 林 拓也
毎日コミュニケーションズ 2005-12
おすすめ平均 star
starFlash(ActionScript)の開発前の調査にも役立ちます
star良書です。

Flash逆引きクイックリファレンス 8&MX2004対応for Windows & Macintosh 速習Webテクニック FLASH8 ActionScript 実例サンプル47 (Quick master of web technique) おしえて!!FLASH 8 ActionScript (毎コミおしえて!!シリーズ) 有名クリエイターがこっそり教えるFlash作成のウラ技 .fla―Idea of Flash Creation



photo
改訂第4版 JavaScript ポケットリファレンス
古籏 一浩
技術評論社 2006-10-18
おすすめ平均 star
starJavaScript仮免者以上の方へ
starバランスの良いバイブル
star中級者向けです。

[改訂版] PHP ポケットリファレンス (Pocket reference) 改訂新版 SQLポケットリファレンス (Pocket reference) 基礎 Ajax + JavaScript 標準DOMスクリプティング JavaScript+DOMによるWebアプリデザインの基礎 初めてのJavaScript―Ajax&DOM対応



photo
Google Maps API逆引きクイックリファレンス―WEB2.0対応
古籏 一浩
毎日コミュニケーションズ 2006-09
おすすめ平均 star
star簡単にできます
starようやく出ました。使えるGoogleMapsリファレンス。

Google Maps API徹底活用ガイド Google Maps APIv2活用リファレンス Googleマップ+Ajaxで自分の地図をつくる本  Google Maps API徹底活用 PHP×WebサービスAPIコネクションズ 入門Webマッピング―自分で作るオリジナルのデジタル地図

by G-Tools , 2007/11/12