夏休みの工作（※）を忘れていたので最終日に突貫で制作しました。
※そんな課題も仕事もありません。
作るのはハロウィンのオバケ。ということで端材を探してきました。割と柔らかいので処理が楽かも。
まずボンドで繋げます。
下絵を貼り付けて・・・
糸鋸やナイフ、ノミで形状を整えていきます。
いい感じになったら、アクリルカラーで塗って・・・
完成。なんだか小学校低学年の作品見たいですね（^o^）
木曜日, 8月 31, 2023
TCDW7780
もう完全に悪夢を超えた灼熱空間でした
ヘルメットがアトム風なのでアソーカではありません（^o^）。しかし（こればっか）・・・昨日、外出して夕方戻ったら室温34°Cだった（>_<）。もう完全に悪夢を超えた灼熱空間でした。
水曜日, 8月 30, 2023
JavaScriptでAI遊び 09
現在開いているドキュメントの中心に円を描く
作業中のファイルのど真ん中に円を描く・・・なのですが、結果が不安定で困惑中です。
/* center_circle.jsx */
// 現在のアクティブなドキュメントを取得
var doc = app.activeDocument;
// ユーザーに半径を入力させる
var radiusInput = parseFloat(prompt(
"円の半径を入力してください（ピクセル）", "50"));
if (isNaN(radiusInput) || radiusInput <= 0) {
alert("正しい半径を入力してください。");
} else {
// ドキュメントの幅と高さを取得
var docWidth = doc.width;
var docHeight = doc.height;
// 円の中心座標を計算
var centerX = docWidth / 2;
var centerY = docHeight / 2;
// 円を描く
var circle = doc.pathItems.ellipse(centerY + radiusInput,
centerX - radiusInput, radiusInput * 2, radiusInput * 2);
// Illustratorの円描画は左上から描くので、
// centerY - radiusInputではなくて
// centerY + radiusInput
// 円の属性を設定
circle.strokeColor = new RGBColor();
circle.fillColor = new NoColor();
circle.strokeWidth = 2;
// 円を選択状態にする
circle.selected = true;
}
/* center_circle.jsx */
実行すると描画する円の半径を求めてきます。
Illustratorは円を直径で描くので間違えないでください。
直径入力にする場合は・・・
var radiusInput = parseFloat(prompt(
"円の半径を入力してください（ピクセル）", "50"));
↓
var radiusInput = parseFloat(prompt(
"円の直径を入力してください（ピクセル）", "100"));
var circle = doc.pathItems.ellipse(centerY + radiusInput,
centerX - radiusInput, radiusInput * 2, radiusInput * 2);
↓
var circle = doc.pathItems.ellipse(centerY + radiusInput/2,
centerX - radiusInput/2, radiusInput, radiusInput);
のように変更してください。
以下の環境で確認すると・・・ファイルによって動作が狂います。上手くいくファイルも再処理で狂ったりして意味不明です。正しく動作したり狂ったりなので、Illustrator側に問題があるのかもしれません。
Illustrator 27.7（Windows）
Illustrator 27.8.1（mzcOS）
TCDW7779
保冷剤を目一杯シャツに貼り付けたいです
しかし、この暑さの中を15分も歩くと汗ビッショリになりますね。背中で汗が滴り落ちるのはメチャンコ気持ち悪いです（>_<）。保冷剤を目一杯シャツに貼り付けたいです。
火曜日, 8月 29, 2023
HTMLのコーディングは一気に設計すると奈落に落ちます（06）
mmとppi値からpixel値が求められたので、pixelとppi値からmm値を求めてみます。
mm = pixel × 25.4 ÷ dpi
は前回からの変更箇所。
前回のソースから削除されている部分もあります。
<!-- index.html -->
<!DOCTYPE html>
<html>
<head>
<title>pixel to mm Conversion</title>
<link rel="stylesheet" type="text/css" href="links/rule.css">
</head>
<body bgcolor="#696969">
<script src="links/action.js"></script>
<center>
<div id="main_box">
<br>
<font size="4">pixelとppi指定でmm値を計算</font>
<p>
<input type="text" id="pixelInput" size="5"
style="text-align:right">	pixel  
<input type="text" id="ppiInput" size="5"
style="text-align:right">	ppi  
<button onclick="convertPixelToMM()"
style="background-color: #00ffff">変換計算</button>  
<button onclick="window.location.reload();"
style="background-color: #ffc0cb">リセット</button>
</p>
<p id="result"></p>
</div>
</center>
</body>
</html>
<!-- index.html -->
/* rule.css */
div#main_box {
height: 150px;
width: 500px;
background: #f0fff0; /* honeydew */
margin: 50px auto;
}
/* rule.css */
/* action.js */
function convertPixelToMM() {
var pixelValue =
parseFloat(document.getElementById("pixelInput").value);
var ppi =
parseFloat(document.getElementById("ppiInput").value);
if (!isNaN(pixelValue) && !isNaN(ppi)) {
var mmValue = (pixelValue * 25.4 ) / ppi;
var formattedMMValue = mmValue.toFixed(2);
document.getElementById("result").textContent =
ppi + "ppiの " + pixelValue +
"pixelは\u3000凡そ "+ formattedMMValue + "mm";
} else {
document.getElementById("result").textContent =
"無効な入力です。pixelとppiに有効な数値を入力してください。";
}
}
/* action.js */
前回の・・・
HTMLのコーディングは一気に設計すると奈落に落ちます（05）2023/08/27
との差異を確認してください。
TCDW7778
もう少し我慢すれば栗ご飯にお月見団子
しかし、あと数日で8月も終わりなんですよね〜。そしてギラギラの残暑モードステージの始まりです。取りあえず、もう少し我慢すれば栗ご飯にお月見団子のボーナスステージ（^o^）
月曜日, 8月 28, 2023
Blender Study Notes 25
クリースとベベルウェートで面をフラットに
例えば円柱を後からサブディビジョンサーフェースなどでメッシュの密度を上げようとすると形状が丸まってしまいますが、その回避処理です。他の形状にも応用が利きます。
Blender
この連載は以下を参照してください。
円柱のメッシュ調整は作成直後であれば調整可能ですが、後からこのパネルは表示できないようです。そこでクリースとベベルウェートを活用してみます。その前に、［オブジェクト］＞［ビューポート表示］にて［ワイヤーフレーム］にチェックを入れておくと、メッシュの状況を常に目視できるのでお薦めです。
コレで準備完了です。
編集モードにて無調整でサブディビジョンサーフェースを行うと上の様に悲しい球体になってしまいます。
最も一般的な他の3Dツールでも同様に処理出来る［面を差し込む］を幅を最低値で処理します。［面を差し込む］は他のツールでは［ベベル処理］という場合もあります。
コレで丸め込みは解除できますが、完全にフラットとは言いがたいです。
そこで、無調整でサブディビジョンサーフェースを設定した状態で編集モードにて［トランスフォーム］＞［平均クリース］を最大値1.00とすると・・・
選択面はフラットになります。
同様に無調整でサブディビジョンサーフェースを設定した状態で編集モードにて［トランスフォーム］＞［平均ベベルウェート］を最大値1.00とし、サブディビジョンサーフェースの上にベベルを設定してもフラットになります。両者の違いは円柱だとわかりにくいので立方体で比較してみます。
立方体をサブディビジョンサーフェースで球体とし・・・
※編集モードで確認した状態
クリースとベベルウェートを処理した結果です。
ベベルとサブディビジョンサーフェースを適用させた状態です。メッシュの生成結果が異なります。
Blender 3.6.0
TCDW7777
今日でTCDWは7777回目になりました
I publish my work every day, and today is the 7777th time I have done so. Since December 29, 2003, it has been 7182 days today, but there are some days when I uploaded more than one in a day, so it is 7777.
相変わらずダラダラと毎日作品を公開して、今日で7777回目になりました。
2003年12月29日からなので、今日で7182日ですが、1日に複数アップした日もあるので7777です。思えば、SNSは全て自発的スタートではなく紹介と依頼でした。まさかこんなに続くとは思っていませんでした。暇なんですね〜（^o^）
日曜日, 8月 27, 2023
HTMLのコーディングは一気に設計すると奈落に落ちます（05）
前回のソースをHTML、CSS、JavaScriptに分けてみました。
は前回からの変更箇所。
前回のソースから削除されている部分もあります。
index.htmlと同じ階層に作成したlinksフォルダーにrule.cssとaction.jsを入れる。
<!-- index.html -->
<!DOCTYPE html>
<html>
<head>
<title>mm to pixel Conversion</title>
<link rel="stylesheet" type="text/css" href="links/rule.css">
</head>
<body bgcolor="#696969">
<script src="links/action.js"></script>
<center>
<div id="main_box">
<br>
<font size="4">mmとppi指定でpixel値を計算</font>
<p>
<input type="text" id="mmInput" size="5"
style="text-align:right">	mm  
<input type="text" id="ppiInput" size="5"
style="text-align:right">	ppi  
<button onclick="convertMMtoPixel()"
style="background-color: #ffd700">変換計算</button>  
<button onclick="window.location.reload();"
style="background-color: #40e0d0">リセット</button>
</p>
<p id="result"></p>
</div>
</center>
</body>
</html>
<!-- index.html -->
/* rule.css */
div#main_box {
height: 150px;
width: 500px;
background: #add8e6;
margin: 50px auto;
}
/* rule.css */
/* action.js */
function convertMMtoPixel() {
var mmValue =
parseFloat(document.getElementById("mmInput").value);
var ppi =
parseFloat(document.getElementById("ppiInput").value);
if (!isNaN(mmValue) && !isNaN(ppi)) {
var pixelValue = (mmValue * ppi) / 25.4;
var formattedPixelValue = pixelValue.toFixed(2);
document.getElementById("result").textContent =
ppi + "ppiの " + mmValue +
"mmは\u3000凡そ "+ formattedPixelValue + " pixels";
} else {
document.getElementById("result").textContent =
"無効な入力です。mmとppiに有効な数値を入力してください。";
}
}
/* action.js */
土曜日, 8月 26, 2023
Wings3Dでモデリング 08
回転体用のIllustratorデータ読み込み手順
前回触れたIllustratorデータ読み込んで回転体のベースとする手順を整理しました。チョット面倒くさいです。
Windows、macOS、Linuxに対応しています。
まずIllustratorでベースを作成します。手順としてはストロークを［パスのアウトライン］で図形化します。ただし、後述するようにハンドル付きのデータではなくカクカクのデータがベストです。また保存時はレガシーバージョンIllustrator3でAi形式で保存します。それ以外の形式（eps、svg等）で保持するとうまくいきません。
Illustratorからデータを書き出したらWings3Dで［File］＞［読み込み］＞［Adobe Illustrator(ai)...］で読み込みます。その際［辺の分割数］は［0］がベストです。
ハンドルのある曲面データを［辺の分割数=0］で読み込んだ状態です。曲面には成りません。実は［辺の分割数=1］以上でも分割数が増えるだけで曲面には成りません。Wings3Dの場合、全選択後に右クリックで［スムース（catmull-Clark）］で分割面を増やし、［View］＞［Proxyモード切替（選択のみ）］としてから・・・
右上の歯車のアイコンの右隣のアイコンで［スムーズシェーディング］で滑らかに表示します。
上はハンドルのある曲面データを［辺の分割数=1］で読み込んだ状態です。コレであればハンドル無しのカクカクデータを綺麗な分割で作成したデータの方がベスト・・・
ということで、ハンドル無しのカクカクデータを綺麗な分割で作成したデータを［辺の分割数=0］で読み込むと・・・
データは平面ではないので・・・
1. 1面だけを選択
2. 右クリックして［押し出し（採取）］を選び
3. 軸方向を指定し
4. 立方体から離して
5. 切り取った平面以外を削除
次に余計な辺を全て削除（※）します。
続けて面選択で全選択してから右クリックで［リフト］を選び、回転軸となる辺を選択し・・・右クリックすれば回転体となりますが、Shiftキーを併用すれば、15°刻みで固定できるので、15°〜45°ぐらいに指定して取りあえず2面作成します。ここでは30°で処理しました。
ただし、ベース面を全選択モードで選択し、全面モードに切り替えて全選択し、右クリックで［接合］を選べば完璧です。［スムーズ（Catmull-Clark）］で綺麗な結果を得ることが出来るはずですが・・・
基点部分が出っ張ってしまい、修正方法が解りませんでした。前回の様に全てWings3D上で処理していれば問題ありませんが、恐らくIllustratorデータの読み込みに謎がありそうです。
そこで、完全に片面選択（面選択モードのみの処理）で処理を行い、頂点選択モードにすると、基点部分が選択されているので・・・
全ての頂点を選択し、全選択モードでに切り替えて選択を解除し、
全面モードに切り替えて全選択し、右クリックで［接合］を選べば完璧です。［スムーズ（Catmull-Clark）］で綺麗な結果を得ることが出来ます。
Wings3D 2.2.9（Windows）
TCDW7775
食欲は落ちませんが、思考回路は機能停止
エルボパイプ星人。これはシリーズか出来るかも・・・。しかし、狂ったように毎日暑いですね〜。食欲は落ちませんが、思考回路は機能停止（>_<）そして・・・この反動で、もしかして冬は極寒？
金曜日, 8月 25, 2023
HTMLのコーディングは一気に設計すると奈落に落ちます（04）
最後にカラー設計でひとまず完了です。
は前回からの変更箇所。
前回のソースから削除されている部分もあります。
<!-- index.html -->
<!DOCTYPE html>
<html>
<head>
<title>mm to pixel Conversion</title>
<style type="text/css">
/* CSSによるmain_box設定 */
div#main_box {
height: 150px;
width: 500px;
background: #add8e6; /* lightblue */
margin: 50px auto;
}
</style>
</head>
<body bgcolor="#696969">
<!--#696969はdimgray -->
<center>
<div id="main_box">
<br>
<font size="4">mmとppi指定でpixel値を計算</font>
<p>
<input type="text" id="mmInput"
size="5" style="text-align:right">	mm  
<input type="text" id="ppiInput"
size="5" style="text-align:right">	ppi  
<button onclick="convertMMtoPixel()"
style="background-color: #ffd700">変換計算</button>  
<!-- #ffd700はgold -->
<button onclick="window.location.reload();"
style="background-color: #40e0d0">リセット</button>
<!--#40e0d0はturquoise -->
</p>
<p id="result"></p>
</div>
</center>
<script>
function convertMMtoPixel() {
var mmValue =
parseFloat(document.getElementById("mmInput").value);
var ppi =
parseFloat(document.getElementById("ppiInput").value);
if (!isNaN(mmValue) && !isNaN(ppi)) {
var pixelValue = (mmValue * ppi) / 25.4;
var formattedPixelValue = pixelValue.toFixed(2);
document.getElementById("result").textContent =
ppi + "ppiの " + mmValue +
"mmは\u3000凡そ "+ formattedPixelValue + " pixels";
} else {
document.getElementById("result").textContent =
"無効な入力です。mmとppiに有効な数値を入力してください。";
}
}
</script>
</body>
</html>
<!-- index.html -->
<style>〜 </style>がHTML内のCSS
登録:
投稿 (Atom)
