2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

JS 画像→グレースケール→ディザリング→点字アスキーアート

Last updated at Posted at 2022-01-01

#つくりたい
discordで点字を使ったアスキーアートが流れてきたのでサクッとスマートに返したかった

#つくる
##グレースケール
まずはinput[type=file]から画像を取得してモノクロ化する
rgbと基準ベクトルの内積をとって明度を取る

let img=new Image();
img.onload=()=>{
	URL.revokeObjectURL(img.src);
	c.width=img.naturalWidth;c.height=img.naturalHeight;//canvasサイズ
	ctx.drawImage(img,0,0,c.width,c.height);//img→canvas
	img=ctx.getImageData(0,0,c.width,c.height);//canvas→imageData
	let mono=new Array(img.data.length/4).fill()//各ピクセルに対応した正規化された明度の配列
		.map((_,i)=>{i*=4;return[...img.data.slice(i,i+4)].map(x=>x/255);})//正規化と整理
		.map(col=>(col[0]*.298912+col[1]*.586611+col[2]*.114478)*col[3]+0*(1-col[3]));//内積をとってアルファを使って背景色と混ぜる
	//ディザリング
	//点字化
};
img.src=URL.createObjectURL(f.files[0]);

##ディザリング
最終的な目標が点字な以上2色しか表現できないのでグレースケールを二値化する
単純な二値化ではディティールも丸潰れなのでノイズを入れてグラデーションを作る
いわゆるディザリング

ディザリングにも数種類あるようだが
今回は誤差拡散法の代表格であるFloyd-SteinbergとAtkinsonを実装する
https://beyondloom.com/blog/dither.html を参考にさせていただいた

const dither=(arr,w,m)=>{
	m=m.map(x=>[x[0]+x[1]*w,x[2],x[0]]);//エラーマップの成形
	for(let i=0;i<arr.length;i++){
		const e=arr[i]-(arr[i]=arr[i]>.5);
		m.forEach(([x,y,z])=>i+x<arr.length&&w-i%w>z&&(arr[i+x]+=e*y));
	}
	return arr;
};
mono=dither(//各ピクセルに対応したBooleanの配列
	mono,//グレースケール
	c.width,画像の横幅
	[//エラーマップ
		//→,↓,weight

		//Floyd-Steinberg
		//[ 1,0,7/16],[-1,1,3/16],[ 0,1,5/16],[ 1,1,1/16]

		//Atkinson
		[ 1,0,1/8],[ 2,0,1/8],[-1,1,1/8],[ 0,1,1/8],[ 1,1,1/8],[ 0,2,1/8]
	]
);

##点字アスキーアート
unicode BMPの28xxには8点式の点字が並んでいる
xxには各点が2進数の各桁に対応した16進数2桁が入る
参考は https://en.wikipedia.org/wiki/Braille_Patterns

1 4
2 5
3 6
7 8

つまり

O X
O O
X X
X O

10010011(2)=93(16)であり\u2893がこれだ
この逆の操作をする

const braille=(arr,w,cfg={gap:[1,1],pad:1})=>{
	const h=Math.ceil(arr.length/w);//高さ
	return new Array(Math.ceil((h+cfg.gap[1])/(4+cfg.gap[1]))).fill().map((_,i)=>
		new Array(Math.ceil((w+cfg.gap[0])/(2+cfg.gap[0]))).fill().map((_,j)=>{
			let p=[j*(2+cfg.gap[0]),i*(4+cfg.gap[1])];//字間行間を考慮して左上の座標を算出
			p=[7,6,5,3,1,4,2,0].map(x=>{//点字の点の配置に注意して2進数に変換
				x=[p[0]+x%2,p[1]+Math.floor(x/2)];
				return x[0]<w?+arr[Math.floor(x[0])+Math.floor(x[1])*w]||0:0;
			}).join('');
			return String.fromCharCode(10240+(parseInt(p,2)||cfg.pad));//文字に変換 10240=2800(16)
		}).join('')
	).join('\n');
};
out.textContent=braille(//点字
	mono,//真偽値
	c.width,//横幅
	{
		gap:[1,1],//字間行間調整
		pad:1//\u2800の字幅が詰められる場合があるので下二桁を置換する
	}
);

