Babylon.jsで簡単に3D空間のドラッグ&ドロップ

f:id:Akiyah:20200228003407p:plain

Babylon.js をちょっと触ってみました。

テンセグリティをコンピューター上でシミュレートするという私の要望があるのですが、なかなか進められていないので、それを進めるための調査でもあります。 やりたいこととしては、物理エンジンでゴムorバネを使うこと、カメラの移動、マウスでドラッグすることなどですが、とりあえずドラッグ&ドロップができればいいなと思ってやってみました。

やってみると、 Babylon.js ではドラッグ&ドロップはかなり簡単でした!

See the Pen babylon drag test v3 by mizukoshi akiya (@akiyah) on CodePen.

scene.enablePhysics とすれば cannon.js を使った物理エンジンが使えるようになるし、 ArcRotateCamera を使えばマウスで視点移動ができるカメラが使えるし、 PointerDragBehavior を使えばドラッグ&ドロップも使えるようになりました。

cannon.jsthree.js を組み合わせてドラッグ&ドロップを作っていた時はいろいろ苦労したのに、こんな簡単にできるなんて。。。

akiyah.hatenablog.com

↑苦労していた頃。

ただ、、、 この PointerDragBehavior を使ったドラッグ&ドロップは、ちょっと甘いところがあるんですよね。 物理エンジンとあわせて使うことをあんまり意識していないのだと思うのですが、変な動きすることがあります。

簡単に直せるかな、と思って研究中ですが、全然簡単ではなさそうなので、長期戦を覚悟しています。

スライム方程式

ブログ書くのが久しぶりになっちゃったので、リハビリ的な内容です

 

こんな事をしていました。スライム方程式です。

 作り方の動画も作ってみました。

 

アイス棒で12本のテンセグリティを作る。ダブルクリップによる改善編

akiyah.hatenablog.com

の続きです。

このときは苦労したけど、ゼムクリップを使う方法を思いついてだいぶ楽になりました。

 

step1

www.instagram.com

 

step2

www.instagram.com

 

前回はダンボールの欠片と輪ゴムをジグにしたのですが、ダブルクリップで止めることで固定しました。最終的な形にならない状態から少しづつ組み上げられるので、だいぶ楽になります。

アイス棒で12本のテンセグリティを作る

akiyah.hatenablog.com

の続きです。アイス棒6本のテンセグリティはだいぶ慣れたので前のエントリーのように作れるのですが、アイス棒12本のテンセグリティはまだ自分の中で作り方が定まっていないし、手探りで苦労しながら作っています。

下のように作っています。写真が何枚かあって、最後が動画です。 

www.instagram.com

アイス棒6本のときと、流れは同じです。まずアイス棒の両端をハトメパンチで穴を開けます。その後、(ここが大変なのですが)ダンボールの欠片と輪ゴムをジグとして使って、なんとかがんばって12本を出来上がりに近い形に固定します。固定したらモビロンバンドをつけて、輪ゴムを切ってダンボールの欠片を外して完成です。

ジグを使ってアイス棒12本を形にするのがすごく大変で、もっといいジグがあれば楽できるのになーと思っていますが、まだいいアイデアはありません。

 f:id:Akiyah:20190331233736j:plain

テンセグリティを10分でアイス棒とモビロンバンドで作る

www.instagram.com

最近はこのテンセグリティを好んで何度も作っています。

アイス棒6本の両端をハトメパンチで丸く穴を開けて、モビロンバンドを引っ掛けてテンセグリティにしています。出来上がる形がきれいになるので、大好きです。

アイス棒6本は輪ゴムで固定しておいて、モビロンバンドをつけたあとに輪ゴムを切って固定を外すのがコツです。

動画にしました。慣れたので10分で完成させています(ノーカットです)。

youtu.be

材料と道具 

モビロンバンド 折径55mm 透明  50g(約550本)入り

モビロンバンド 折径55mm 透明  50g(約550本)入り

 

モビロンバンド。折径55mmのものを使っています。 

松尾物産 木製 アイススティック棒 (50本束) 114mm 0836-0902

松尾物産 木製 アイススティック棒 (50本束) 114mm 0836-0902

 

アイス棒。娘が大量に買ったものを少しもらって作っています。 

コクヨ ハトメパンチ 15枚 穴径5mm ヒン-M200

コクヨ ハトメパンチ 15枚 穴径5mm ヒン-M200

 

ハトメパンチ。上についている穴あけの部分を使っています。切れ味がするどいので、アイス棒に見事に穴を開けてくれます。

 

区民作品展に出す作品が完成した

akiyah.hatenablog.com

 

やっと作品ができました。

f:id:Akiyah:20181224000818j:plain

 

30本のテンセグリティの周りに、12本のテンセグリティを4つくっつけた形になります。メタンに近い形ですね。30本のテンセグリティと12本のテンセグリティは3本の棒を共有してくっついています。つまり全体としては、30+(12-3)*4=66本の棒を使ったテンセグリティになりますね。

12本のテンセグリティの部分は、モノタロウの軽い紙管を使っています。30本のテンセグリティの部分は、S字フックをしっかりと固定したいので、セリアの紙パイプを使っています。

ちなみに、S字フックはダイソーのもので、輪ゴムに当たるのはモビロンバンドです。 

あとは、この作品を会場までどうやって持っていくのか、それが課題ですね。 

 

adventar.org