ObsidianでmermaidをSVGに変換する - Jazzと読書の日々
やはり書いてみるものだなあ。 Mermaid さっき「Obsidianではどうするのだろう」と書いたら、少しして閃きました。 無意識コンピュータが計算してくれたみたい。 便利にできている。 mm2svg.md 下記のTemplaterスクリプトになります。 <%* mermaid.initialize({startOnLoad: true}) const s = await mermaid.render('id01', tp.file.content) new Notice("convert SVG to clipboard") navigator.clipboard.writeText(s) %> 書いてしまえば簡単。 使い方 mermaidの中身だけテキストに書きmm2svgを実行。 クリップボードにSVGファイルが保存されます。 Excalidrawに貼りつければ完成。 無意識コンピ
TypeScriptを使うと何がうれしい？型チェック以外にも多くのメリット
大規模なアプリケーションを開発するためのプログラミング言語として、JavaScriptを拡張した「TypeScript」の人気が高まっている。8個のQ＆Aを通して、TypeScriptのポイントを解説する。 Q3 結局TypeScriptを使うと何がうれしいの？ A3 静的型チェック以外にも様々なメリットがあります。 TypeScriptの最大の利点は静的型チェックですが、それ以外にもいろいろなメリットがあります。 そもそもTypeScriptは大規模なアプリケーションをJavaScriptで開発できるようにするために誕生しました。このため、大規模開発で有効になるような機能がいろいろと提供されています。ここではその中から利点と言える機能や特徴を5つ紹介しましょう。 （1）未使用の引数やローカル変数をチェックする機能がある TypeScriptには、未使用の引数やローカル変数をチェックする機
使いこなせば開発力アップ、TypeScriptで使える型を理解する
大規模なアプリケーションを開発するためのプログラミング言語として、JavaScriptを拡張した「TypeScript」の人気が高まっている。8個のQ＆Aを通して、TypeScriptのポイントを解説する。 Q4 Structural Typingって何ですか？ A4 「構造が同じなら同じ型と見なす」というTypeScriptの型の方式です。 プログラミングにおいて、2つの式（変数など）が同じ種類の型であるかどうかを判定する方式には、「Structural Typing」（構造的型付け）と「Nominal Typing」（公称的型付け）があります。JavaなどはNominal Typingを採用しています。おそらく、一般的な型チェックのイメージはNominal Typingだと思います。一方、TypeScriptはStructural Typingを採用しています。 Nominal Typ
現代の必修言語「TypeScript」、基になったJavaScriptと何が違う？
大規模なアプリケーションを開発するためのプログラミング言語として、JavaScriptを拡張した「TypeScript」の人気が高まっている。8個のQ＆Aを通して、TypeScriptのポイントを解説する。 Q1 TypeScriptってJavaScriptとどう違うの？ A1 TypeScriptは、JavaScriptに静的型チェックの機能を付けた言語です。 TypeScriptは、JavaScriptに「静的型チェック」の機能を追加したプログラミング言語と言えます。静的型チェックとは、コンパイル時に変数の型の整合性をチェックして、不整合の場合はエラーにする機能です。TypeScriptの“Type”は型を意味します。 言語としては、型を明示的に書くこと以外は基本的に素のJavaScriptと変わりません。ですので、今までJavaScriptを書いてきたプログラマにとって、TypeSc
Obsidian dataviewでメタデータを活用しよう - Jazzと読書の日々
前回、入力ボックスを検討しましたが、別の技がありました。 Dataview dataviewはキーの埋め込みができます。 「key::テキスト」とすると「dv.current().key」で「テキスト」を拾うことができる。 「dv.pages('').key」とすると、全ファイルから「key::なんとか」の部分を集めてきます。 これを「メタデータ」と呼びます。 たぶんdataviewの最大の特徴でしょう。 ただのテキストがそのままデータベースに早変わり。 書式の縛りもない。 このメタデータを応用して「アプリ」を作ることもできます。 Unicode表 文中に「部首::」という一行を設け、その文字を拾って表を作る方法。 部首:: ```dataviewjs a = dv.current().部首 if(a){ k = a.codePointAt(0) s = "" for(i=0; i<500
Obsidian dataviewjsにコピーボタンをつける - Jazzと読書の日々
dataviewは面白いけど、表ができたらそれだけで、そこからの発展がない。 そう思ってました。 でもdataviewの沼は底無しに深かったのです。 インラインJS インラインJSについて調べたとき、Markdown変換のコマンドがあったわけです。 なんのため？ これは「使え」ってことだなあ。 どう使えばいいんだろう？ dv.el() エレメント作成のコマンド。 これもdataviewに用意されている。 HTMLタグをつけるときに使えます。 じゃあ、buttonタグはどうだろう？ もしボタンでクリップボードに表が保存できたら。 それ、いいじゃないか。 コピーボタン テーブルの下に「copy」というボタンが出てきます。 これをタップするとクリップボードにMarkdownが保存される。 貼り付けると、それが表になる仕組みです。 ```dataviewjs s = [ ["阪神", 20, 13
ObsidianでインラインJSを使ってみる - Jazzと読書の日々
書いている途中にスクリプトを埋め込む。 文章とプログラミングの融合。 そんな変な使い方がObsidianならできます。 特殊すぎて頭の切り替えが追いつかない。 基本形 前回、数式を埋め込めることが判明しました。 OK？ 何か難しいですよね。 でも計算式を残すと、なぜその計算をしたか理由もわかる。 反面、他のアプリで開いても計算するわけではない。 一長一短です。 応用編 数式が一本ならいいけど、複数の場合はどうすればいいのでしょうか。 どうやらコンマ区切りで書くことができます。 `$= a=11, b=22, a+b` 変数を使って公式に代入したい場合ですね。 これなら数値を変えながら計算結果を参照できる。 DataviewJS もっと複雑な場合はどうしたらいいでしょうか。 それはdataviewjsにしちゃえばいいわけです。 ```dataviewjs a=11 b=22 dv.span(
Obsidianを簡易電卓として使う方法 - Jazzと読書の日々
簡単な計算をしたいとき、電卓アプリを立ち上げていませんか。 Obsidianなら計算式を書くだけで結果が表示されます。 文章を書く手を止めなくていい。 ちょっとびっくりしました。 Dataview Obsidian - Connected Notes 1.4.4 分類: 仕事効率化,辞書／辞典／その他 価格: 無料 (Dynalist Inc.) Obsidianで「=」を二つ並べるとハイライトになる。 この仕様に困ることがあります。 要らぬところに色がつく。 それで「=」をバッククォートで囲んでみました。 そしたらDataviewがエラーを吐き出したのです。 おやおや、何事か。 このバッククォートとイコールの組み合わせはインライン・コマンドだったのです。 知らなかった。 そして面白い。 これは研究してみよう。 Obsidian plugin: Dataview 書式 Dataviewプラ
WebRTC を理解するためにカメラ映像を送るだけの最小実装を探る
GW なんも予定がなくてブログ書くかソシャゲやるか昼から酒飲むしかやることがないです。だから予定があったら使っていたであろうお金でソシャゲに課金したらめちゃくちゃ強くなりました。やったー。友達にはドン引きされましたが、GW に予定がある人よりかは節約できていると思います。そんなソシャゲもやることなくなって暇なので酒飲みながらブログを書きます。今日は WebRTC です。 免責 筆者は RFC を読んでいません。これは「そもそも WebRTC それ自体 の RFC なんてものは存在しないもんね〜」という意味でなく、ICE や SDP の RFC すら読んでいないという意味です。そのため WebRTC そのものの解説として読むと良くない表現が含まれるかもしれません。ただし自分が WebRTC でカメラ映像を送る実装を動作させ、そのコードの解説という点では間違ったことは書いていないはずです。動作
ObsidianをScrapboxみたいにするプラグイン - Jazzと読書の日々
ありがとう。 2Hop Links Plugin Plus コミュニティプラグインにある「2Hop Links Plugin」はモバイルでは使えませんでした。 インストールできても有効化でFailする。 その状態のまま開発が止まっていた。 ところがどっこい、その修正版を作ってくれた人がいるのです。 うれしい。 インストール Obsidian plugin: Obsidian42-BRAT Obsidian42-BRATを使います。 野良レポジトリをインストールするプラグインです。 このBRATの「Add Beta Plugin」に下記アドレスを入力します。 https://github.com/L7Cy/obsidian-2hop-links-plugin 「Add Plugin」するとコミュニティプラグインに「2Hop Links Plugin Plus」が追加されます。 で、スイッチO
意図的に雑な図形をコードで描く
描画ライブラリを使える環境ならば、たとえば円を描くのに書くコードは一行で済むだろう。ただ、コード一行でほぼ完全な真円を描いてもなにかつまらない。そこであえて意図的に雑な図形をコードで描きたいと考えて試行錯誤した結果、ある程度満足するところまでいったのでその技法について解説を行う。 意図的に雑な線を描く まずは雑な線をコードで表現するために、実際に適当な線を何度も描いてみて特徴を探してみる。そうすると下記のような特徴が現れた。 始点と終点の位置が多少バラける 途中から位置が上下にずれているのに気づきそれを元の位置に直そうとする 上記の内容を3次ベジェ曲線程度で表現するために色々と試行錯誤した結果、下記の手順になった。 始点と終点を用意する 始点から終点までの20%〜40%の地点に点を置く 更に上記の倍の地点に点を置く 4つの点を少しずらす 4つの点をもとに3次ベジェ曲線を描く 以前、Twit
窓辺の小石(109) mermaid作戦
文書に図を入れると内容が把握しやすくなることがある。こうした場合、図は、文書で解説したものと等価なものになる。このため、図を書けば、文章が書きやすくなるし、逆に文章で表現できたなら図も書きやすい。理解したことを図にして確認することで、理解の不足を確認できる。図にしたときに描かれた要素同士の関係や位置づけがはっきりしないのは、そもそも、理解が不足しているからだ。そういうわけで、ある程度理解が進んだときに、短時間でラフな図を描けると、対象の理解が進む。とはいえ、いまさら紙と鉛筆の世界にはあんまり戻りたくない（机の上に紙を広げるようなスペースがないという問題もある）。 テキストから自動的に簡単な図を作るプログラムやサービスがある。矩形や円などの図形で要素を表わし、矢印などのその関係を示す図をテキストから作ることができる。テキストといっても、普通の文章というよりは、プログラムや論理式に近い（写真0
GAS（Google Apps Script）を使ってみましょう
はじめに 授業の準備や資料の整理などの日常業務に際して，GmailやGoogleドライブなど，Googleの機能を使用する機会がある人は少なくないでしょう． この記事では，元々Googleのアプリケーションにおいてメニューやボタンを操作して使用できる機能（Graphical User Interface; GUI）だけではできないことを，簡単なプログラミング技術を使って実現する方法を紹介します． 「プログラミング」「スクリプト」などと言われると苦手意識を持ってしまう方もいるかもしれませんが，この記事では難しい内容や複雑な内容は一切扱いません．GASがどういったものか，その機能や，簡単に始められる方法のみをご紹介します．ご一読の上，ぜひ簡単なところからチャレンジしてみてください． Google Apps Script（GAS）について Google Apps Script（GAS）は，Goo
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Xユーザーのえび＠プログラマーさん: 「最近のプログラミング言語って配列を初期化するときに hoge = [ "a", "b", "c", ] みたいに最後にカンマ付きで終わっても問題ない言語多い すごく便利なの分かるけど やっぱこういうのって 「えっと、この言語はOKだっけ？」 って毎回なるのよね」 / X
Piro🎉"ｼｽ管系女子"ｼﾘｰｽﾞ累計5万部突破!!🎉さんはTwitterを使っています: 「「絶対に入れちゃいかん」とは穏やかでないなと思ったけれど、実際度々事例を観測してるので、警戒は致し方ないや、と思う20年選手の拡張機能開発者の自分。 同様の「知らん間に危険な物になる」問題は、npmやpipやrubygemsでも起こり得るんよな。 こちらはレビューが無い分より深刻かもしれない。」 / Twitter
Reddit - Clipboard monitor on steroids : ObsidianMD
FastStart Script for Obsidian - makes it easy to delay the startup of plugins
Improve Obsidian Startup Time on Older Devices with the FastStart Script
mizchiさんはTwitterを使っています: 「VSCode で使ってるライブラリの .d.ts をピン止めしてコードを書くと、今までとは比較にならないぐらい補完精度が爆上がりして便利だ...」 / Twitter
【初心者向け】GASのできること・できないこととは？使い方や活用法も紹介