#つくった
https://mcbeeringi.github.io/apps/dither.html

元画像
612B142A-59E3-45CB-AE3A-C5CFD479AF4C.gif

ディザリング後
A043D97B-F300-4E2B-BB83-73CC720320FA.png

点字{gap:[1,3],pad:1}

⢯⠿⣛⠟⣛⢯⢷⡽⡽⡳⡰⡰⡑⣌⢌⡌⣢⠦⠲⠲⠲⡱⣉⢎⠶⡱⣉⢎⢚⠝⡬⣢⢣⣓⡝⡓⡝⣬⣢⢓⠝⢇⢬⣢⢓⠝⡬⣢⢓⠝⡜⡜⡌⡈⣊⢎⢻⢛⣛⠻⢻⢛⣛⢟⢏⢮⢮⢿⣿⡿⣇⢈⡘⡘⡘⡘⡘⡘⣌⢦⠲⡲⠲⠴⡝⠄
⡞⢟⠮⢬⠺⣚⣜⣜⣜⡱⡡⡡⡡⡰⡙⢌⣡⠢⢡⣡⡱⣩⠱⣉⢤⢣⠛⡜⣌⡱⡵⣩⢊⡌⣌⠲⠛⡜⣤⢥⢫⣓⢸⢍⠮⠲⡑⡡⣃⢥⡢⡓⣅⠥⡉⣌⣦⢧⣣⢳⢳⣛⢟⢶⢞⠷⡵⣙⢭⣻⡿⣽⠢⢣⢣⢣⢧⠳⡙⢌⠦⠶⠁⠁⠄⠁
⡳⠶⡷⣹⣵⣵⣵⡱⡵⡹⠢⠡⠣⡙⠌⣨⢒⠱⠩⣈⠲⣉⢣⡓⠭⡲⣖⠵⢏⢏⣘⢌⣌⢓⢌⢆⡌⣘⢡⢋⢚⢦⡚⡝⢏⢦⠳⡑⣃⢢⢣⢓⠙⢈⡘⡙⣬⡲⣝⢭⣛⡝⣜⡱⣏⠶⡳⢏⢦⢣⣻⣷⣟⡤⡊⢎⢆⢦⠲⠱⠡⠁⠄⠄⠈⠁
⢧⣫⢳⢳⣕⡵⡧⡳⣝⠴⡡⡁⡁⢂⠣⡋⢎⢎⠖⡔⡔⣍⢮⢖⠵⡱⡥⠣⡛⢎⣊⡚⣕⣭⢯⢚⡝⣎⣧⣮⣎⡞⡜⡙⣌⢆⢣⠳⡙⡌⠪⠒⠜⠜⠤⡱⠹⡙⣎⡞⣓⢫⣓⢭⣚⡬⡱⣡⣎⢦⡳⢻⣷⢿⣧⢤⡌⠌⠁⠁⡁⠄⠁⠂⡐⠁
⡞⡟⡝⡜⡙⣎⣎⢮⢮⡖⡑⠄⡄⡄⡰⣉⠨⢠⡱⡱⡱⣡⢣⢋⡸⡩⣊⢦⠷⡝⡑⣙⣌⢮⢧⡲⢻⢻⣛⣯⡾⡾⣳⣽⣷⣅⠎⠦⠳⡙⢎⠦⢣⠚⢌⢪⠶⡳⢣⢓⣍⠞⡞⡝⡝⢳⢳⡝⣜⠶⢮⠶⡝⣽⣿⡿⠁⠐⠁⠁⠐⠈⡀⠁⠂⠁
⣧⣏⢌⠂⠱⠳⡝⡝⡭⣋⣉⠆⠢⠣⢎⠎⡌⠲⢌⠣⠳⢡⡡⡙⢣⠳⡉⢌⢆⢤⠳⡙⠞⡖⡕⡲⡙⡝⣭⡿⢷⣳⣽⣻⣻⣯⣳⣿⣦⡱⡑⢨⢠⣘⢎⡌⣎⡜⢧⠟⠞⠴⠵⡳⡙⣔⡵⡹⡹⣎⢦⢣⡩⡎⠄⠁⠂⡐⠁⠠⠂⠁⠐⠄⢀⠆
⡹⡘⡜⡌⢆⢧⣧⣧⣧⢳⠣⠂⠆⠱⠒⢉⠚⠘⣈⢊⢆⢤⣡⠥⣉⢌⢢⡑⣉⢌⢢⠳⡫⠳⡛⠵⡳⢮⣞⣏⣻⢾⣷⢿⣟⣽⣽⣿⣷⣟⣷⠘⡜⡜⡜⡜⡞⡮⡖⡴⣥⡀⢀⠴⡻⡚⠖⡕⣍⣍⢫⠳⠁⠁⠈⠠⠂⠁⠐⠁⠁⡀⡡⡸⣜⠆
⠂⠃⠉⡐⡑⡹⢻⣛⣎⢎⠆⠂⣁⠰⣀⢄⠤⡡⣈⢜⣌⢤⡥⢢⠜⠬⣆⢇⣉⢌⢌⢇⣅⣦⢧⢢⣓⡙⣭⣯⣯⡻⣞⢷⡽⣽⣾⡿⣾⣯⡷⣟⣿⡄⡉⢢⢞⢶⣭⣲⡜⡄⠁⠁⠢⡱⢳⠶⡵⡭⡋⠁⠐⠠⠐⠁⠁⠁⠂⠁⠐⡜⡓⣭⣮⡅
⡐⡄⡄⠄⠤⣎⢶⠷⡹⡱⡡⡀⡠⡱⡑⡄⢣⢆⠲⣑⠌⣼⡌⢄⣌⠦⠣⡱⣱⡝⢴⠳⡜⣌⢢⠶⡽⡯⣫⣳⣹⣯⣳⣽⣽⡷⣯⣾⣳⡽⣟⣽⢿⣿⣧⢈⢍⣝⡳⣏⢗⠉⡀⠐⣀⣾⣻⣿⣿⡆⠁⠄⠂⠐⠠⠂⠠⠁⠐⠶⡳⢶⠷⡵⡼⠇
⠰⠱⠱⠱⡑⡴⣭⣎⣎⢦⠣⠢⢢⢣⢣⠣⢃⢉⡘⢎⢎⣏⢌⢊⢈⢌⢢⠖⠍⢩⢪⠦⡱⣭⢧⢧⡳⡽⣫⣞⡭⣳⣻⣻⣯⣯⣯⣯⣳⡽⣻⣽⣯⢾⣷⣷⡝⣍⡭⣩⢣⣢⡾⣻⣾⣿⢿⣟⡿⣿⠁⠂⠈⡀⢀⠁⠄⢠⣩⢦⢻⢳⣝⣝⡗⡇
⡑⡑⡑⡑⢜⡵⣵⣵⡳⡇⣁⠂⠊⠊⠒⠘⣄⠣⣉⢈⣾⡜⣌⡔⡱⣁⢃⠒⡜⡔⣬⢦⠷⣡⢫⢮⢻⢻⡻⡻⡻⡟⡾⡳⢷⣳⣭⢾⣞⣧⣳⣽⠷⡽⣳⣭⡳⣯⢷⣻⣟⢾⣻⣽⢯⣿⡾⣿⣿⡇⠁⠂⠁⠁⠠⠠⠲⡝⣜⣜⢴⡹⢻⢽⣝⡄
⠌⡌⡌⡌⡬⡻⡻⡞⡞⡗⠓⠈⢊⢊⠒⠑⠜⡐⡅⠡⣯⠳⡱⣱⡓⣉⠎⡚⢞⠶⡝⣜⡴⣭⡻⣚⢏⢶⢷⢷⡵⡷⡷⡾⢻⢳⢏⢞⢷⢳⢗⡞⡜⣼⡽⣳⣭⢿⣟⢯⢯⢾⡿⣿⣿⢷⠷⣱⡽⠁⠂⠁⠠⠁⢀⡜⡹⡝⢽⣻⢶⠷⣙⣭⡳⡁
⡑⡑⡑⡑⢣⠳⣫⣫⣫⣋⠊⠂⢊⢊⢊⢊⡉⣂⢐⠄⣯⣧⡻⡓⡭⣎⢦⠳⣃⢳⡙⢥⢥⣩⣪⢛⢌⡱⣉⢣⡶⣅⠻⢏⣋⡜⢦⢓⠷⢧⡷⣯⣾⣷⣯⣾⢿⣟⣟⣟⡿⣟⡷⡯⠞⡌⡴⣽⠁⠁⠁⠂⠁⢠⣱⢧⠮⣜⡼⡽⢮⡼⣙⡴⡭⠆
⢌⢌⢌⢆⢦⢳⢳⢽⢯⡳⢃⢂⠤⠢⠢⠢⠱⡉⡈⠑⣿⣞⢮⠲⢣⡤⢢⠳⢛⢎⢋⡜⡴⠧⣃⣋⠚⢑⠉⠐⠱⠍⡌⠆⠂⠂⢀⡴⣫⡿⣽⣻⢿⡿⣟⡞⣷⣯⣯⢟⠡⡠⡱⣥⡼⣯⠁⠁⠄⠁⠂⠄⡐⡱⣩⣫⣎⠺⡞⣓⣬⢺⢳⢏⣎⠇
⠌⠰⡰⡒⡙⣌⣞⢟⢎⢎⣌⠐⢑⠱⠱⠬⠢⢂⢌⠦⡄⣿⣏⣏⠊⢪⠲⡱⣡⢄⣆⢧⠂⠑⠡⠃⠁⠆⠁⠉⡀⠌⠎⡤⢠⢋⢾⡽⣹⢻⡟⡽⣹⣽⡷⣝⡁⢆⢣⢣⢳⢳⢗⠏⠁⠁⠐⡀⠁⠐⢀⢢⡲⡱⡹⣓⣬⡾⡼⢮⣲⣳⠻⢞⢏⡃
⠡⠑⠤⡡⡱⣙⣝⣏⢏⡝⠦⠠⡰⡘⡘⡆⠦⠢⡒⢓⠦⡐⣟⣽⢡⢋⠒⡑⣍⠫⡘⢄⠡⠈⡈⡈⠂⡴⠁⡀⠁⢀⠴⡡⣬⣧⣽⣼⣼⢶⢯⣳⣽⣯⣳⣻⣹⢠⠑⡘⠳⡙⠁⡀⠄⠁⠐⠁⠐⠁⢡⠫⢓⡝⡝⡝⢎⢎⣎⣚⢗⡝⡮⡞⡕⡄
⢢⠅⢌⠚⢌⢦⣧⣧⢯⢫⢋⢊⢢⢢⢒⢑⢄⣐⢤⣡⣃⣐⣹⡌⠞⢆⢋⢌⠁⡀⠁⠁⠌⠁⠁⠂⠣⡁⡂⠁⠞⡴⡵⡵⣵⣻⣞⢗⡵⡹⣻⢿⢿⣟⣿⣯⣾⠎⠁⠈⢘⠔⢈⠄⠄⠠⠂⠁⠌⠰⡹⣚⠵⣙⢣⣋⢮⡞⣧⢯⢫⠳⣡⣋⢎⠃
⢌⠋⠆⠣⠣⡛⡟⡞⣝⢧⠳⡈⢊⢊⠘⠜⠜⠰⠙⠜⡑⣌⠏⠞⡬⣢⠄⠰⠁⠄⢀⠤⠁⢈⠌⠰⠡⠁⠦⡵⣵⣵⣽⣟⠗⡝⡝⣝⢭⠾⡝⣽⣯⣯⣻⣿⣽⢣⠠⠁⡐⣗⠁⠁⢁⠈⠠⠁⢠⡎⢎⢎⢣⢫⢻⣛⡽⡵⡴⣱⢧⡳⡙⣬⣣⡂
⢂⠊⠘⠘⡘⢓⡝⣜⣵⣽⣌⠠⢢⢣⠲⠸⡄⡰⣱⢮⠾⢶⠼⠠⠃⢁⡌⠆⠁⡡⢘⠁⢣⠁⠁⠁⢠⢣⢣⡷⣹⠷⡁⠉⠋⡘⠘⢎⢦⠻⡛⢮⢾⣟⠞⠞⠊⠌⠌⠂⢂⣧⠠⠠⡐⠁⢀⠐⡼⡲⡷⡳⢇⢫⢶⢯⡛⠼⡳⣛⢟⣓⡝⡙⣌⠅
⢌⢌⢌⠌⢌⢴⡵⡜⣎⡝⣌⠠⡠⢆⠤⡨⠊⢂⡏⣾⠎⠈⢀⠎⢀⠠⢘⠲⠁⠁⠁⠁⠐⠁⢀⡝⡾⣯⣟⠞⡔⡤⡐⢦⢂⢾⡻⣈⢌⢎⠶⡽⣿⠲⡑⣌⣏⠂⢀⠂⠄⢿⢈⠎⠠⠐⠁⣬⢆⣱⡵⣣⣓⢭⢦⡵⣥⢧⣦⣏⣙⡜⡖⡵⡹⡃
⠌⡌⡨⡰⠐⠵⡽⣹⣻⣛⣌⠤⣉⢄⡱⣙⢖⢅⠜⠄⡂⣈⠢⠃⠈⠘⣆⢙⡡⠁⠁⠐⠁⢀⠏⡿⡿⠋⡘⢇⡜⢶⢷⡬⣜⢞⢖⢶⡝⣌⠲⡽⣟⢶⠷⡣⠱⠑⠠⢀⠠⢼⠤⡁⠁⠈⢠⣡⣋⢮⡳⡩⣋⢞⣜⣥⡳⣙⣜⡵⣦⣾⣟⣾⣽⡃
⠠⠄⢁⢀⢀⣬⣮⣧⣝⡝⠬⠂⢃⢉⢢⢉⡈⣈⢂⠜⣘⢡⠂⠂⠄⠁⠁⡀⢎⣇⠁⠁⢠⢡⣳⠓⠁⠒⠱⡹⣓⣙⣝⣽⣻⣝⣝⢚⡙⣍⢦⢞⣿⢣⢣⢇⠦⡓⠌⠠⡁⢸⢸⠁⢂⠁⣎⣓⡭⣫⣓⠶⡽⡼⣎⣌⢧⡥⣹⣻⣯⣳⣽⣯⣻⡇
⠁⢈⠐⠄⠐⡙⣜⡽⡹⣜⡖⠰⢌⡍⡸⢂⠓⠑⡑⡜⠎⠇⡀⠐⢀⠂⠱⡤⢉⠂⠁⡠⣑⠿⠁⠁⡔⡉⣊⢇⠣⠳⡱⣙⣝⢏⢏⢎⢎⢖⠕⣥⣿⣧⣣⢮⠦⠂⠠⢂⠃⠠⡏⡀⠁⢧⡱⣙⣍⣍⢮⢓⡙⣙⡕⡙⡜⣼⡾⡿⡷⣽⡽⣻⣯⡇
⠐⠒⠡⡁⡠⣫⣫⣎⣞⢷⢣⠂⠘⢔⠕⠥⠓⠄⠎⠜⠸⡺⠸⠁⢠⠁⠈⠋⣀⢠⠺⢟⠋⢀⠁⠁⣃⢣⢡⠫⢲⢳⢖⠵⡼⡻⣛⢎⡙⣄⡌⣌⣝⠼⡛⠞⠄⠐⢁⠤⡁⠄⣾⡔⢐⡔⣴⣥⢧⡬⡣⡳⡙⣜⠶⡣⣫⢯⢯⢾⣾⣽⣿⢿⣾⡇
⠠⢂⠄⠠⢣⢧⢧⢧⠷⣝⢎⠂⠒⠝⠖⢠⡌⡐⠄⠠⢂⠆⢦⢣⠎⠠⡰⣻⡻⢡⠷⠁⠁⠄⠌⠁⢡⡈⣊⢦⢣⣘⢌⢜⠬⡸⣙⡱⡵⣹⣿⡿⣟⢎⠞⠄⠠⠁⠂⠂⠈⠁⢺⠃⡛⠯⡺⡛⢳⢖⠦⠳⠳⡹⣌⣜⡾⣽⣟⣽⣯⣻⣽⣿⣽⡇
⠁⡀⢁⠈⣈⢶⢷⡼⢷⡻⠣⡱⡁⡸⡔⢉⠁⠘⠤⣸⠑⢑⠌⢠⢤⣎⣿⢁⣤⠁⢀⠈⢂⠐⠄⠄⢃⠆⢎⠖⡕⢣⣙⢎⢖⠦⡲⠳⡳⢮⣳⡗⡙⡙⠈⠁⠁⠂⢀⢀⠁⡁⠐⢥⢣⢛⠬⡜⡭⣊⣜⡴⡱⡹⢓⢳⣻⡿⣷⢷⡿⣻⣾⣻⣾⡇
⠁⠂⠁⡈⣈⢍⢮⡞⡝⣎⢆⠔⠵⡘⠌⠇⠁⠁⠈⣏⡘⡔⠴⢲⠸⡙⣯⠊⢀⠌⡐⠁⠁⠈⠠⡀⢈⢃⠂⢊⢌⠴⡱⣩⢪⢲⡵⣡⣣⣱⠳⣱⡇⠂⡀⠁⠂⡀⢘⠰⠡⡡⠐⡗⡥⡳⠵⣳⣥⢯⢛⢇⢧⣣⢠⣹⣽⣿⣷⢿⣾⣽⣳⣽⢾⡇
⠁⠂⠠⡘⡘⣎⢞⡶⣻⣛⣌⠠⣢⡀⢄⢀⠂⠁⡀⣍⠠⢢⡰⡥⡹⣀⡀⠁⠄⢁⠠⢀⠠⢁⠐⠠⠡⠂⠌⠂⠁⠑⠱⡙⡎⢛⢎⢎⢎⢣⢣⡎⠁⠁⠄⠌⠠⠠⠰⡘⢌⠆⠁⣓⡍⣱⣜⡜⣍⢧⠻⡚⡔⡬⡪⣾⡿⣯⣿⣿⢿⣷⣽⠞⠝⠁
⡄⠄⠁⠡⠂⠓⡝⣏⣎⣎⡞⠁⣠⠁⠁⡀⠂⢎⡐⠙⠚⠤⢣⢁⢄⢎⠦⠙⡄⢁⠃⢈⠂⢀⠁⢀⠁⠂⠡⠐⣙⠳⢱⠳⢓⣙⣍⣌⢧⢣⢏⢯⣻⣷⣦⣁⠂⠁⠔⠈⠐⢁⢨⡘⡱⡱⡩⡙⡉⣈⢣⠓⠙⡆⢢⣻⣳⣽⣞⣽⠻⠘⠁⠐⠆⡀
⡱⣲⠧⣁⠁⢙⢎⡳⡗⡵⣥⢃⠁⠠⠂⠄⡉⢀⠁⠘⠁⠃⠤⠒⠑⣱⡼⡀⣄⢇⠁⠈⢈⠐⢀⢀⠂⠐⠔⠁⣠⢢⡙⠞⠴⡵⡱⣙⢎⢎⢎⣝⡾⣟⢯⡾⣽⣷⡀⠐⡐⢁⢼⢢⠳⢣⢣⢣⠳⡙⣌⢦⢦⠣⢓⣿⣯⡾⡻⠁⠢⡑⠱⡱⡰⡁
⠁⢬⣳⢇⠁⠹⡝⣏⣞⢷⠶⣆⠁⠁⠈⢀⠈⣸⠁⠁⠑⢌⠘⡐⠤⠃⣣⣱⢀⢯⠁⠈⢈⠄⠌⠂⢁⢘⠬⡀⠘⣌⣬⡞⠶⠶⡵⣭⣣⢥⣛⢮⣳⣹⣯⣻⣽⣻⣿⣧⠐⠁⡷⡳⣩⣌⣌⣦⠳⡱⡙⣌⡴⣵⣯⣟⣽⣏⢄⢌⢢⠣⡑⡉⡈⡀
⠁⠠⣾⢾⠂⢰⢮⡞⡼⡞⡙⡀⠈⠁⠁⢂⠖⡔⢀⢂⠁⠠⡀⠈⠚⠰⡲⠱⣋⡍⢁⠐⠄⠁⢀⠠⢂⢎⡎⠂⠱⣑⢥⢫⢲⠳⡛⡝⣍⢎⣱⡳⣭⣳⡽⡽⣽⢯⡿⣿⣇⠁⢧⢯⠶⡳⡛⢖⠧⡓⠱⣙⣾⣯⣾⣯⣏⢌⠌⠘⢒⢌⢆⠖⠔⠄
⠁⠁⡼⡧⡁⢌⢧⡧⣏⢧⣣⠂⠁⡀⠁⠐⢀⠄⠄⠠⢁⠠⠰⠰⠡⡠⡴⡑⣄⣀⠐⠁⠂⡐⠁⠂⢜⠞⡙⠰⡱⣙⣌⣦⡎⢆⢦⠳⡱⡱⡻⡛⣞⠶⡗⣽⣷⣿⣯⡾⣻⡈⣎⣎⢦⠳⡛⣌⡖⢱⠶⡙⣝⢯⣾⣛⣘⢌⠔⠄⠠⢣⢣⢣⢣⠂
⠁⠁⣹⣛⢂⢄⣎⣞⢞⢼⠼⡃⠂⡈⠁⠄⠁⠁⠄⠄⠁⢀⠰⠒⠵⣁⢠⠠⠁⠁⠁⠁⠂⠠⢂⠙⣌⠓⢠⢲⢣⢲⠳⡛⡛⢞⢬⢦⣢⢳⠳⣛⣜⢮⢟⠿⡷⡽⣽⣞⣿⢿⠰⠤⠠⠑⠑⠑⠑⠴⠳⡳⣹⣿⡷⠳⡘⡰⠰⡰⡄⡄⡄⡄⡀⠁
⢈⢘⣜⡶⡱⠠⣹⣝⠽⣛⠎⠃⠁⢀⠂⢈⠠⠐⠠⢀⠄⠠⡀⠠⢀⢁⠲⡔⠁⠁⡀⠁⡀⡂⣌⠜⢈⢜⡜⡭⣎⣎⢖⢧⡳⡙⣜⡴⡸⠶⡳⣙⢥⠮⣜⢮⡞⣯⣻⣷⣻⢿⣧⠢⡑⠑⠉⠌⠂⠠⣻⣧⡳⠳⠁⠁⡀⡄⡌⠃⡠⢢⠱⡘⠄⡀
⠁⠱⡘⡵⡱⡡⣙⣽⡼⣹⢭⠁⠁⠁⠂⠐⠅⠁⡠⠁⠣⡀⠔⠁⠣⠐⣌⠄⠁⠁⡀⡁⣀⢆⡌⡑⡡⢣⢒⢱⡩⣋⢓⣍⢦⠻⡹⣌⢦⢣⢱⣭⣫⢞⢻⠾⣝⣽⢾⡽⡿⣿⣿⡀⠃⡈⡔⡡⡱⡱⡘⡄⠤⠢⡂⢂⠦⢠⠐⠰⡑⡉⠂⢈⠂⠁
⠁⠂⠠⣻⣽⡉⣣⣣⣮⣺⠈⠐⠁⢈⢂⠄⡄⠄⠁⠂⠆⠐⡀⡇⠁⣈⠐⡅⠤⠐⠤⡑⢌⠓⢓⢝⠮⠳⣙⢦⡇⢣⢩⣙⣌⢦⡗⣍⢦⢮⡏⣎⢫⢫⠶⡿⣛⣞⣝⡼⣽⣯⡷⣿⡌⢎⠎⢎⢖⠱⡙⡍⢊⢈⢀⢠⢄⢂⢓⢣⠓⠡⠁⠐⠰⡁

#遊んだ
点字部分の実行時間を計測したところ9ms程度だったので動画に使ってみた

2
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?