テクノなまこ

科学の力

HHKB等の外部キーボードからiPhoneを操作するときに使えるショートカット集

HHKB等の外部キーボードからiPhoneを操作するときに使えるショートカット集を調べても出てこないので総当たり的に調べた。iOS固有のものと各アプリが設定しているものがある。

 

iOS

win + H ホームに戻る

win + space アプリ検索画面

win + shift + 3 スクリーンショット撮影

win + shift + 4 スクリーンショット撮影

win + → ホーム画面での右スワイプ

win + ← ホーム画面での左スワイプ

win + ↓ ホーム画面でウィジェットが表示されている場合、そのアプリを起動する

win + ctrl + Q スリープモード

ctrl + space 言語切り替え

shift + →or← 選択領域の拡縮

win + A 全選択

win + C コピー

win + V 貼り付け

 

chrome

win + L 検索

win + T 新規タブ

win + W タブを閉じる

win + @ ブラウザバック

win + [ ブラウザフォワード

ctrl + tab 次のタブ

ctrl + shift + tab 前のタブ

 

safari版bluesky

ctrl + shift + enter 投稿

 

ちゃんと調べていないがsafariにはもっと多くのショートカットがある

参考 

iPadとiPhoneのショートカットキー(キーボードショートカット)

 

公式のはずだが、網羅的に載ってない

Adjust the onscreen and external keyboard settings on iPhone - Apple Support (BH)

pythonで、Unicodeのランダムな文字を出力するコード例

ランダムなUnicodeの文字を一つ表示するプログラム

import unicodedata
import random

def uni():
    while True:
        n = random.randint(0,0x10FFFF)
        if not unicodedata.category(chr(n)) in ["Cn", "Co"]:
            break
    return chr(n)

print(uni())

解説
unicodedata.category()は、文字を入れるとUnicodeのカテゴリー名が返ってくる関数で、カテゴリー名にはLo(普通の文字)、Nl(数字)、Cc(制御文字)などがある。上のコード例では、Cn(未定義)やCo(私用領域)以外の文字が出てくるまで、Unicodeの最大範囲(0から0x10FFFF、両端含む)でランダムな整数を作って無限ループしている。

カテゴリー名の一覧(公式)
Unicode Character Categories
カテゴリー名の一覧(日本語)
サポートされているUnicode一般カテゴリ | CS+ V4.01.00

PILとmatplotlibで画像の色を抽出しグラフ化する

pythonで画像から色を抽出したい」と検索すると
Image Color Extraction with Python in 4 Steps | by Boriharn K | Towards Data Science
のような記事が出てくるが冗長である。処理ごとにコードを書かれるとコピペの手間もかかるしもったいぶらずにコードを全部載せてほしいし色を抜き出すところだけ見せてほしい。なのでこの記事にもっとずっと短いものを載せた。


上の記事で具体的に色を抽出する箇所は一行だけであり、それは、extcolors

extcolors.extract_from_image(img, tolerance = 10, limit = 5)

のような関数で実現できる。imgはPILの画像、toleranceは色をまとめる強度(0から100をとり、100で一色になる)、limitは色数の上限である。パスから直接読み込む場合は

extcolors.extract_from_path(img_url, tolerance = 10, limit = 5)

を使う。
これらの関数は色のタプルを含むちょっと入れ子になっているタプルを返す。

([((181, 198, 218), 18953), ((123, 152, 194), 18193), ((76, 83, 89), 8629), ((36, 46, 108), 5575), ((117, 118, 121), 4289)], 65536)

((赤, 青, 緑), ピクセル数)という構造が色の数だけ続いていて、最後に総ピクセル数がある。このタプルから割合を出すにはちょっと計算がいる。
このタプルを扱いやすい配列にしてグラフにするコード例↓
1.pngから5つの代表的な色を抜き出してグラフにしたいとする

import PIL
import matplotlib.pyplot as plt
import extcolors

filename = "1.png"
n = 5

img = PIL.Image.open(filename).resize((256,256)) #軽量化のため、縮小
colors, pixelCount = extcolors.extract_from_image(img, tolerance = 12, limit = n)
colorCodes = ['#{:02x}{:02x}{:02x}'.format(*rgb[0]) for rgb in colors]
colorRates = [rgb[1] for rgb in colors]
plt.pie(colorRates,labels=colorCodes,colors=colorCodes)
plt.savefig(filename+"_Color.png")
plt.show()

pillowは優秀なので、1.jpgとか1.jfifとか他フォーマットでも処理できる

出力

色分布を三次元散布図にする
from matplotlib import pyplot as plt
import cv2 as cv2
import numpy as np

img = cv2.imread("1.png")
img = cv2.resize(img,(64,64))

print(img)
r = img[:,:,2]
g = img[:,:,1]
b = img[:,:,0]

rgb = np.dstack((r, g, b))
rgb_flat = rgb.reshape((rgb.shape[0]*rgb.shape[1], 3))
def rgb_to_hex(rgb):
    return '#{:02x}{:02x}{:02x}'.format(*rgb)
cCodes = np.apply_along_axis(rgb_to_hex, 1, rgb_flat)

# print(cCodes)
fig = plt.figure()
ax = fig.add_subplot(1, 1, 1, projection='3d')
ax.scatter(b, g, r, c=cCodes,alpha=1)
plt.show()

出力

リーマンの微分不可能関数の複素拡張をmatplotlibでプロットしアニメーションにする

リーマンのフラクタル - 完全無欠で荒唐無稽な夢
↑何年か前、この記事で面白い自己相似曲線があることを知った(このブログではほかにもいろいろな自己相似曲線を扱っていて面白い)。 形がとてもかっこよくて気に入ったので年明け後にJSを使っていろいろページを作ったりした
Weierstrass-Riemann function
Weierstrass-Riemann function variables 1
Weierstrass-Riemann function variables 2←調節できる

絵の背景に使ったりもした

しかしSNSに上げるにはgifとかの方がうれしいのでプロットしてみることにした

1000x1000のgifを描くプログラム

#part-a
import random, numpy as np, math
from matplotlib import pyplot as plt
from matplotlib.animation import ArtistAnimation
from matplotlib.animation import FuncAnimation

def riemann(t,k):
    v = 0
    w = 0
    for i in range(k):
        v += np.cos(t*(i+1)**2)/((i+1)**2)
        w += np.sin(t*(i+1)**2)/((i+1)**2)
    return [v,w]
    
fig=plt.figure(figsize=(10,10))

def plot(k):
    plt.cla()
    t = np.arange(-np.pi,np.pi,0.0001)
    plt.plot(riemann(t,k+1)[0],riemann(t,k+1)[1],color="black",linewidth=0.5)
    
    plt.xlim(-1.35,1.65)
    plt.ylim(-1.5,1.5)
#     plt.xlim(0.5,1)
#     plt.ylim(0.5,1)
    plt.xlabel("Re",fontsize=20,fontfamily='Times New Roman')
    plt.ylabel("Im",fontsize=20,fontfamily='Times New Roman')
    
    plt.text(0.6,1.2,r'$\phi(t)=\sum_{k=1}^{n} \frac{e^{ik^2t}}{k^2}$',fontsize=30,math_fontfamily='cm')
    plt.text(0.9,-1.2,r'n={}'.format(k+1),fontsize=30,math_fontfamily='cm',fontfamily='serif')
    
    plt.title("Riemann's non-differentiable function\n",fontsize=25,math_fontfamily='cm',fontfamily='Times New Roman')


anim = FuncAnimation(fig, plot, frames=20,interval=500)
anim.save('Weierstrass-RiemannFunction5.gif', writer='pillow', dpi=100)

fig.show()

2000x2000の画像を描くプログラム

#part-a
import random, numpy as np, math
from matplotlib import pyplot as plt
from matplotlib.animation import ArtistAnimation
from matplotlib.animation import FuncAnimation

def riemann(t,k):
    v = 0
    w = 0
    for i in range(k):
        v += np.cos(t*(i+1)**2)/((i+1)**2)
        w += np.sin(t*(i+1)**2)/((i+1)**2)
    return [v,w]
    
fig=plt.figure(figsize=(10,10),dpi=200)

def plot(k):
    plt.cla()
    t = np.arange(-np.pi,np.pi,0.0001)
    plt.plot(riemann(t,k+1)[0],riemann(t,k+1)[1],color="black",linewidth=0.5)
    
    plt.xlim(-1.35,1.65)
    plt.ylim(-1.5,1.5)
#     plt.xlim(0.5,1)
#     plt.ylim(0.5,1)
    plt.xlabel("Re",fontsize=20,fontfamily='Times New Roman')
    plt.ylabel("Im",fontsize=20,fontfamily='Times New Roman')
    
    plt.text(0.6,1.2,r'$\phi(t)=\sum_{k=1}^{n} \frac{e^{ik^2t}}{k^2}$',fontsize=30,math_fontfamily='cm')
    plt.text(0.9,-1.2,r'n={}'.format(k+1),fontsize=30,math_fontfamily='cm',fontfamily='serif')
    
    plt.title("Riemann's non-differentiable function\n",fontsize=25,math_fontfamily='cm',fontfamily='Times New Roman')
    
    plt.savefig('riemann.png')


plot(999)

[1910.13191] Intermittency of Riemann's non-differentiable function through the fourth-order flatness
ここの記事をみると虚部にπtを足すと別のかっこいい形になるらしいので描いた


その他、拡大

数学gifBot凍結されてしまってとても悲しい

JavaScriptで同一ドメインの他ページのhtmlからタイトル要素を取得する

JavaScriptで同一ドメインの他ページのhtmlからタイトル要素を取得する方法。ITリテラシーがなく、調べるのに半日もかけてしまった

ふとん.htmlからタイトルを読み込みたいとする

<html>
<head>
	<title>読み込みたい</title>
</head>
<body>
 
<script>

  fetch("ふとん.html")
  .then(response => {
    return response.text();
  })
  .then(body => {
       var m = body.match(/<title>(.*)<\/title>/);
        document.write(m[1]);
  });

 </script>
</body>
</html>

jQueryライブラリのAjax関数を使う場合

<html>
<head>
	<title>読み込みたい</title>
</head>
<body>
  <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
  <script>

  $.ajax({
      type: 'GET',
      url: 'ふとん.html',
      success: function(data) {
         var t = data.match(/<title>(.*)<\/title>/);
          document.write(t[1]);
      }
  });

 </script>
</body>
</html>

参考

taishi41228さん Ajaxで取得したHTMLからタイトルを取得する方法 - Qiita
tacamyさん jQuery.ajax()の代替としてFetch APIをざっくり使ってみる - tacamy--blog

Meshroomによるフォトグラメトリ入門

Meshroomでフォトグラメトリを始めたら躓くところがいくつかあったので書き残すことにした。ポイントは、写真のメタデータを消しておくことと、GPUがないと動かない計算工程をショートカットすること。

 

ダウンロードして起動する

https://alicevision.org/#meshroom

ウィンドウが2つ開く。cmdみたいな真っ黒なほうのウィンドウはエラーメッセージや計算の進捗を確認するやつで閉じてはいけない。

 

写真を最低20枚くらい用意する

少ない経験則で推奨されるものと苦手なものを列挙する。

 

推奨されるもの:

広い平面部を持つもの(本など)

ざらざらしていたり、表面に細かいパターンのあるもの(布、壁紙、本など)

形が単純なもの(本など)

物の全体が写っているもの←他のサイトでは言われているがあまり効果を感じない

 

苦手なもの:

つるつるしているもの(レゴなど)

細すぎるもの(花など)

凹凸が多く、少ない角度差によって見え方が大きく変わるもの(花、道具箱の中など)

角度によって写る色が変わるもの(ガラス、金属など)

 

悪いものは、完成品が荒いというレベルではなくそもそもほとんどメッシュができない。良いものでもぼやっとしてあまりうまくいかない。運だめしに近い。

 

 

前処理する

デジカメで撮った写真など、メタデータがついているものはエラーが出ることがあるのでRalphaというソフトで一括してメタデータを剥がす。この工程は飛ばしてエラーが出てみてからやってもいいかもしれない。ノートPCで撮った写真は大丈夫だった。

 

ドラッグアンドドロップで追加し

 

メタデータ設定を開き

 

こういう設定にして

 

元あったところと別に出力フォルダを設定する。こうしないと変換前の画像が混ざって面倒くさい。

 

変換を実行する(変換という名前だが元あったファイルは書き換えられず新しく作られる)

 

変換した写真を左のエリアにドラッグアンドドロップする

 

GPUがいる部分を消す

下のグラフエディターを拡大する。この部分は基準に対応するハイエンドなGPUがないとエラーを吐くのでDelで消して

こうショートカットする

(ちなみに消すのではなくグラフを付け替えるだけだと、使われなくなったノードがエラーを吐く)

 

保存する

スタートを押す

 

とセーブするように求められるので適当な名前を付けてセーブする

 

計算を始める
もう一度スタートを押す


プログレスバーとグラフエディターにこういう色がつく。緑が計算済み、オレンジが計算中、青が未計算。エラーが出ると計算中のところが赤に変わるので黒いウィンドウのほうでエラー文をコピペしてググる

 

44枚だと1時間半くらいしたら終わる。右の3Dビューアーには推定カメラ位置とドットのようなものができていて、かっこいい

 

 

Texturingノードをダブルクリックするとテクスチャが生成される。5分くらいかかる。

 

 

ほとんどのドットを無視してテクスチャができる。失敗!

 

メッシュデータは、テクスチャリングをした時点でプロジェクトを保存したフォルダの\MeshroomCache\Texturingのフォルダにテクスチャファイルとともにobjファイルとして保存されている




 

比較的うまくいったものhttps://twitter.com/Mikanixonable/status/1507873717019607041/photo/1

Image



このワールドに他の3D作品たちも置いてあるのでぜひ来てほしいです

https://vrchat.com/home/launch?worldId=wrld_639a4f21-aa67-4667-9a4a-d454c580cb3b



 

 



 

 

Blenderとクリスタを使って架空惑星を作る

 

やり方

Blenderをダウンロードしてきてインストールする。https://builder.blender.org/download/

 

f:id:Mikanixonable:20190706120540p:plain

起動する

 

Delで立方体を消し、Shift+A→メッシュ→UV球でUV球を作成する

f:id:Mikanixonable:20190706120740p:plain

 

f:id:Mikanixonable:20190706133301p:plain

セグメントを72くらいに増やし、UVを生成にチェック

f:id:Mikanixonable:20190706153453p:plain

シェーディングをスムーズにしてつるつるにする

f:id:Mikanixonable:20190706120939p:plain

右のメニューから赤い丸いマークをクリック、新規マテリアルを作る

f:id:Mikanixonable:20190706121251p:plain

一つ右の市松模様メニューから新規テクスチャを作る

 

 

 

テクスチャ作り

1:2の画像さえあればいいので面倒なら

https://pbs.twimg.com/media/D3i4DLqUUAAOmw_.jpg

https://pbs.twimg.com/media/D2mj1QHUkAAe6BD.jpg

https://pbs.twimg.com/media/D0AY8abV4AEkWDT.jpg

をダウンロードして使ってください

f:id:Mikanixonable:20190706121859p:plain

横に長い1:2の長方形でクリスタを立ち上げる

f:id:Mikanixonable:20190706122418p:plain

グレースケールで地形を描く。低地は暗く、高地は明るく描く。

f:id:Mikanixonable:20190706122546p:plain

レイヤーを右クリック、レイヤーの変換で画像素材レイヤーを選択、OKで変換する

f:id:Mikanixonable:20190706122725p:plain

レイヤープロパティの立方体を指し示すアイコンを押し

f:id:Mikanixonable:20190706122908p:plain

ツールプロパティのタイリングにチェックを入れ

f:id:Mikanixonable:20190706123012p:plain

シフトを押しながら横にスライドさせる。地図の経度変換ができる。再びラスターレイヤーに変換して、残ったところを描く

f:id:Mikanixonable:20190706125527p:plain

描き終わったところ

f:id:Mikanixonable:20190706125644p:plain

高緯度は実際には横に引き伸ばされるので、地図の上下端の部分は矩形選択の後、縦に圧縮する

f:id:Mikanixonable:20190706125841p:plain

f:id:Mikanixonable:20190706125929p:plain

極座標変換し

f:id:Mikanixonable:20190706130016p:plain

縦に2倍に引き伸ばし

f:id:Mikanixonable:20190706130504p:plain

極付近を描きこみ、逆の手順で直交座標まで戻す

f:id:Mikanixonable:20190706130743p:plain

描きにくい北極付近が埋まった

f:id:Mikanixonable:20190706131524p:plain

上下逆転して同じ手順で変換し南極付近も描きこむ

 

色を着ける

f:id:Mikanixonable:20190706131708p:plain

グラデーションマップを開き好みの色を付ける

f:id:Mikanixonable:20190706131854p:plain

例えばこのように明暗で色相を変えるとそれっぽくなる

f:id:Mikanixonable:20190706131959p:plain

金星に似ている

f:id:Mikanixonable:20190706132254p:plain

海を作っても映える。海岸線はグラデーション要素を限界まで近づけることで表現する

Blenderに戻って作成したテクスチャを開いて

f:id:Mikanixonable:20190706132750p:plain

シェーディングをマテリアルに変え

f:id:Mikanixonable:20190706133017p:plain

Nを押して表示されるメニューからシェーディングをGLSLに変え

f:id:Mikanixonable:20190706133548p:plain

マッピングをUV、UVMap、フラットに設定

f:id:Mikanixonable:20190706133714p:plain

これで一通りが完成。頂点ペイントかスカルプトモードにすると余計な表示が消え存分に鑑賞できる

 

見映えを良くする

f:id:Mikanixonable:20190706145019p:plain

昼と夜をはっきりさせるためオブジェクトモードに戻り、ディフューズをトゥーンにしサイズを1.57にする

f:id:Mikanixonable:20190706145329p:plain

右上のメニューからランプを選択して消し、かわりにShift+Aから無限遠光源であるサンを作成する

f:id:Mikanixonable:20190706145645p:plain

Nを押すと出るメニューのトランスフォームから回転をY-90にするとテクスチャの中央が昼になる

自転させる

f:id:Mikanixonable:20190706150013p:plain

左下隅の◣を上にずらすとウィンドウが分離する

f:id:Mikanixonable:20190706150303p:plain

分離したウィンドウを左下のメニューから時計アイコンのタイムラインに切り替えるとこのようになる

f:id:Mikanixonable:20190706151036p:plain

Iキーで現在の回転情報をキーフレームに固定する。トランスフォームメニューは黄色くなる

f:id:Mikanixonable:20190706151337p:plain

▶▶ボタンで最終フレームに移って回転を設定する。360かその倍数にすればループアニメーションにできる

 

最初のフレームに戻って再生ボタンを押すと自転する。この方法の他にも、照明オブジェクトを回転させる方法もある。

 

このままでは回転が正弦補完されて不自然なので、別ウィンドウを開いて等速回転に変える

f:id:Mikanixonable:20190706151737p:plain

左下メニューからグラフエディタ。Ctrlを押しながらスクロールホイールドラッグで縦横比を調節できる

f:id:Mikanixonable:20190706152007p:plain

f:id:Mikanixonable:20190706152037p:plain

右クリックで選択し、Ctrlを同時に押してこのように曲線部をなくす

f:id:Mikanixonable:20190706152247p:plain

両方を直線にしたところ。何本かのグラフが重複しているので、曲線部が消えないときは複数回クリックして目的のノードを選択する。

f:id:Mikanixonable:20190706153048g:plain

等速回転できた

 

Webから見れるようにする

f:id:Mikanixonable:20190706154423p:plain

Webから見れるようにするには、テクスチャをBlenderファイルに同梱させなければならない。ファイル→外部データ→「すべてBlenderにパック」を選択してから保存する。 

 

https://sketchfab.com/feedはWeb埋め込みで3Dモデルが見れるサービスである。右上からアップロードする

f:id:Mikanixonable:20190706155258p:plain

アップロードした作品のEmbledをクリックし

f:id:Mikanixonable:20190706155201p:plain

埋め込みHTMLをコピーしてきて張ると

 このように埋め込み表示できる。

 

より高度な技術

f:id:Mikanixonable:20190706155803p:plain

・太陽の方を傾ければ、簡単に地軸を表現できる。アニメーションで首を振るように往復運動させると季節を表現できる。

f:id:Mikanixonable:20190706160448p:plain

テクスチャ→影響→ジオメトリをオンにすれば地形の凹凸を表現できる。このとき、テクスチャ作成時に作った白黒標高図を別レイヤーで読み込ませそれのみジオメトリをオンにし、テクスチャ→影響→カラーをオフにし透明にすると、メインレイヤーの色とは別に高低差を表現できる。

また、海の領域をクリスタで二値化→色域選択して陸を透過させたpngとして保存し、別レイヤーで読み込ませ、それのみスペキュラー(光沢)を強くすれば海面の反射を表現できる。

 

f:id:Mikanixonable:20190706161724p:plain

f:id:Mikanixonable:20190706161947p:plain

f:id:Mikanixonable:20190706162002p:plain

f:id:Mikanixonable:20190706162018p:plain

細かいテクスチャを手描きするのは面倒なので、地面や植物の写真をフォトバッシュとして使ってもそれっぽくなる、その際、色域選択で特定の高度だけに重ねると、さらに自然にすることができる。レイヤーを半透明やソフトライトにすると手描き部分となじみやすい。

 

ギャラリー

 

f:id:Mikanixonable:20190706162343p:plain

f:id:Mikanixonable:20190706163709p:plain

f:id:Mikanixonable:20190706163816p:plain

f:id:Mikanixonable:20190706163840p:plain

f:id:Mikanixonable:20190706163912p:plain




地球型架空惑星
 

f:id:Mikanixonable:20190706162604p:plain

f:id:Mikanixonable:20190706163529p:plain

f:id:Mikanixonable:20190706162510p:plain

 

f:id:Mikanixonable:20190706165854p:plain

輪のある赤いガス惑星