日曜日, 10月 04, 2026
土曜日, 10月 03, 2026
Let's start JavaScript 113
任意の比率の%を指定の%に変更したときのサイズ
ちょっと面倒くさい処理が必要で、任意の比率(%)のサイズを指定の比率(%)に変更したときのサイズを表示するHTMLを作成しました。サイズはmmですがpxでも同じです。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>縮尺変換計算</title>
<style>
body {
font-family: sans-serif;
max-width: 300px;
background: black;
color: white;
margin: 10px auto;
padding: 20px;
}
label {
display: block;
margin-top: 15px;
}
input {
width: 100%;
box-sizing: border-box;
padding: 8px;
font-size: 16px;
}
#result {
margin-top: 25px;
padding: 15px;
background: #f0f0f0;
font-size: 20px;
font-weight: bold;
color: black;
}
</style>
</head>
<body>
<h2>比率変換</h2>
<label>
現在の比率(%)
<input type="number" id="currentRate" value="30" step="0.01">
</label>
<label>
変更後の比率(%)
<input type="number" id="targetRate" value="50" step="0.01">
</label>
<label>
現在のサイズ
<input type="number" id="currentSize" value="100" step="0.01">
</label>
<div id="result">
変更後のサイズ:166.67
</div>
<script>
function calculate() {
const currentRate =
parseFloat(document.getElementById("currentRate").value);
const targetRate =
parseFloat(document.getElementById("targetRate").value);
const currentSize =
parseFloat(document.getElementById("currentSize").value);
if (
isNaN(currentRate) ||
isNaN(targetRate) ||
isNaN(currentSize) ||
currentRate === 0
) {
document.getElementById("result").textContent =
"正しい数値を入力してください";
return;
}
// 現在の比率 → 変更後の比率
const newSize = currentSize * (targetRate / currentRate);
document.getElementById("result").textContent =
`変更後のサイズ:${newSize.toFixed(2)}`;
}
document.querySelectorAll("input").forEach(input => {
input.addEventListener("input", calculate);
});
calculate();
</script>
</body>
</html>
実行直後のデフォルト画面です。
値を変更スレがライブで変更後のサイズが表示されます。
ラベル:
HTML,
JavaScript
金曜日, 10月 02, 2026
TCDW8907
ハンドルネームは思い出せても本名が思い出せなくて
大昔、よく深夜にデニーズに集まって朝までコーヒーしていた頃が懐かしく、「あの時のメンバーは今?」と思い出そうにも、数名はハンドルネームは思い出せても本名が思い出せなくて苦笑い。そういえば、既に数名は鬼籍に入っていました(>_<)。
ラベル:
illustration,
Photoshop,
TCDW
木曜日, 10月 01, 2026
VS Codeでソースコードの自動インデント
VS Codeはデフォルトでソースコードの自動インデントが出来ます。
こんなソースも以下のショートカットで・・・
mac_OS版は
[command A]>[shift option F]
Windows版は
[controlA]>[shift alt F]
綺麗に書き換えてくれます。
TCDW8906
塩素水のようなプールの水ですぐに頭痛が発生したから
中学の頃はプールの授業が苦手でした。当時の学校プールは高濃度の塩素水のような水で、すぐに頭痛が発生したからです。気分が悪くて何度か見学したのですが、泳げないから逃げていると揶揄する同級生がいました。海なら泳げたんですけどね。得意なのは伸し泳ぎと平泳ぎです。ちなみに父からの伝授です。
ラベル:
3D,
Cute Baby Alien,
modo,
TCDW
水曜日, 9月 30, 2026
Dreamweaverの環境設定とインターフェース
まさかの2回目ですが、前回でも触れている部分を含んでおり、本当に基本的なことだけです。
Dreamweaverのファイル管理をお復習い 2026/09/26
まずデフォルトでは[左右に分割]となって居ますが・・・
[表示]>[分割]>[上下に分割]で・・・
切り換えることが出来ます。
また、[Dreamweaver]>[環境設定]はデフォルトで問題ありませんが・・・
、[Dreamweaver]>[環境設定]>[コードヒント]は適宜切り換えると良いかも。最もデフォルトの[開始タグの">"の入力後]が一番おすすめですがそれぞれの処理を以下にまとめました。
["</"の入力後]
<body></ → <body></body>
[開始タグの">"の入力後]
<body> → <body></body>
[閉じない]
<body></body> → <body></body>
※ところでDreamweaverが苦手な理由の一つにパレットのオンオフ処理があります。
Dreamweaverでは[適用]をクリックしてもパレットは閉じず[閉じる]をクリックする必要があります。他のAdobe ツールでは[OK]で閉じてくれるので混乱してしまいます。それと表示文字サイズをVisula Studio Codeのようにcommnad +やー(※)で調整出来ないストレスが・・・。
※windows環境ではcontrol+やー
なお、他のエディターでも同様ですが,任意のテキストを入力後に[tab]キーを押すとタグと閉じタグとじて処理されます。
kaizu-tag [tab]
↓
<kaizu-tag></kaizu-tag>
ちなみに後日JavaScriptネタとして整理しますが、ユーザー定義のタグにはHTMLとして以下のルールがあります。
<kaizu> NG
<kaizu-tag> OK
<my-kaizu> OK
<kaizu-component> OK
ラベル:
Dreamweaver,
HTML
TCDW8905
送料が発生するので取りあえずキャンセル
ときどき購入していた商品がAmazon Now扱いになって、送料が発生するので、取りあえずキャンセル。調べて見たらプライム会員でも割引はあるものの、送料が掛かることを知りました。でも、頑張って検索すれば、非Amazon Now扱いも選べました。しかし、いつまで続くかな?
ラベル:
illustration,
Photoshop,
TCDW
火曜日, 9月 29, 2026
Bambu Studio Lessons 21
同じSTLでも3Dツール毎に印刷結果が激変します
同じSTLでも3Dツール毎に印刷結果が激変するので、3Dツールで有機的な形状を作成する場合は要注意です。
私は現在キャラクター作成は基本modoで作成しています。上は[TAB]キーでサブディビジョン設定した状態です。
構造はこんな感じ。
で、実際のデータはこんな状態で、[TAB]キーでサブディビジョン設定した状態でSTL書き出してBambu Studioに読み込んで処理しています。
Bambu Studioに読み込んだ状態。
プレビューで印刷結果を確認した状態。曲面は滑らかになっています。実際に印刷はしていませんが、ここで見えている状態でプリントされます。
momoでobj書き出ししたデータをBlenderに読み込んだ状態(スムース表示)です。そのままSTL書き出してBambu Studioに読み込んで処理しています。
Bambu Studioに読み込んだ状態。
プレビューで印刷結果を確認した状態。曲面は滑らかになっていません。STLを読み込んだままの結果です。実際に印刷はしていませんが、ここで見えている状態でプリントされます。
[モディファイアー]>[モディファイアーを追加]>[生成]>[サブディビジョンサーフェース]にて[ビューポートのレベル数]を1にして適用し、STL書き出してBambu Studioに読み込んで処理しています。
Bambu Studioに読み込んだ状態。
プレビューで印刷結果を確認した状態。曲面はおおむね滑らかになっています。実際に印刷はしていませんが、ここで見えている状態でプリントされます。
今回のデータの場合、Blenderで[モディファイアー]>[モディファイアーを追加]>[生成]>[サブディビジョンサーフェース]にて[ビューポートのレベル数]を2ぐらいにして適用すればmodoのデフォルトと同等の結果になります。
modo 17.1v1
Bambu Studio 2.8.3.66
Blender 5.2.1
ラベル:
3D,
Bambu Studio,
Blender,
modo
登録:
投稿 (Atom)















