日曜日, 5月 18, 2025
土曜日, 5月 17, 2025
HTMLとCSSの様々な表現 23
化学式や関数の上付き文字と下付き文字の設定
化学式や関数の上付き文字と下付き文字の設定は<sup>と<sub>
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>上付き文字と下付き文字</title>
<style>
body {
background: paleturquoise;
text-align: center;
line-height: 5px;
color: black;
}
</style>
<body>
<H4>硫酸の化学式は</H4>
<!-- 下付き文字は<sub></sub> -->
<H1>H<sub>2</sub>SO<sub>4</sub></H1>
<br>
<H4>二次関数の問題</H4>
<!-- 上付き文字は<sup></sup> -->
<H1>y=2(x-3)<sup>2</sup>+1</H1>
</body>
</html>
上付き文字は<sup></sup>で囲み
下付き文字は<sub></sub>で囲みます。
金曜日, 5月 16, 2025
JavaScriptでAI遊び 48
指定半径の三角形からN角形を描画(改訂版)
だいぶ前にアップした「指定半径の三角形からN角形を描画」の改訂版です。
ページの中心に指定した多角形までを全て描画することにしました。それぞれレイヤーで分かれているので後処理も楽です。
JavaScriptでAI遊び 40 指定半径の三角形からN角形を描画 2025/04/03●
function drawPolygons() {
if (app.documents.length === 0) {
alert("ドキュメントを開いてください。");
return;
}
var doc = app.activeDocument;
var artboard =
doc.artboards[doc.artboards.getActiveArtboardIndex()];
var artboardBounds = artboard.artboardRect;
// アートボードの中央座標
var centerX = (artboardBounds[0] + artboardBounds[2]) / 2;
var centerY = (artboardBounds[1] + artboardBounds[3]) / 2;
// ユーザーに最大のN角形の辺数を入力させる(最小3)
var maxSides = parseInt(prompt
("最大N角形の辺の数を入力してください(3以上):", "6"), 10);
if (isNaN(maxSides) || maxSides < 3) {
alert("正しい値を入力してください(3以上)。");
return;
}
// ユーザーに半径を入力させる
var radius = parseFloat(prompt
("多角形の半径(mm)を入力してください:", "50"));
if (isNaN(radius) || radius <= 0) {
alert("正しい半径を入力してください。");
return;
}
// mmをIllustratorの単位に変換
var unitConversion = 2.83465; // mm -> pt
radius *= unitConversion;
for (var sides = 3; sides <= maxSides; sides++) {
var angleStep = (2 * Math.PI) / sides;
var pathPoints = [];
for (var i = 0; i < sides; i++) {
// 上を基準に回転
var angle = -Math.PI / 2 + angleStep * i;
var x = centerX + radius * Math.cos(angle);
var y = centerY + radius * Math.sin(angle);
pathPoints.push([x, y]);
}
// パスの作成
var polygon = doc.pathItems.add();
// 始点と終点を結ぶ
polygon.setEntirePath(pathPoints.concat([pathPoints[0]]));
polygon.closed = true;
polygon.stroked = true;
polygon.filled = false;
}
alert("三角形から " + maxSides + " 角形まで描画しました!");
}
drawPolygons();
実行したらN角形までの数を入力後に半径値を入力すれば・・・
ページの中央に描画されます。
ラベル:
Illustrator,
JavaScript
木曜日, 5月 15, 2025
Photoshopに配置するaiファイルに要注意
Photoshopに配置するaiファイルに要注意。普段はIllustratorのデータをPhotoshopに配置したいときはコピー&ペーストでやっているので気がつきませんでしたが・・・
配置(埋め込み&リンク)をすると、配置を確定する前であればサイズ調整可能ですが・・・
確定後は出来なくなります。こんな仕様だった?と焦ってしまいましたが、少し古いバージョンでも同様でした。
ただし、SVGyPDFそして2020形式以外の形式で書き出したファイルであれば問題ないことを確認しました。これはバグ臭いですね?
整理するとこんな感じです。
ラベル:
Illustrator,
Photoshop
水曜日, 5月 14, 2025
Let's start JavaScript 67
HTML上で温度単位相互変換ツール
HTML上で温度単位相互変換ツールを作ってみました。
計算式は・・・
摂氏から華氏=(華氏-32)×5÷9
華氏から摂氏=(摂氏×9÷5)+32
摂氏からケルビン=摂氏+273.15
華氏からケルビン=(華氏-32)×5÷9+273.15
ケルビンから摂氏=ケルビン-273.15
ケルビンから華氏=(ケルビン-273.5)×9÷5+32
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, initial-scale=1.0">
<title>温度単位 相互変換ツール</title>
<style>
body {
font-family: Arial, sans-serif;
text-align: center;
margin: 50px;
background-color: black;
color: white;
}
input {
padding: 8px;
font-size: 16px;
width: 120px;
text-align: center;
}
.container {
display: flex;
justify-content: center;
gap: 20px;
align-items: center;
margin-bottom: 10px;
}
label {
font-size: 18px;
font-weight: bold;
}
</style>
</head>
<body>
<h2>摂氏 ⇄ 華氏 ⇄ ケルビン 変換ツール</h2>
<div class="container">
<label>摂 氏 (°C): </label>
<input type="number" id="celsius" oninput="convertFromCelsius()" placeholder="0">
</div>
<div class="container">
<label>華 氏 (°F): </label>
<input type="number" id="fahrenheit" oninput=
"convertFromFahrenheit()" placeholder="32">
</div>
<div class="container">
<label>ケルビン (K ): </label>
<input type="number" id="kelvin" oninput=
"convertFromKelvin()" placeholder="273.15">
</div>
<script>
// 摂氏を求める
function convertFromCelsius() {
let celsius = parseFloat(document.
getElementById("celsius").value);
if (!isNaN(celsius)) {
document.getElementById("fahrenheit").
value = ((celsius * 9/5) + 32).toFixed(2);
document.getElementById("kelvin").
value = (celsius + 273.15).toFixed(2);
} else {
clearFields();
}
}
// 華氏を求める
function convertFromFahrenheit() {
let fahrenheit = parseFloat(document.
getElementById("fahrenheit").value);
if (!isNaN(fahrenheit)) {
let celsius = (fahrenheit - 32) * 5/9;
document.getElementById("celsius").
value = celsius.toFixed(2);
document.getElementById("kelvin").
value = (celsius + 273.15).toFixed(2);
} else {
clearFields();
}
}
// ケルビンを求める
function convertFromKelvin() {
let kelvin = parseFloat(document.
getElementById("kelvin").value);
if (!isNaN(kelvin)) {
let celsius = kelvin - 273.15;
document.getElementById("celsius").
value = celsius.toFixed(2);
document.getElementById("fahrenheit").
value = ((celsius * 9/5) + 32).toFixed(2);
} else {
clearFields();
}
}
function clearFields() {
document.getElementById("fahrenheit").value = "";
document.getElementById("celsius").value = "";
document.getElementById("kelvin").value = "";
}
</script>
</body>
</html>
表示直後の状態
摂氏を入力すると、摂氏に対応している華氏とケルビンを表示
摂氏を入力すると、摂氏に対応している摂氏とケルビンを表示
ケルビンを入力すると、ケルビンに対応している摂氏と華氏を表示
ラベル:
HTML,
JavaScript
火曜日, 5月 13, 2025
Excel VBA 45
Excelで選択したセルの和暦を西暦に変換
Excelで選択したセルの和暦を西暦に変換します。手動でメニューから変更するのが面倒なので作りました。
Sub ConvertToSeireki()
Dim cell As Range
Dim seireki As Date
' 選択範囲の各セルを処理
For Each cell In Selection
If IsDate(cell.Value) Then
' 西暦に変換
seireki = CDate(cell.Value)
cell.Value = Format(seireki, "yyyy年m月d日")
End If
Next cell
End Sub
"yyyy年m月d日"の部分を変更することで処理結果を調整出来ます。
和暦を選択して実行・・・
処理結果。
ラベル:
Excel,
VBA,
Visual Basic
TCDW8400
先週の木曜あたりから喉の調子が悪くて・・・
先週の木曜あたりから喉の調子が悪くて土曜日に主治医に診て貰ったら、チョット炎症しているというのでトラネキサム酸を処方して貰ったのですが、アレは美白効果があるとか。市販の喉の薬には概ね含まれているそうです。
ラベル:
illustration,
Photoshop,
TCDW
月曜日, 5月 12, 2025
Illustratorでの作図基本 18
正方形から回転とブレンドで花を作成
正方形から回転とブレンドで花を作成します。
正方形を作成し手90度回転し・・・
ダイレクト選択ツールで両端のコーナーを最大限内側に寄せてレンズ形状にします。
そのなな45度回転コピーを3回くりかえして上図の様にし・・・
全体をグループ化します。
続けて40%の縮小コピーを作成し、カラーリングを任意調整します。
そのままブレンドツールをステップ数3で実行し、
拡張してからグループ解除します。
ここで、上図のようにと飛び飛びの選択をおこない、22.5度回転させます。
これで花のイメージが完成します。
少しアクセントを付けただけでも、いい感じのイメージになります。
ラベル:
Illustrator
日曜日, 5月 11, 2025
ホワイトバランスカードを自作してみた
これは以下の様になります。
R: 105, G: 105, B: 105
C: 56, M: 47, Y: 44, K: 0
Hex (16進数):
#777777(中間グレー)
反射率 18% のグレー
カメラや測光では、18% の反射率が「中間グレー」として使われる。
sRGB 値では (105, 105, 105) で表される。
Lab 色空間では L ≈ 50* に相当する。
「黒 50%」(K=50%) は「反射率 18% のグレー」より明るい(約 35–40% 反射)。
ディスプレイ上の「50% グレー」(RGB 128,128,128) も 18% グレーより明るい(約 22–25% 反射)。カメラや測光の基準では「中間グレー」=「反射率 18%」=「Lab L = 50」。
印刷の「黒 50%」は「反射率 18% のグレー」より約 10% ほど明るい。よって、「黒 50%」と「反射率 18% のグレー」は 厳密には異なる ものの、用途によっては 近い基準 として扱われることがある。
これを厚手のマット用紙に印刷してお菓子の箱程度の厚紙(※)に貼れれば完璧です。写真の右が自作品で、左が市販のホワイトバランスカードです。
※インクジェットプリンタ用紙に入っている厚紙がい感じです。
グレー(18%反射グレー)
ホワイトバランス設定 & 露出補正
基準色としてカメラが正しい色を認識できる
白(高反射ホワイト)
ハイライトの確認 & 白飛び防止 最大輝度の基準
適正露出の判断
黒(低反射ブラック)
シャドウの確認 & 黒つぶれ防止 最小輝度の基準
コントラスト調整
ラベル:
Color,
Do It Yourself,
photo
TCDW8398
一番は絹巻(有平糖に煎餅を巻きつけたもの)
Baby Alien 084
鬼瓦の子供(^o^)
ラベル:
3D,
Baby Alien,
modo,
TCDW
土曜日, 5月 10, 2025
露出計シリーズ07
【SUNCNE LIGHT METER HS-1010】
露出計ではなく照度計です。4年前に購入した機種(既に壊れて廃棄)の予備で購入したタイプ。正直オモチャ風ですが問題なく動作しています。照度計は「露出計の代用になる」の実験用で購入しました。廃棄した機種も以下に登場しています。
Panasonic LUMIX DMC-G3
LUMIX G VARIO 14-42mm/F3.5-5.6 ASPH
金曜日, 5月 09, 2025
Blender Study Notes 57
デシメートの分割の復元回数は奇数偶数が重要
デシメートで高密度のメッシュを低密度にする際、分割の復元回数が奇数と偶数で劇的にメッシュ状態が変わります。チョット面白いです。
この連載は以下を参照してください。
前回作成したデータ(※)で解説します。
なお、デシメート設定はオブジェクトモードでないと出来ないので、メッシュの状態を確認するためにビューポートシェーディングを[ワイヤーフレーム]に切り替えます。
切り替えた直後の状態です。
スパナアイコンの[モディファイアー]>[モディファイアーを追加]>[生成]>[デシメート]を開き・・・
[分割の復元]を選択し・・・
回数を[1]に設定するとメッシュ構造が激変します。
回数を[2]に設定するとメッシュ構造が戻ります。
回数[2]で[デシメート]を確定し、ビューポートシェーディングを[マテリアルプルビュー]に切り替え、編集モードにした状態です。
回数を[3]に設定するとメッシュ構造が激変します。
回数[3]で[デシメート]を確定し、ビューポートシェーディングを[マテリアルプルビュー]に切り替え、編集モードにした状態です。
ラベル:
3D,
Blender,
Blender Study Notes,
Illustrator
登録:
投稿 (Atom)