土曜日, 7月 27, 2024
金曜日, 7月 26, 2024
HTMLとCSSの様々な表現 13
HTMLだけで電気分解式などを作る時の注意点
今回はHTMLだけの処理です。HTMLだけで塩化ナトリウムの電気分解式を例に注意点を整理しました。
上付き文字 <sup>a</sup>
下付き文字 <sub>a</sub>
上付き文字 <sup><font size="1">a</font></sup>
下付き文字 <sub><font size="1">a</font></sub>
という処理もありです。
事の発端は汎用性を持たせるために以下の記述をしたのですが、上図のように謎の半角?スペースが入ってしまい大混乱。
<body bgcolor="palegoldenrod">
<h4>
塩化ナトリウム(食塩)
N
<sub>a</sub>
<sup>+</sup>
+Cl
<sup>−</sup>
=N
<sub>a</sub>
Cl
</h4>
</body>
<h4>
塩化ナトリウム(食塩)
N
<sub>a</sub>
<sup>+</sup>
+Cl
<sup>−</sup>
=N
<sub>a</sub>
Cl
</h4>
</body>
取りあえずⒶの+とイコールの前後にスペースを入れて体裁を整えました。
<body bgcolor="palegoldenrod">
<h4>
塩化ナトリウム(食塩) 
N
<sub>a</sub>
<sup>+</sup>
+ Cl
<sup>−</sup>
= N
<sub>a</sub>
Cl
</h4>
</body>
塩化ナトリウム(食塩) 
N
<sub>a</sub>
<sup>+</sup>
+ Cl
<sup>−</sup>
= N
<sub>a</sub>
Cl
</h4>
</body>
ここで10日ほど放置して、気休めに一行で記述したところ、謎のスペースがなくなりました。
<body bgcolor="palegoldenrod">
<h4>
塩化ナトリウム(食塩)
N<sub>a</sub><sup>+</sup>+Cl<sup>−</sup>=N<sub>a</sub>Cl
</h4>
</body>
塩化ナトリウム(食塩)
N<sub>a</sub><sup>+</sup>+Cl<sup>−</sup>=N<sub>a</sub>Cl
</h4>
</body>
ここで、改めてⒶの+とイコールの前後にスペースを入れて体裁を整えました。コレで完成です。
<body bgcolor="palegoldenrod">
<h4>
塩化ナトリウム(食塩) 
N<sub>a</sub><sup>+</sup> + Cl<sup>−</sup> = N<sub>a</sub>Cl
</h4>
</body>
塩化ナトリウム(食塩) 
N<sub>a</sub><sup>+</sup> + Cl<sup>−</sup> = N<sub>a</sub>Cl
</h4>
</body>
木曜日, 7月 25, 2024
JavaScriptでAI遊び 20
選択オブジェクトを回転コピー
Illustratorで選択したオブジェクトを回転コピーさせます。
/* circle_copy.jsx */
// Illustratorのドキュメントを取得
var doc = app.activeDocument;
// 選択中のオブジェクトを取得
var selection = doc.selection;
// 選択があるか確認
if (selection.length > 0) {
// 最初の選択オブジェクトを取得
var selectedObject = selection[0];
// コピーを作成する回数
var numCopies = 12;
// 30度ごとに回転して120%拡大してコピーを作成
for (var i = 1; i <= numCopies; i++) {
// 回転角度(30度ずつ)
var rotationAngle = i * 30;
// コピーを作成
var copiedObject = selectedObject.duplicate();
// 120%拡大
copiedObject.resize(100, 100, true, true, true, true, 100);
// 回転と位置調整
copiedObject.rotate(rotationAngle, true, true, true, true, Transformation.BOTTOMLEFT);
}
} else {
alert("Please select an object.");
}
/* circle_copy.jsx */
回転のp中心点は上図のようにオブジェクトの左下になります。
デフォルトでは30度で12個コピーさせます。回転方向は時計回りです。
五角形の処理結果です。
自由形状で・・・
処理したら・・・
任意の色を塗りつぶし、ベースのオブジェクト以外を全て[乗算]とした結果です。ショートカット登録すると、チョット便利です。
ラベル:
Illustrator,
JavaScript
水曜日, 7月 24, 2024
Illustratorの2種類のアンカーとは?
質問がありましたので・・・
Illustratorでは、文字にカーソルを近づけると、ベースポイントならマゼンタでアンカーと表示される部分とグリーンでアンカーと表示される2種類のアンカーがあります。これはマゼンタのアンカーがオブジェクトのアンカー。グリーンのアンカーがグリフのアンカーとなります。ここで、フォントとグリフの違いを理解する必要があるので簡単に整理しました。
フォントは、デザインスタイルが統一された文字、数字、記号の集合体で、次のような特徴がある。
デザインスタイル:フォントは、特定のデザインスタイルに基づいている。例えば、Arial、Courier、Timesなどは異なるデザインのフォント。
サイズや太さ:フォントはアウトライン、イタリック、ボールドなど異なるサイズや太さで提供。
デジタルフォント:デジタル環境では、フォントはコンピュータ上で文字を表示するためのファイル形式として存在する。例として、TrueType(.ttf)やOpenType(.otf)がある。
■グリフ (Glyph)
グリフは、文字の具体的な形状や姿を指し、グリフには次のような特徴がある。
具体的な形状:グリフは、フォント内の個々の文字の具体的な形状。例えば、アルファベットの「K」という文字は、異なるフォントで異なる形状のグリフを持つ。
複数のグリフ:1つの文字に対して複数のグリフが存在する場合がある。例えば、小文字の「k」は手書き風フォントなら曲線的であり、サンセリフフォントなら直線的といった感じ。
特殊記号やダイアクリティカルマーク:特定の記号やアクセント記号もグリフの一部。例えば、アキュートアクセント付きの「é」やウムラウト付きの「ü」など。
■フォントとグリフの違い
集合体と個々の形状:フォントは文字の集合体であり、グリフはその集合体の中の個々の形状を指す。
概念と具体性:フォントはデザインスタイルの概念。グリフは具体的な視覚(形状)表現。
デザインの違い:異なるフォントは異なるグリフのセットを持ち、同じ文字でも異なる見た目になる。
まず[環境設定]>[スマートガイド]にて、[スマートガイド]を表示にしておきます。それぞれのアンカーの色は個々で設定できます。
次ぎに[表示]メニューで[スマートガイド]と[グリフにスナップ]にチェックを入れます。
通常はフォント全体を示すアンカーポイントだけは目視出来ます。
このアンカーポイントにカーソルを乗せると[アンカー]が表示されるので、必要に応じてスナップしたりします。
[グリフ]を表示にしていると、フォントの任意のいちカーソルを乗せると[グリフ]が表示される。
実はこの[グリフ]の位置は文字をwアウトライン化したときのアンカーポイントの位置となります。
ラベル:
Illustrator
TCDW8108
ホームメイドの水羊羹のお供で猛暑を乗り切っています
Baby Alien 012
わっ、お菓子がいっぱい(^o^)
ラベル:
3D,
Baby Alien,
modo,
TCDW
火曜日, 7月 23, 2024
一般電卓と関数電卓での入力の違い
A)CASIO fx375 ES A 2019/08発売
B)Canon F-502G 2009/01発売
C)iPhone 12mini 2020/11発売
D)Canon HS-1210TS 2004/11発売
※改めて調べると発売されてから2024年で
Aは5年、Bは15年、Cは3年、Dは20年経過しています。
ちなみに購入価格はA,Bはほぼ同一で、Dはその2.5倍でした。
今気がついたのですが、SHARP製があれば主要3社が揃いますね。
※比較している電卓は、私が所有している機種で、それぞれの発売時期だけでなく、仕様そのものが同一ではありませんので、機能を比較する内容ではありません。単なる備忘録です。
--------------
例えば以下のような計算の場合・・・
112歯から7mm引くと何歯?
1歯は0.25mmなので、112 − 7 × 4 = 84となります。
コレをそれぞれの電卓で処理すると・・・
A,B,C)112 − 7 × 4 = 84
D)112 − 7 × 4 = 420 ← 不正解
D)112 M+= 7 × 4 M−= RM 84
A,B,Cを使ってしまうとDには戻れないです。
--------------
あるいは以下のような計算の場合・・・
112歯から7mm引くと何mm?
1歯は0.25mmなので、(112 − 7 × 4 ) ÷ 4 = 21となります。
コレをそれぞれの電卓で処理すると・・・
A,B,C,D)112 − 7 × 4 ÷ 4 = 105 ← 不正解
A)[(]112 − 7 × 4 [)] ÷ 4 = 21
A,B,C)112 − 7 × 4 = ÷ 4 = 21
D)112 M+= 7 × 4 M−= RM ÷ 4 = 21
--------------
単純な平方根処理(その1)・・・
√3 = 1.732050808
A) √■ 3 = 1.732050808
※3 √■ = Syntax Error ← 正しい結果
B,C,D)と同じ流れを取った場合
B,C,D)3 √ = 1.732050808
※3 √ 本来この表記はオカシイですね。
※Cの √ は 2√x 二乗根キー
--------------
単純な平方根処理(その2)・・・
3√3 = 1.732050808
A)3 √■ 3 = 5.196152423
B,C,D)3 × 3 √ = 5.196152423
※本来この表記はオカシイですね。
※Cの √ は 2√x 二乗根キー
--------------
単純な平方根処理(その3)・・・
( 3√3 ) ÷ √5 = 2.323790008
A)3 √■ 3 = ÷ √■ 5 = 2.323790008
B,C,D)3 × 3 √ ÷ 5 √ = 2.323790008
※本来この表記はオカシイですね。
※Cの √ は 2√x 二乗根キー
--------------
また以下の様な四則演算だけでも・・・
− 9 ÷ 4 × 2.7 + 9 − 2 = 0.925
A) − 9 ÷ 4 × 2.7 + 9 − 2 = 37 / 40
※デフォルトが分数表記、 SHIFT = で少数表記
A,B,C,D) − 9 ÷ 4 × 2.7 + 9 − 2 = 0.925
D) − 9 M+= ÷ 4 × 2.7 + 9 − 2 = 0.925
--------------
同じように・・・
49 − 23 × 12 ÷ 7 − 30 = 9.571428571
A)49 − 23 × 12 ÷ 7 − 30 = 67 / 7
※デフォルトが分数表記、 SHIFT = で少数表記
B,C)49 − 23 × 12 ÷ 7 − 30 = 9.571428571
D)49 − 23 × 12 ÷ 7 − 30 = 14.571428571 ← 不正解
D)49 M+= 23 × 12 ÷ 7 M−= − 30 RM 9.571428571
D)49 M+= 23 × 12 ÷ 7 M−= − 30 = RM 9.571428571
--------------
パーセントを含んだ場合も・・・
1015 + ( 2015 × 14.5% ) =1307.175
A)1015 + 2015 × 14.5 SHIFT ( = 28913 / 40
SHIFT ( で %
B)1015 + 2015 × 14.5 2ndF = = 1307.175
2ndF = で %
C)1015 + 2015 × 14.5 %+− = 1307.175
D)1015 + 2015 × 14.5 %+− = 1331230.5 ← 不正解
D)1015 M+= 2015 × 14.5 %+− M+= RM 1307.175
--------------
三角関数ならば・・・
sin30 × cos15 ÷ tan = 1.80244213
A) sin 30 ) × cos 15 ) ÷ tan 15 ) = ( 3√6 + 5√2 ) / 6
※デフォルトが分数表記、 SHIFT = で少数表記
※ sin で sin( となる。 cos tan も同様。
B,C)30 sin × 15 cos ÷ 15 tan = 1.80244213
D)三角関数未対応
--------------
という具合に、チョット込み入った場合は数式通りの記述の関数電卓が簡単です。
ラベル:
Calculator,
Hardware
TCDW8107
9月末ぐらいまで続くと考えると謎汗が噴き出します
朝6時に起床すると一汗かいていて外は既にギラギラ状態。仕事部屋に入れば既に室温は32度。何の罰ゲームなのか考えながらアイスコーヒーを入れるルーチンが、9月末ぐらいまで続くと考えると謎汗が噴き出します。
ラベル:
illustration,
Photoshop,
TCDW
月曜日, 7月 22, 2024
Illustratorで作成するカレンダーの日だまは列で考える
Illustratorで作成するカレンダーの日だまは列で考え他方が合理的です。
こんな感じです。
1週間分作成したら・・・
反対側の列も作成します。コレで全ての組み合わせに対応出来ます。
例えば日曜1日から始まる月から・・・
土曜1日から始まる月まで対応出来ます。ただし、6行目が出来てしまう場合は・・・
このように分数表記する必要があります。
ラベル:
Illustrator
登録:
投稿 (Atom)