tag:blogger.com,1999:blog-18846431694284711382024-03-14T19:55:30.957+09:00パンダコノート雑記と備忘録パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.comBlogger53125tag:blogger.com,1999:blog-1884643169428471138.post-52079816732772576592024-01-23T16:18:00.002+09:002024-01-23T16:19:50.044+09:00miniDV、DV、HDVテープから無料で取り込める(キャプチャー)ソフト<p>2024年1月21日時点の情報です。</p><p>もはや i-Link (IEEE1394、FireWire)を繋げられる環境、そしてまともに動作するビデオカメラが有ること自体希少かと思いますが、そこに加えてカムコーダーから DV をキャプチャーできるソフトも軒並み消えていっています。</p><p>このページでは執筆時点で無料で利用できたソフトを紹介します。</p><h2 style="text-align: left;">PowerDirector 364 無料体験版</h2><p>しょっぱなから胡散臭くなりましたがw<br />実は mpeg 取り込みだけなら PowerDirector 364 の無料体験版で可能です。<br /><span style="color: red;">もちろん mpeg 取り込みだけならウォーターマークや制限などはありません。</span></p><p>キャプチャー方法が少しわかりにくいので解説します。(ドキュメントにも書かれてない感じだし……)</p><p>まず、メディア画面の「録画/録音」ボタンを押し、出てきたメニューから「Web カメラから録画」を選択します。(一見間違っているようですがこれが正解ですw)</p><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZgNarMpT2QI8HJIsw-2FBbVeWLuViHQIMayHYW1xYQC27bQ9yrzg8U7XBB1e-Z6iyvEgcPmEkyRGoVb_VZkcj7wmfsNE43cFv1wbSnr1IcGBejBuFDorZyKKJtqvXvP2rt91pIpnKiQmhbbREsUDNQlYDFlMOTUoNUeAgI-lsSx0J4sNVj82sCiXBHZ4X/s655/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202024-01-23%20153922.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="393" data-original-width="655" height="240" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZgNarMpT2QI8HJIsw-2FBbVeWLuViHQIMayHYW1xYQC27bQ9yrzg8U7XBB1e-Z6iyvEgcPmEkyRGoVb_VZkcj7wmfsNE43cFv1wbSnr1IcGBejBuFDorZyKKJtqvXvP2rt91pIpnKiQmhbbREsUDNQlYDFlMOTUoNUeAgI-lsSx0J4sNVj82sCiXBHZ4X/w400-h240/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202024-01-23%20153922.png" width="400" /></a></div><p style="text-align: left;">すると各種デバイスからの取り込み画面が開くので「DV カムコーダーからの取り込み」または「HDV カムコーダーからの取り込み」のボタンを選択してください。(あ、もちろんカメラがすでに接続されて電源ONである必要があります)</p><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8QFqK091bT-dfLREDj7UfcinFqLu8h_PBJQQmUDLVWPPoqopUxYiT3lV136R9a34PLPdYRHStqwUQwdI2DQLPC-9rWwB2X2bBPVH1sQfXgVPrcH70V9tVSKx6z_1AWGIiVbvLdNEheFnOHh4L7fRS2M4ifx6YEUYtsLfMVilgL6XnYFSnqnMpYogNyFsJ/s488/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202024-01-23%20154037.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="297" data-original-width="488" height="244" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8QFqK091bT-dfLREDj7UfcinFqLu8h_PBJQQmUDLVWPPoqopUxYiT3lV136R9a34PLPdYRHStqwUQwdI2DQLPC-9rWwB2X2bBPVH1sQfXgVPrcH70V9tVSKx6z_1AWGIiVbvLdNEheFnOHh4L7fRS2M4ifx6YEUYtsLfMVilgL6XnYFSnqnMpYogNyFsJ/w400-h244/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202024-01-23%20154037.png" width="400" /></a></div><p>あとはまぁなんとなくやり方は分かるかと思いますので頑張ってください(酷)</p><p></p>パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-5193646297079569702024-01-21T17:13:00.000+09:002024-01-21T17:13:19.489+09:00磁気浮上:ネオジム磁石を回転させるだけで擬似ピン止め効果<h2 style="text-align: left;">まずはこちらの動画をご覧ください</h2><div>回転するネオジム磁石に、別のネオジム磁石を近づけるとピン止め効果のように保持させることができるようです。</div><h2 style="text-align: left;">用意するもの</h2><div>ほとんど100均(DAISO)で入手できます。</div><div><ul style="text-align: left;"><li>ネオジム磁石</li><ul><li>フローター(浮く側)用の磁石</li><ul><li>例:100均のネオジム磁石:サイズ:直径0.6×0.3cm</li></ul><li>ローター(回転する側)用の磁石</li><ul><li>例:0.6cm×0.6cm×0.6cm</li></ul></ul><li>ルーター(ハンドグラインダー・リューターとも言う)</li><li>DCモーター</li><ul><li>100均の電動字消しを分解して用意した</li><ul><li>他にも100均のおもちゃやカプチーノミキサーやハンドミキサーなどからも取れると思う。</li></ul></ul><li>セロハンテープ</li></ul></div><h2 style="text-align: left;">やり方</h2><div><ul style="text-align: left;"><li>ハンドグラインダー(リューター・ルーターとも言う)にネオジム磁石を取り付けて回転させる方法が一般的。</li><li>ローター(回転する側の磁石)の向きが重要。</li><li><strike>フローター(浮く側の磁石)はN極側が保持される。S極側では遠のくだけ。回転方向によるのだろうか?</strike></li><ul><li>ローター側をほんのわずかに傾斜させることが重要だった。</li><ul><li>傾斜していないと保持できず、傾斜させすぎると弾いてしまう。回転数に合った角度があるのかも。</li><li>傾斜させた結果、フローター側に近い極によって保持される側の極が決まると思われる。</li></ul></ul><li>フローターをアルミの上に置くと、過電流により振動が軽減され保持されやすくなる。</li></ul></div><h2 style="text-align: left;">参考</h2><div><a href="https://nazology.net/archives/136677">[ナゾロジー]回転するドリルの先端に磁石が浮き続ける不思議現象の仕組みを解明!</a></div>
<div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/l1fpnHpLb3A" width="320" youtube-src-id="l1fpnHpLb3A"></iframe></div>
<div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/V5FyFvgxUhE" width="320" youtube-src-id="V5FyFvgxUhE"></iframe></div>パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-51534555343783788572021-12-04T14:30:00.008+09:002021-12-06T21:35:54.396+09:00OracleCloud に Node-RED をインスールして無料で使い倒す方法<p style="text-align: left;">OracleCloud の太っ腹すぎる Always Free Cloud Services(期間の制限なく使用できるサービス)で構築した VM へ Node-RED をインストールする方法です。</p><p style="text-align: left;">さも自分で考えたかのような書き出しですが、ほとんど公式ブログの手順に沿って作業しただけです🤤</p><p style="text-align: left;"><a href="https://blogs.oracle.com/developers/post/installing-node-red-in-an-always-free-vm-on-oracle-cloud">Installing Node-RED In An Always Free VM On Oracle Cloud</a> (えいご)<br /></p><p style="text-align: left;">2019年の記事なので、今(2021年)とは少し異なる部分もありますがやることは同じです。</p><p style="text-align: left;">そのため基本的には、指示通り設定すれば OK なのですが、私が実際にやってみて、気がついた点がいくつかあるので、ここにメモしておきます。</p>あと、ついでに <b>HTTPS 化</b>と<b>ポート転送</b>もやります。<h2 style="text-align: left;">ちゃんと Oracle Linux を選びましょう。</h2><p style="text-align: left;">ついつい見知った Ubuntu を使いたくなるかもしれませんが、指示通り(?)Oracle Linux を選択しましょう。</p><p style="text-align: left;">もし Ubuntu を選択した場合、以降の手順が色々と変わってきてしまいます。<br />もし Ubuntu でないと残尿感があるという方は、Ubuntu で構築した方もいらっしゃるようなので、そちらを参考にしてください↓</p><p style="text-align: left;"><a href="https://yasurok2.wordpress.com/2020/10/17/node-red-on-free-vps-by-oracle/">NODE-REDをORACLEの無料VPSサービスで使う</a><br /></p><h2 style="text-align: left;">インストールスクリプトの違いに注意!</h2><p style="text-align: left;">Oracle Linux に Node-RED をインストールする際に使用するインストールスクリプトは、Ubuntu や Raspberry Pi OS(旧 Raspbian)へインストールする際に利用するインストールスクリプトとは、パスが違う点に注意してください。</p><p style="text-align: left;">ブログの指示通りに、</p><p style="text-align: left;"></p><p style="text-align: left;"><b>bash <(curl -sL https://raw.githubusercontent.com/node-red/linux-installers/master/rpm/update-nodejs-and-nodered)</b></p><p></p><p style="text-align: left;">を使用しましょう。</p><p style="text-align: left;">一見、Debian 系と同じに見えますが、<span style="color: red;">微妙にパスが異なります</span>。<br />Oracle Linux は Red Hat ベースなので、Debian 系のインストールスクリプトは使えません。</p><p style="text-align: left;">インストールスクリプトについては公式の「<a href="https://github.com/node-red/linux-installers">Linux Installers for Node-RED</a>」をご覧ください。<br />あと公式の「<a href="https://nodered.jp/docs/getting-started/local">ローカルでNode-REDを実行する</a>」も見たらいいかも。</p><h2 style="text-align: left;">もし外部から繋がらなかったらポート設定してみて。</h2><p style="text-align: left;">これはもしかしたらやらなくても良い手順なのかもしれないのですが、指示には書いてないのに私はうっかりやっちゃったので、一応書いておきます。</p><p style="text-align: left;">なお、Oracle Linux 7では、デフォルトのファイアウォール・ユーティリティは firewalld (firewall-cmd)です。(参考:<a href="https://docs.oracle.com/cd/E77565_01/security/ol7-implement-sec.html#ol7-firewall-sec">Oracle® Linux 7セキュリティ・ガイド</a>)<br /><span style="color: red;">iptables では無いので注意!</span></p><p style="text-align: left;">VM インスタンスに対して、</p><p style="text-align: left;"><b>sudo firewall-cmd --permanent --add-port=1880/tcp</b></p><p style="text-align: left;">した後、</p><p style="text-align: left;"><b>sudo firewall-cmd --reload</b></p><p style="text-align: left;">して、ポート 1880 を有効にしました。</p><p style="text-align: left;">このドキュメント「<a href="https://docs.oracle.com/en-us/iaas/developer-tutorials/tutorials/node-on-ol/01oci-ol-node-summary.htm">Free Tier: Install Node Express on an Oracle Linux Instance</a>」の「4. Create a Node Express Application + Install and Set up Node Express」を参考にしました。</p><p style="text-align: left;">てか、https 化する手順でも 80 番に対して同じようなことしてるので、やっぱ必要な手順だと思う。</p><h2 style="text-align: left;">リンクされている https 化の手順は古い</h2><p style="text-align: left;">このページね。</p><p style="text-align: left;">「<a href="https://blogs.oracle.com/developers/post/free-ssl-certificates-in-the-oracle-cloud-using-certbot-and-lets-encrypt">Free SSL Certificates In The Oracle Cloud Using CertBot And Let's Encrypt</a>」</p><p style="text-align: left;">certbot-auto はもうサポートされていません。</p><p style="text-align: left;">ポート 80 番を開放する方法以外は参考にしていない。</p><h2 style="text-align: left;">は?んじゃどーすんのさ。</h2><p style="text-align: left;">私が勘で行った方法でよければどうぞ↓</p><h2 style="text-align: left;">Oracle Linux で動いている Node-RED の HTTPS 化手順</h2><p style="text-align: left;">※ そもそもドメイン側の設定は別途済ませておきます。<br />※ Certbot で Let's Encrypt から証明書を発行してもらう想定です。</p><p style="text-align: left;">まず snap をインストールします。<br />参考にしたのはこちらのページ「<a href="https://snapcraft.io/docs/installing-snap-on-red-hat">Installing snap on Red Hat Enterprise Linux (RHEL)</a>」</p><p style="text-align: left;"><b>sudo rpm -ivh https://dl.fedoraproject.org/pub/epel/epel-release-latest-7.noarch.rpm</b></p><p style="text-align: left;"><b>sudo yum update</b></p><p style="text-align: left;">なんか指示が出たので、それに従って再度 update</p><p style="text-align: left;"><b>sudo yum update --skip-broken</b></p><p style="text-align: left;">何度か確認させられるけど、Complete! した。</p><p style="text-align: left;"><b>sudo yum install snapd</b></p><p style="text-align: left;">インストールできた。</p><p style="text-align: left;"><b>sudo systemctl enable --now snapd.socket</b></p><p style="text-align: left;"><b>sudo ln -s /var/lib/snapd/snap /snap</b></p><p style="text-align: left;">必要なのか分からないけどページの指示に従いやった。<br />そして再起動。</p><p style="text-align: left;"></p><h3 style="text-align: left;">ここからは、Certbot の設定。</h3>参考にしたのは「<a href="https://certbot.eff.org/instructions?ws=webproduct&os=centosrhel7">Web Hosting Product on CentOS 7</a>」の組み合わせ。<p></p><p style="text-align: left;"><b>sudo snap install core; sudo snap refresh core</b></p><p style="text-align: left;">コアなんて無いとかエラー出る。まぁ無視して次。</p><p style="text-align: left;"><b>sudo snap install --classic certbot</b></p><p style="text-align: left;">インストールできた。</p><p style="text-align: left;"><b>sudo ln -s /snap/bin/certbot /usr/bin/certbot</b></p><p style="text-align: left;">必要ない気もしたけど指示に従ってやった。</p><p style="text-align: left;"><b>sudo certbot certonly --standalone</b></p><p style="text-align: left;">メールアドレス入力、利用規約に同意、メール送っていいかの確認、ドメインの入力をやった。</p><p style="text-align: left;"><b>sudo certbot renew --dry-run</b></p><p style="text-align: left;">テストも成功した。</p><h3 style="text-align: left;">ここからは Node-RED の設定。</h3><p style="text-align: left;">いつもの、</p><p style="text-align: left;">~/.node-red/settings.js</p><p style="text-align: left;">を編集します。<br />具体的な方法は「<a href="https://nodered.jp/docs/user-guide/runtime/securing-node-red">セキュリティ</a>」のページを参照。</p><p style="text-align: left;">/** Option 1: static object */<br />https: {<br /> key: require("fs").readFileSync('/etc/letsencrypt/live/[ドメイン]/privkey.pem'),<br /> cert: require("fs").readFileSync('/etc/letsencrypt/live/[ドメイン]/cert.pem')<br />},</p><p style="text-align: left;">の項目のコメントを外して、秘密鍵と証明書へのパスを入力して有効にします。</p><p style="text-align: left;">ただし、</p><p style="text-align: left;">/etc/letsencrypt/live/<br />/etc/letsencrypt/archive/</p><p style="text-align: left;">のパーミッションは、0700 になっていて Node-RED が読めません。<br />なので、</p><p style="text-align: left;"><b>sudo chmod 0755 /etc/letsencrypt/live/</b></p><p style="text-align: left;"><b>sudo chmod 0755 /etc/letsencrypt/archive/</b></p><p style="text-align: left;">して、さらに所有グループも自分(opc)に変更して↓</p><p style="text-align: left;"><b>sudo chgrp opc /etc/letsencrypt/live/[ドメイン]/privkey.pem /etc/letsencrypt/live/[ドメイン]/cert.pem</b></p><p style="text-align: left;">Node-RED が読めるようにする必要があります。</p><p style="text-align: left;">以上でサーバーを再起動すれば、HTTP 化も完了です。</p><p style="text-align: left;">おしまい🤤</p><p style="text-align: left;">[2021年12月6日追記]</p><h2>ポート 443(HTTPS)から 1880 へ転送したい</h2><p style="text-align: left;">「https://ドメイン:1880/」ではなく「https://ドメイン」でアクセスしたいんじゃ!という場合の手順です。</p><p style="text-align: left;">まず今までの手順同様、ポートの設定をおこないます。</p><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4Itp0HvTja_E7mHmj7EL_W6JKZh5UCcg4qK0OAXOyiMpYpxbssiAi_HcJteyGFlGJL8DQhIg_Sio8lePuKjp7-hS3Mv9okB12TaBnqxSQ8HajEIExUYOe4pU1IoL_QtP96X3oU_DbtELU/s809/2021-12-06+185403.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="628" data-original-width="809" height="496" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4Itp0HvTja_E7mHmj7EL_W6JKZh5UCcg4qK0OAXOyiMpYpxbssiAi_HcJteyGFlGJL8DQhIg_Sio8lePuKjp7-hS3Mv9okB12TaBnqxSQ8HajEIExUYOe4pU1IoL_QtP96X3oU_DbtELU/w640-h496/2021-12-06+185403.png" width="640" /></a></div><p style="text-align: left;">次に、firewalld で 443 へのアクセスを 1880 へ転送するようにします。<br /></p><p style="text-align: left;"><b>sudo firewall-cmd --permanent --add-forward-port=port=443:proto=tcp:toport=1880</b></p><p style="text-align: left;">そしたらリロードします。</p><p style="text-align: left;"><b>sudo firewall-cmd --reload</b></p><p style="text-align: left;">これで :1880 なしでもアクセスできるようになります👍</p><p style="text-align: left;">めでたしめでたし🤤</p>パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com1tag:blogger.com,1999:blog-1884643169428471138.post-28356004979759955502020-07-19T15:21:00.001+09:002020-07-19T15:38:55.250+09:00Node-RED での CORS 対応まとめ(IBM Cloud版も対応)<div>CORS とはブラウザに「No 'Access-Control-Allow-Origin' header」とか言われちゃうアレです。</div>まず普通に GET とか multipart/form-data での POST なら<div><br /></div><div><div>msg.headers = {};</div><div>msg.headers["Access-Control-Allow-Origin"] ="*";</div></div><div><br /></div><div>って function ノードに書いてレスポンスすれば OK!👍</div><div><br /></div><div>でも、application/json を POST したいんじゃ!ってなるとプリフライトリクエストが発生して、上記だけでは「No 'Access-Control-Allow-Origin' header」って言われちゃいます。</div><div>しかも、Node-RED 上ではリクエストが来ているのかも確認できません。</div><div><br /></div><div>この場合は POST のレスポンスに Access-Control-Allow-Origin を付与するのではなく、POST の前に発生する OPTIONS メソッドに対して Access-Control-Allow-Origin を付与させる必要があります。</div><div><br /></div><div>でも、Node-RED の HTTP in ノードには OPTIONS はありません。</div><div>なのでエディター上ではリクエストが確認できません。</div><div><br /></div><div>これに対応するには、Node-RED の設定ファイル(setting.js)を修正する必要があります。</div><div>ちなみに、Node-RED IBM Cloud Starter Application の場合は、bluemix-setting.js です。</div><div><br /></div><div>そのファイル内にコメントアウトされている httpNodeCors という記述があるので、それをコメント解除します。</div><div>IBM Cloud で bluemix-setting.js の場合はそもそも記述がないので、</div><div><br /></div><div>var settings = module.exports = {…(略)…}</div><div>の中に</div><div><br /></div><div><div>httpNodeCors:{</div><div> origin:"*",</div><div> methods:"GET,POST,PUT,DELETE"</div><div>},</div></div><div><br /></div><div>とか追記しときゃ OK です。(methods に OPTIONS は無くていい)</div><div>まぁ Continuous Delivery 利用するか CLI でなんやかんやして push とかしないとダメなんでめんどいですが。</div><div>もしかしたら Cloudant 内の settings ドキュメントの編集でも対応できるかもしれませんので、誰かチャレンジしてみてくださいw</div><div><br /></div><div>修正したら再起動して解決ですヤッタネ☆</div><div><br /></div><div>CORS とかプリフライトリクエストについて詳しく知りたい方はこちら。</div><div><a href="https://developer.mozilla.org/ja/docs/Web/HTTP/CORS">オリジン間リソース共有 (CORS)[https://developer.mozilla.org/ja/docs/Web/HTTP/CORS]</a></div>パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-76716119570583928402020-06-30T17:14:00.000+09:002020-06-30T17:14:53.942+09:00itch.io で日本語に対応しているゲームの検索方法itch.io で日本語対応のゲームを検索したいときは、検索画面の URL の最後に /lang-ja を追加すれば OK ですヽ(=´▽`=)ノ<br />例えばこんな感じ。<br /><div><a href="https://itch.io/games/lang-ja">https://itch.io/games/lang-ja</a><br />あと、こーとか<br /><a href="https://itch.io/games/genre-action/lang-ja">https://itch.io/games/genre-action/lang-ja</a></div><div><br /></div><div>検索画面の絞り込みで操作できるといいんですけどねぇ…</div><div>今のところその機能はないようです。</div>パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-38901803473255578172019-11-21T21:59:00.016+09:002021-02-14T13:27:36.594+09:00GDevelop 5 でゲームを作ってみた感想<div>GDevelop に関する記事をまとめた別ブログを用意しました。</div><div><a href="https://gdevelop-jp.blogspot.com/">GDevelop に関する情報をまとめたブログ</a><br /><span style="color: red;">最新情報などはこっち↑を見てね。</span></div><hr /><div>以下は、かなり古いバージョン(2019年頃)の情報です。</div><div><br /></div>GDevelop 5 を使ってみて、気が付いた点の備忘録。<br />
こんなゲームを作りました ⇒ <a href="https://play.google.com/store/apps/details?id=com.pandako.bombomdig">BomBomDig</a><br />
<br />地味便利機能<div><ol style="text-align: left;"><li>プレビューボタンを右クリックすると表示されるメニューから、開始シーンを固定できる。</li><li>イベントのグループやコメントは右クリックから Edit で色を変えることができる。</li><li>「条件を追加」「アクションを追加」を右クリックするとショートカットメニューが表示される。</li></ol><br />
Pi (円周率)が無い!<br />
Else が無い!<br />
これタイルマップじゃない!ただのタイリングだ!<br />
<strike>反転できない。エフェクトにフリップはあるが判定やポイントは反転しない。(ベータ版では対策済み)</strike>解決済み<br />
<br />
条件でオブジェクトを絞り込んでも、そのアクションがオブジェクトの数だけ繰り返されるわけではない。<br />
例えば対象を3つに絞り込んで、アクションで score + 1 としても結果は3ではなく1。<br />
<br />
条件というより対象の絞り込みだと考える必要がある。<br />
マスクオブジェクトが上に乗っていないボタンに限定したい場合、<br />
Not mouse on マスクオブジェクト<br />
and<br />
mouse on ボタン<br />
では、マウスが乗っていないマスクオブジェクトとマウスが乗っているボタンに絞り込まれるだけなので意味がない。<br />
<br />
衝突マスクのないスプライトを消そうとすると止まる。</div><div><br />
シーンエディタ上でオブジェクト変数を変更した直後に、別のオブジェクトを選択すると変更が反映されない。一度何もないところをクリックする必要がある。<br />
<br />
Tweenが機能しない。<br />
1つもステージに配置されていないオブジェクトを複製してTweenを設定しても機能しない。<br />
<br />
1つもステージに配置されていないオブジェクトをマウスオン判定しようとしても機能しない。<br />
<br />
テキストの幅指定ができないので一行だと右寄せ・中央寄せの意味がない。<br />
エディターと実行環境で文字の位置がずれる(フォントによるかもしれん)<br />
<br />
Android アプリのバージョンコードはバージョン番号が変換される。<br />
1.0.1⇒10001<br />
<br />
SubStr()は他の言語のように開始位置をマイナスにして末尾から数える方法は使えない。<br />
<br />
シーンタイマーなどは一時停止するだけで生成される。<br />
条件で確認するだけでも生成されるっぽい。 </div><div><br />
<div>Center Point を変更すると、当たり判定がおかしくなる。</div>
<div><a href="https://forum.gdevelop-app.com/t/sprites-with-modified-points-do-not-collide-correctly/24785">https://forum.gdevelop-app.com/t/sprites-with-modified-points-do-not-collide-correctly/24785</a></div>
<div>報告済みだが対応されている気配なし。</div>
<div><br /></div>
<div>条件の「& および」で反転条件にしても効果がない?</div>
<div><br /></div>
<div>条件の「ではない」を利用すると対象のオブジェクトが存在しないのに実行されるイベントを作成することができてしまう。</div>
<div><br /></div>
<div>三角関数(三角比)の翻訳がゴミ</div>
<div>正弦(サイン sine)、式は sin()</div>
余弦(コサイン cosine)、式は cos()<br />
正接(タンジェント tangent)、式は tan()<br />
余接(コタンジェント cotangent)、式は cot()<br />
正割(セカント secant)、式は sec()<br />
余割(コセカント cosecant)、式は csc()<br /><div><br /></div><div>イベントの検索は繰り返しの設定箇所にはヒットしない。</div></div><div><br /></div><div>Z Order が同じ値の場合、あとから生成されたインスタンスが下になる。</div><div>エディター上では、あとから生成したインスタンスが上になるが、再生時には下になる。</div><div><br /></div><div>エクスポートされた Windows (自動インストーラーファイル)は、実行すると問答無用で<br />C:\Users\[ユーザー]\AppData\Local\Programs\<br />にインストールする凶悪仕様。</div><div><br /></div><div>BB テキストのワードラップは半角スペースの箇所でのみ有効。</div><div>日本語や全角スペースでは改行しない。</div><div><br /></div><div>オリジナルの衝突マスクと独自の衝突マスクが重なるとエラーになる?</div>パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-16926359649521013402019-04-08T17:52:00.000+09:002019-04-08T21:50:31.430+09:00ドラッグ&ドロップ(ノンプログラミング)でアプリが作れるサービス2019年まとめビジュアルプログラミングでアプリが作れるサービスをまとめてみました。<br />
いずれもドラッグアンドドロップで、画面設計からプログラミングまでできるので、とても簡単(?)にスマホアプリが作れます。<br />
Monaka に挫折した方や、Buildy、Yappli、アプスタ、BRAND などでは実現できないアプリを構築したい方向けです。<br />
<br />
なお、2019年4月8日時点での評価です。<br />
<h2>
Thunkable</h2>
<a href="https://thunkable.com/">https://thunkable.com/</a><br />
iPhone と Android の両方で機能するアプリを作ることができます。<br />
無料版だと作成しているもの(プロジェクト)が Thunkable Public Gallery に公開されるという変った料金体系です。<br />
つまり無料版で作られたものは、誰でも自由にプレビューしたりコピーしたりできます。<br />
あまりパーツの種類は多くないですが、基本的なことから Firebase との連携、マネタイズは一通り可能です。<br />
<br />
ただ、コミュニティーが、新しい Thunkable X(上記)と古い Thunkable Classic の記事が混在していて(タグ分けはされている)ちょっと混乱します。<br />
個人的にアイコンフォントの利用が、まだできない点が残念です。(Classic だとできる)<br />
<h2>
AppyBuilder</h2>
<div>
<a href="https://appybuilder.com/">https://appybuilder.com/</a></div>
<div>
MIT App Inventor の派生サービス。そのため Android のみです。</div>
<div>
その分、利用できるパーツの種類が多く、画面設計や機能の自由度は高いです。</div>
<div>
さらに Firebase との連携やマネタイズなども一通り可能な上に、完全に無料という点が驚きです。<br />
ただちょっと全体的に古臭いw</div>
<div>
<h2>
Kodular</h2>
</div>
<div>
<a href="https://www.kodular.io/">https://www.kodular.io/</a></div>
<div>
こちらも MIT App Inventor の派生サービス。やっぱり Android のみです。<br />
AppyBuilder とできることに大差はありませんが、2017年にスタートしたサービスなので流行りの(?)画面構成などが作りやすいです。<br />
当然のように無料で逆に怖いw<br />
<h2>
Composer 3</h2>
<div>
<a href="https://www.appgyver.com/">https://www.appgyver.com/</a><br />
旧 AppArchitect かつ旧 <a href="http://www.apparchitect.com/">Composer</a> という、ややこしい過去を持つサービスです。<br />
iPhone と Android の両方に向けたアプリを出力できるようですが、正直、利用できるパーツの種類が少なく、上記のサービスに比べると機能面で劣ります。<br />
また、無料試用では実機テストができないようです。というかドキュメントが古い、または不足している印象です。<br />
チャットでお話を伺ったところ、B2E(従業員向け)アプリにフォーカスしていて、最新版がリリース間近とのことです。</div>
<h2>
stencyl</h2>
<a href="http://www.stencyl.com/">http://www.stencyl.com/</a><br />
これは2Dゲーム作成ソフトウェアです。<br />
無料版では Flash や HTML5 での出力が可能です。<br />
スマホアプリとして出力するには年間契約の購入が必要です。<br />
ゲーム作成に特化していますが、それ以外のアプリを作ることも可能です。<br />
ただ、文字入力や日本語表示に難ありw<br />
<h2>
Ionic Creator</h2>
</div>
<div>
<a href="https://ionicframework.com/creator">https://ionicframework.com/creator</a></div>
<div>
既に完全に放置されているサービスです。おすすめできません。</div>
<div>
なお、本家の Ionic フレームワークそのものは順調に進化しているようですw<br />
<h2>
その他</h2>
</div>
<div>
諸々の理由で評価はしていませんが、以下のようなサービスもあります。</div>
<h3>
<a href="https://buildfire.com/">buildfire</a></h3>
<div>
店舗向けのアプリ作成サービス。国内サービスを利用したほうが良い。</div>
<h3>
<a href="https://www.yapp.us/">yapp</a></h3>
<div>
基本有料。国内の <a href="https://yapp.li/">yapp.li</a> というサービスとは別物。</div>
<h3>
<a href="https://www.appypie.com/">Appy Pie</a></h3>
<div>
主に店舗向けのアプリ作成サービス。機能を選択するだけで作れたりする。</div>
<h3>
<a href="https://appery.io/">appery.io</a></h3>
<div>
基本有料。全然ノンプログラミングじゃないw</div>
<h3>
<a href="https://www.applican.com/">applican</a></h3>
<div>
今回紹介する唯一の国内サービス。全然ノンプログラミングじゃないw</div>
<h2>
以上!</h2>
<div>
おしまーい。</div>
パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-42123925626791592322019-01-28T18:10:00.000+09:002019-02-12T12:23:04.732+09:00Node-RED v0.19.5 の file ノードで日本語を出力すると文字化けするまるで v0.19.5 が悪いかのようなタイトルですが、何が原因かは分かってません(ぉぃ)<br />
<br />
AWS 上の Node-RED v0.19.4 なら大丈夫なのに Azure 上の Node-RED v0.19.5 だと file ノードで日本語を含むテキストを出力すると、ガッツリ文字化けします。<br />
ちな、どちらも Ubuntu です。<br />
<br />
しょうがないので Azure 上の Node-RED v0.19.5 では exec ノードを使ってテキストファイル書き出してます。<br />
<br />
こーいうのどこに聞けば良いのかなー?(´・ω・`)<br />
<br />
【2019/01/30追記】<br />
Raspberry Pi (Raspbian) の Node-RED v0.19.5 でも文字化けしました。<br />
えー、ダウングレードってどうやるーん?(´・ω・`)<br />
<br />
<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">【2019/02/12追記】</span></span><br />
<span style="vertical-align: inherit;"><span style="vertical-align: inherit;"><span style="vertical-align: inherit;"><span style="vertical-align: inherit;">一度 npm で削除してから v0.19.4 を再インストールしたら文字化けしなくなりました。</span></span></span></span><br />
<span style="vertical-align: inherit;"><span style="vertical-align: inherit;"><span style="vertical-align: inherit;"><span style="vertical-align: inherit;">ちなみに v0.20.0-beta.4 では化けました。ぬー…</span></span></span></span>パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-74264944397390137152019-01-21T12:48:00.002+09:002019-04-16T13:42:47.816+09:00Node-RED を 80番ポート(port 80)でアクセスできるようにする方法Node-RED は通常 1880 番 port を使用しますが、ブラウザ(HTTP)でアクセスしたときに使用される標準の 80 番 port でアクセスできるようにする方法です。<br />
<div>
<br /></div>
<div>
なお、環境は Linux (Ubuntu)です。</div>
<div>
<h2>
Node-RED の設定は変更しなくて OK</h2>
</div>
<div>
さて、そもそも Node-RED の setting.js には uiPort という設定項目があるので、そこを変えればいいのかと思いきや、1024 以下のポートは root の権限が必要になるので、その方法では Node-RED を root で実行しなければならなくなります。</div>
<div>
しかし、それはセキュリティ的に良くないので、一般的には 80 番ポートへのアクセスを 1880 番へ転送する、という手法が取られます。<br />
<br />
なので、uiPort の設定を変更する必要はありません。<br />
<h2>
80 番ポートから 1880 番ポートへリダイレクトする設定</h2>
では、具体的にどのようにリダイレクトさせるのかというと、Linux に標準でインストールされている iptables というツールを利用します。<br />
iptables はパケットフィルタリングや NAT などの設定を管理することができるツールですが、詳細についてはググってくださいw<br />
<br />
とにかく手順だけ説明しますw<br />
次のコマンドを実行することで、1880 番ポートから 80 番ポートへ転送されるようになります。<br />
<blockquote class="tr_bq">
sudo iptables -A PREROUTING -t nat -p tcp --dport 80 -j REDIRECT --to-port 1880</blockquote>
ただし iptables は設定をメモリ上に記憶しているだけなので Linux が再起動すると設定が消えてしまいます。<br />
<h2>
iptables の設定を保存・永続化する</h2>
そこで、多くの場合は iptables-save と iptables-restore というコマンドを利用して、iptables の設定をファイルに書き出して、システム再起動時に読み込ませるという手法が取られています。<br />
<br />
しかしここではより手軽に、インストールするだけで設定を永続化できる iptables-persistent というツールを利用することにします。<br />
下記コマンドでインストールします。<br />
<blockquote class="tr_bq">
sudo apt install iptables-persistent</blockquote>
インストール中に現在の設定で IPv4 と IPv6 の設定ファイルを作成するか聞かれるので、どちらも Yes を選択します。<br />
これだけで、再起動しても iptables の設定が有効なままになります。わー便利!<br />
<br />
ちなみに、設定ファイルは以下の場所にあります。<br />
/etc/iptables/rules.v4<br />
/etc/iptables/rules.v6<br />
<br />
また、任意のタイミングで保存や読み込みをさせたい場合は、以下のコマンドを用いるようです。(動作未確認)<br />
<blockquote class="tr_bq">
sudo netfilter-persistent save<br />
sudo netfilter-persistent reload</blockquote>
おしまいヽ(=´▽`=)ノ</div>
パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-72566720267163234452018-12-20T13:27:00.002+09:002018-12-20T13:29:35.835+09:00VirtualBox の使い方まとめ 2019年自分用のメモなので、断片的だけど何かの役には立つかも。<br />
VirtualBox のバージョンは 5.2.22<br />
ホスト OS は win10<br />
ゲストは win7 とか ubuntu とか CentOS7 とかです。<br />
<h2>
VirtualBox で 64bit の OS が選択できない時の対処法</h2>
<div>
VirtualBox へ 64 bit 版の OS をインストールしようと思ったのに、Windows7(32bit) とか Ubuntu(32bit) とかしか選択肢に表示されなくて困っていたら、どうやら BIOS設定 で CPU の 仮想化支援を有効(Enable)にする必要があるようです。<br />
<br />
Intel 製 CPU なら Intel Virtualization Technolog (IntelVT)、AMD の場合は AMD Virtualization (AMD-V) という機能です。<br />
なお、AMD-V の場合は BIOS設定で無効になるようなことはないそうなので、そもそも 64bit CPU なのに 32bit しか選べない、なんてことはないみたい。<br />
<br />
環境によって BIOS の画面って違いますが、私の hp パソコンでは何故か Security の欄にありました。<br />
頑張って探してくださいw<br />
<h2>
VirtualBox で VM VirtualBox Extension Pack がダブルクリックでインストールできない時の対処法</h2>
</div>
<div>
なんか落とした Extension Pack のファイルをダブルクリックすれば、VirtualBox 立ち上がってインストールできるらしいですが、私の環境(Windows10)の VirtualBox だと、立ち上がるだけで何もしてくれなかったので、以下のように手動(?)でインストールしましたとさ。<br />
<ol>
<li>VirtualBox マネージャーの環境設定を開く</li>
<li>拡張機能を選択</li>
<li>なんか追加するっぽいボタンをクリック</li>
<li>ダウンロードしておいた Extension Pack のファイルを選択</li>
<li>おしまい</li>
</ol>
</div>
<h2>
外付け USB ハードディスク を使いたい</h2>
<div>
そもそも USB を使うには上記 Extension Pack をインストールしておく必要があります。</div>
<div>
なんで最初から組み込まれていないのか知らんけど、おそらくライセンスが違うからだと思います。仕事で使う時は注意です。</div>
<div>
で、HDD の場合はさらに以下のような設定も必要です。</div>
<div>
<ol>
<li>VirtualBox マネージャーから当該仮想マシンの設定を開く</li>
<li>設定メニュー「USB」で USB コントローラを有効化して USB 3.0 とかを選択</li>
<li>続けて「USB デバイスフィルター」に利用したい HDD を追加すれば OK</li>
<li>仮想マシンを起動し直すのも忘れずに</li>
</ol>
</div>
<h2>
ゲスト OS へネット経由でアクセスしたい</h2>
<div>
何も設定しないとゲスト OS は NAT でネットに接続されている状態なので、これだと外部からはポートフォワーディングしないと見えません。</div>
<div>
サクッとアクセスしたい場合は以下の設定をするのです。</div>
<div>
<ol>
<li>VirtualBox マネージャーから当該仮想マシンの設定を開く</li>
<li>設定メニュー「ネットワーク」で「割り当て」を「ブリッジアダプター」にする</li>
<li>仮想マシンを起動!</li>
<li>わーい</li>
</ol>
</div>
<div>
ブリッジアダプター以外の項目については</div>
<div>
<a href="https://qiita.com/taopi/items/0f9475e4c0e230911eb7">VirtualBox のネットワークアダプタまとめ</a></div>
<div>
が分かりやすいでした。</div>
<div>
<h2>
ゲスト OS とフォルダ共有したい</h2>
</div>
<div>
ゲスト側に Guest Addition を入れると設定から簡単に共有できるようになります。</div>
<div>
<ol>
<li>ゲスト OS のウインドウメニュー「デバイス」から「Guest Additions CD イメージの挿入」を選択</li>
<li>指示に従い Guest Additions をインストール</li>
<li>ゲスト OS をシャットダウン(再起動では以降の設定が反映されない)</li>
<li>VirtualBox マネージャーから当該仮想マシンの設定を開く</li>
<li>設定メニュー「共有フォルダー」でホスト OS の共有したいフォルダを追加する</li>
<li>設定のオプション「自動マウント」を ON にしておけば、ゲスト OS を起動するだけで自動的にマウントされるので楽ちん</li>
<li>ばんざい</li>
</ol>
</div>
パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-10265382489979755312018-11-14T18:55:00.004+09:002018-11-14T18:55:43.319+09:00redir コマンドでポートフォワードする方法普通は iptables で転送するところを、わざわざ redir をインストールして実現する意図がよくわからない方法の備忘録。<br />
なお、Raspberry Pi (Raspbian) で動作を確認。<br />
<br />
使い方は<br /><a href="https://github.com/troglobit/redir">https://github.com/troglobit/redir</a><br />
を参照。<br />
<br />
そもそもインストールされていないので、まずはインストールする。<br />
んで、ドキュメントに倣い以下のように実行。<br />
<blockquote class="tr_bq">
sudo redir :80 127.0.0.1:8080</blockquote>
ポート番号は適宜変更しましょう。<br />
例えば 1880 番の Node-RED に 80 番でアクセスできるようにするには<br />
<blockquote class="tr_bq">
sudo redir :80 127.0.0.1:1880</blockquote>
です。<br />
<br />
たぶん再起動のたびに実行しないとダメだよねコレ。<br />
(ドキュメントに /etc/inetd.conf への追記サンプルあり)パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com1tag:blogger.com,1999:blog-1884643169428471138.post-54704374773411364022018-11-07T19:07:00.000+09:002018-11-07T19:44:36.421+09:00Node-RED で簡単に Crypto を利用する方法(LINE の Bot とかで)下記のノードを追加するだけで Crypto モジュールが使えるようになります。<br />
settings.js(bluemix-settings.js)を書き換える必要はないです。<br />
<br />
<a href="https://flows.nodered.org/node/node-red-contrib-crypto-js">node-red-contrib-crypto-js</a><br />
<br />
HMAC の MD5 とか SHA-2 とか使いたいぜ!ってときにサッと使えて便利です。<span style="font-size: 12.8px;">(Encode と Decode が使い難いけどw)</span><br />
<h2>
LINE の X-Line-Signature 検証での利用例</h2>
そもそも必須じゃない処理を意地でも Node-RED でやろうという奇特な方向けの情報ですw<br />
※LINE WORKSだと「X-WORKS-Signature」<br />
<h3>
LINE の改ざん検証用署名「X-Line-Signature」の検証方法</h3>
ニッチなので雑ですが、これでいけます↓<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixxlSjop7BfEvx8UjCHoMb60VfVKEGE5V_YjqpCnI0q_CEFGDE2PBuCAa5IWbVQQmrSXkqLY844piAkeq5MmCot94KJpQ5ElkDmPnH9yvHQlIESXRTeUdOrt3-ffNVmpQVedgIMP0z_JOS/s1600/%25E5%2590%258D%25E7%25A7%25B0%25E6%259C%25AA%25E8%25A8%25AD%25E5%25AE%259A+1.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="235" data-original-width="485" height="193" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixxlSjop7BfEvx8UjCHoMb60VfVKEGE5V_YjqpCnI0q_CEFGDE2PBuCAa5IWbVQQmrSXkqLY844piAkeq5MmCot94KJpQ5ElkDmPnH9yvHQlIESXRTeUdOrt3-ffNVmpQVedgIMP0z_JOS/s400/%25E5%2590%258D%25E7%25A7%25B0%25E6%259C%25AA%25E8%25A8%25AD%25E5%25AE%259A+1.png" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">意地でもノードを使うの図</td></tr>
</tbody></table>
function ノードを使えばもっと簡単にできるところを、あえてノードを駆使してみましたw<br />
ポイントは decode ノードの設定を Hex にしておくことです。<br />
それ以外だと異なる値になります。<br />
<br />
JSON 貼ると化けるブログなので、上の図を参考に各々頑張ってくださいw<br />
<h2>
settings.js を書き換える方法</h2>
ちなみに下記のようにすることで、function ノード内で crypto を利用することも可能になります。<br />
<br />
1.settings.js の functionGlobalContext に追記<br />
<blockquote class="tr_bq">
functionGlobalContext: {<br />
crypto: require( "crypto" )<br />
},</blockquote>
2.Node-RED 再起動<br />
3.function ノードで利用<br />
<blockquote class="tr_bq">
const crypto = global.get('crypto');</blockquote>
上記ノードには含まれていない機能を利用したいときは、この方法にしましょう。パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-64865005139457947802018-10-19T12:32:00.001+09:002019-04-16T14:07:27.431+09:00Oculus GO アプリ内で WebView (ブラウザ)を表示する方法Oculus GO のアプリ内で WebView みたいにブラウザ機能を利用できると一気に便利なるので、なんかいい方法はないか調べてみました。<span style="color: red;">(試してみたとは言っていないw)</span><br />
<b><strike>先に言っておきます「まともなものはない」と。</strike></b><br />
<br />
なお、Unity を利用することが前提です。<br />
また、空間上にブラウザを配置(テクスチャとして利用)できることが条件です。<br />
<br />
以下、2019年4月追記。<br />
<h2>
3D WebView for Android</h2>
<div>
<a href="https://assetstore.unity.com/packages/tools/gui/3d-webview-for-android-137030">https://assetstore.unity.com/packages/tools/gui/3d-webview-for-android-137030</a></div>
<div>
超高いが Oculus GO にも対応している様子。</div>
<div>
$200</div>
<div>
<br /></div>
以下、2018年10月以前の情報<br />
<h2>
Mobile Web View (Android, iOS)</h2>
<a href="https://assetstore.unity.com/packages/tools/gui/mobile-web-view-82142">https://assetstore.unity.com/packages/tools/gui/mobile-web-view-82142</a><br />
ほぼ理想通りの機能を提供してくれるアセット!<br />
でもレビューを見る限りかなりビミョーな様子……<br />
$45 で人柱になれます。<br />
<h2>
UniWebView 3</h2>
<div>
<a href="https://assetstore.unity.com/packages/tools/network/uniwebview-3-92605">https://assetstore.unity.com/packages/tools/network/uniwebview-3-92605</a></div>
<div>
Android にも対応しているけど、最前面に表示されるタイプなので残念ながら無理のようです。</div>
<div>
<a href="https://docs.uniwebview.com/guide/faq.html">https://docs.uniwebview.com/guide/faq.html</a></div>
<div>
$25</div>
<div>
<h2>
Embedded Browser</h2>
<a href="https://assetstore.unity.com/packages/tools/gui/embedded-browser-55459">https://assetstore.unity.com/packages/tools/gui/embedded-browser-55459</a><br />
一見 VR にも対応しているようだが、これは PC プラットフォームの VR に対してであり、Android がベースの Oculus GO には対応していない様子。<br />
お値段が高いので試せないw<br />
$80</div>
<h2>
WWebView</h2>
<div>
<a href="https://assetstore.unity.com/packages/tools/network/wwebview-97395">https://assetstore.unity.com/packages/tools/network/wwebview-97395</a></div>
<div>
Windows のみ!</div>
<div>
$20</div>
<h2>
unity-webview</h2>
<div>
<a href="https://github.com/gree/unity-webview">https://github.com/gree/unity-webview</a></div>
<div>
gree のやつです。</div>
<div>
残念ながら VR 非対応。</div>
<div>
<a href="https://github.com/gree/unity-webview/issues/273">https://github.com/gree/unity-webview/issues/273</a></div>
<div>
<br /></div>
<h2>
Popup Webview Android Ios</h2>
<div>
<a href="https://assetstore.unity.com/packages/tools/integration/popup-webview-android-ios-62076">https://assetstore.unity.com/packages/tools/integration/popup-webview-android-ios-62076</a></div>
<div>
なんか見た感じダメっぽい。<br />
$5</div>
<h2>
In-App Web Browser</h2>
<div>
<a href="https://assetstore.unity.com/packages/tools/gui/in-app-web-browser-57532">https://assetstore.unity.com/packages/tools/gui/in-app-web-browser-57532</a></div>
<div>
全画面のみっぽい。</div>
<div>
$5</div>
<h2>
Android Webview Texture (VR compatible)</h2>
<div>
検索するとよく出てくるし、いい感じなんだけど提供終了みたい。</div>
<div>
<a href="https://jerome.gangneux.net/blog/2017/09/23/android-webview-texture-is-over.html">https://jerome.gangneux.net/blog/2017/09/23/android-webview-texture-is-over.html</a></div>
<div>
<a href="https://assetstore.unity.com/packages/tools/android-webview-texture-vr-compatible-82379">https://assetstore.unity.com/packages/tools/android-webview-texture-vr-compatible-82379</a></div>
<h2>
ULiteWebView</h2>
<div>
<a href="https://assetstore.unity.com/packages/tools/network/ulitewebview-112841">https://assetstore.unity.com/packages/tools/network/ulitewebview-112841</a></div>
<div>
情報少なすぎ。</div>
<div>
$5</div>
<h2>
OculusGoWebView</h2>
<div>
<a href="https://github.com/TyounanMOTI/OculusGoWebView">https://github.com/TyounanMOTI/OculusGoWebView</a></div>
<div>
まさにそのものズバリな名称だけど開発中なのかな…</div>
<div>
<br /></div>
<hr />
あれ?もしかして無理なんじゃね?(爆)<br />
<div>
神アセット待ちかなー。</div>
パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-70877800965185527272018-10-17T17:51:00.001+09:002018-10-18T11:41:00.037+09:00Ubuntu 上の Dropbox フォルダを Windows と共有する方法やる意味がわからないと思いますが、そういうシチュエーションもあるんですよ。<br />
(Windows 側に空き容量がないとかね)<br />
<br />
せっかく Ubuntu 入れてるんだから可能な限りコマンドは使わない方向でやります。<br />
ちなみに Ubuntu 18.04.1 LTS でやりました。<br />
<br />
なお、まるで熟知しているかのような書きっぷりですが、カンで作業した結果を書いてるだけなので、嘘、大げさ、紛らわしい可能性があることをご了承ください。<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGyuab0FltydFnyQgEN5TgnMqtTX8A0fiZ1rDzyqCW3mWKX2ncAdqr4eP7pl2hJ9YBfJNgcMEihL79cIolwXSEdxrUU82b0qRiA3Aa3TDpMk5Z9YV9fvwQc9bN52oCGfW0xCcQqmDVAAtC/s1600/Screenshot+from+2018-10-17+12-29-53.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="463" data-original-width="610" height="242" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGyuab0FltydFnyQgEN5TgnMqtTX8A0fiZ1rDzyqCW3mWKX2ncAdqr4eP7pl2hJ9YBfJNgcMEihL79cIolwXSEdxrUU82b0qRiA3Aa3TDpMk5Z9YV9fvwQc9bN52oCGfW0xCcQqmDVAAtC/s320/Screenshot+from+2018-10-17+12-29-53.png" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">フォルダを右クリックして「プロパティ」でひらくやつ。<br />
この画像は設定前の状態です。</td></tr>
</tbody></table>
<br />
まず素直に GUI 上で「ローカルネットワーク共有」を設定してみましたが、これでは Windows からの書き込みと Ubuntu での書き込みではユーザーが異なり権限(パーミッション)を変更しないと相互に上書きできない状態になってしまいました。<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj33L5-fuBz1-aFWKG0ISO4o-FqkR8CqnmPm7ieXeAcLrrMTb6d9YVcmyoAIgnLjmVGdkBdcSz4gPd_vyDT-4Xu7Bxa2Lcu4tacmx8yYHFix6EukcNFg3epPPfehs70rCMCBDggC-OzGhg0/s1600/Screenshot+from+2018-10-17+12-09-01.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="582" data-original-width="890" height="209" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj33L5-fuBz1-aFWKG0ISO4o-FqkR8CqnmPm7ieXeAcLrrMTb6d9YVcmyoAIgnLjmVGdkBdcSz4gPd_vyDT-4Xu7Bxa2Lcu4tacmx8yYHFix6EukcNFg3epPPfehs70rCMCBDggC-OzGhg0/s320/Screenshot+from+2018-10-17+12-09-01.png" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">鍵がついちゃう</td></tr>
</tbody></table>
<br />
それではめんどいので、「ローカルネットワーク共有」ではなく samba をインストールして設定してみました。<br />
<br />
<b><span style="color: red;">注)以降の作業を行う前に全ての「ローカルネットワーク共有」の「このフォルダーを共有する」はチェック解除しておきましょう。</span></b><br />
(もしくはそもそも触らない)<br />
<br />
samba は「Ubuntu ソフトウェア」を起動して「samba」って検索すれば出てくるので、それをインストールします。<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjz4X5O4eD4GGkEec_jcdrNEE7uYZ6g3BPSuR-bC5w3d8EiAiQCVqkTUNE5qdh8Cnh1nHJpSIcA46BP1oMe14FXs-7T5Pv7kjrVKbMSSwcyD_KU6KPyGaUAK5ub1u4-_t7OKqQSxlkzcHlx/s1600/Screenshot+from+2018-10-17+12-35-44.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="741" data-original-width="973" height="243" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjz4X5O4eD4GGkEec_jcdrNEE7uYZ6g3BPSuR-bC5w3d8EiAiQCVqkTUNE5qdh8Cnh1nHJpSIcA46BP1oMe14FXs-7T5Pv7kjrVKbMSSwcyD_KU6KPyGaUAK5ub1u4-_t7OKqQSxlkzcHlx/s320/Screenshot+from+2018-10-17+12-35-44.png" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">これをインストールする</td></tr>
</tbody></table>
<br />
しかし残念なことに、samba の設定画面はスーパーユーザー(管理者みたいなもん)でなければ開くことができません。<br />
つまりマウスぽちぽちでは起動できません。<br />
そのため「端末」アプリでコマンドを入力する必要があります。<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYsey3WxfMhUMYqEjEA3AEclrpdppfI8v3pQpeOxGQQCL0wITtS5V5vrKTDlnHZjCAWYNgZAZph9SOWdn2FfEWr-34Z_3c8x7VSmtwswvR5U6l4NwrwhDJizIKqH3fguHMSjQKS7ZZlxBS/s1600/Screenshot+from+2018-10-17+12-51-14.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="326" data-original-width="572" height="182" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYsey3WxfMhUMYqEjEA3AEclrpdppfI8v3pQpeOxGQQCL0wITtS5V5vrKTDlnHZjCAWYNgZAZph9SOWdn2FfEWr-34Z_3c8x7VSmtwswvR5U6l4NwrwhDJizIKqH3fguHMSjQKS7ZZlxBS/s320/Screenshot+from+2018-10-17+12-51-14.png" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">CLI は説明不足の典型例w</td></tr>
</tbody></table>
<br />
そのコマンドは以下のとおりなのですが、<br />
<blockquote class="tr_bq">
sudo system-config-samba</blockquote>
いきなりこれを入力してエンターキーを押しても、英語で「/etc/libuser.conf が無いよ」って言われてしまいます。<br />
そこで、最初だけ次のコマンドを実行しておく必要があります。<br />
(二回目移行は必要ありません)<br />
<blockquote class="tr_bq">
sudo touch /etc/libuser.conf</blockquote>
上記コマンドで空のファイルが作れます。<br />
このコマンドを実行するとパスワードを聞かれるので入力します。(何も表示されませんが入力されてます)<br />
コマンドについて詳しく知りたい方は「sudo」コマンドと「touch」コマンドをググればいいと思います。<br />
ファイルを作った上で再度<br />
<blockquote class="tr_bq">
sudo system-config-samba</blockquote>
と入力しパスワードを入力すれば設定画面が開きます。<br />
+ボタンで共有フォルダを追加したりなんやかんや設定しましょう(爆)<br />
<br />
ちなみに当初の上書きできない問題については、プリファレンス > サーバー設定 > セキュリティのゲストアカウントを自分のアカウントにすることで、相互に上書き保存ができるようになります。<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnbPGQR0GWKONptuJTs1aPVdK28f5OUTmPQFLWIE9RRxybAbBfuIrkzXLALEktuTjmJt2TyEEA7EBWYA7ny0AbEQBryhSqpjHLIt0OFqnS3-c8Cc6hlpO3Vo5h_POdAYkEw4ZCL4krAnTj/s1600/Screenshot+from+2018-10-17+17-15-55.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="430" data-original-width="600" height="229" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnbPGQR0GWKONptuJTs1aPVdK28f5OUTmPQFLWIE9RRxybAbBfuIrkzXLALEktuTjmJt2TyEEA7EBWYA7ny0AbEQBryhSqpjHLIt0OFqnS3-c8Cc6hlpO3Vo5h_POdAYkEw4ZCL4krAnTj/s320/Screenshot+from+2018-10-17+17-15-55.png" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">ゲストアカウントを自分にすることで解決</td></tr>
</tbody></table>
まぁセキュリティがザルになりますがねw<br />
ちゃんとする場合は samba のユーザーも設定しておきましょう。<br />
<br />
設定が終わり設定画面を閉じたら samba を再起動する必要があります。<br />
以下のコマンドを実行します。<br />
<blockquote class="tr_bq">
sudo systemctl restart smbd</blockquote>
あとは windows のネットワークから見られるかと、ちゃんと Dropbox が同期できてるかをチェックしましょう。<br />
<br />
なお、共有しているフォルダ側もちゃんと自分にしておかないと意味ないので注意。<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUD6QWZY_TIEPhhWSEFAkSKLOFX8JscUjYFe0uLfmvOjcqD2v4c6AUOXmsDVDa3nr1zCF7yuiricGheaCyyATPoYTHKMFpiEoPSS4V8CZPkBk7veVE6tyybf-_qyn5TzutI0X2poF3m41r/s1600/Screenshot+from+2018-10-17+17-29-10.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="463" data-original-width="610" height="242" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUD6QWZY_TIEPhhWSEFAkSKLOFX8JscUjYFe0uLfmvOjcqD2v4c6AUOXmsDVDa3nr1zCF7yuiricGheaCyyATPoYTHKMFpiEoPSS4V8CZPkBk7veVE6tyybf-_qyn5TzutI0X2poF3m41r/s320/Screenshot+from+2018-10-17+17-29-10.png" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">変えておけば以降は設定に準ずるはず</td></tr>
</tbody></table>
いつになったら Ubuntu は CLI 使わなくても良くなるんっすかねー。パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-71818193529130453872018-07-17T13:35:00.000+09:002018-07-17T13:35:08.238+09:00Unity で地面のテクスチャがボケる時の正しい対処法テクスチャ画像の Inspector の Generate Mip Maps を OFF にする方法ではパフォーマンスが犠牲になるようなので Aniso Level を変更するほうが良い。<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnHFHs9DtcK6YVLhyphenhyphenfbh1fJfa7VO2TcJGfMoBPuxCIa184hJi4dE5FRqzekCgzN4jFY7M8GuFDtVhQ7k0LgMijmOeVaQ2RmdjeC4DlgOYnNLaoxqVlfZ9X9yEu9YgkHfyEbgW8AfkO-Xcn/s1600/road01.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="350" data-original-width="1038" height="133" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnHFHs9DtcK6YVLhyphenhyphenfbh1fJfa7VO2TcJGfMoBPuxCIa184hJi4dE5FRqzekCgzN4jFY7M8GuFDtVhQ7k0LgMijmOeVaQ2RmdjeC4DlgOYnNLaoxqVlfZ9X9yEu9YgkHfyEbgW8AfkO-Xcn/s400/road01.png" width="400" /></a></div>
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh99fdVL0VEwG4-OrRCVcwUpDj9lBD7lzrQfCvqPVIU-wgEIJ6SoNn63HxxCqRWuxOk8iY1f_HGDnwmd4l_eMF52oS2xIs7xBQz0hhLalMkY6s_iFItw1m5acoQwzHxATpmX3MiHWHIyZ3Q/s1600/road02.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="350" data-original-width="1038" height="133" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh99fdVL0VEwG4-OrRCVcwUpDj9lBD7lzrQfCvqPVIU-wgEIJ6SoNn63HxxCqRWuxOk8iY1f_HGDnwmd4l_eMF52oS2xIs7xBQz0hhLalMkY6s_iFItw1m5acoQwzHxATpmX3MiHWHIyZ3Q/s400/road02.png" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">実際にはここまで値を上げる必要はない</td></tr>
</tbody></table>
Aniso Level は「急角度から見たときのテスクチャの品質を向上します。床や地面のテクスチャに適しています。」とのこと。<br />
この数値を上げることによる弊害は知らんwパンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-65186353440194079872018-07-03T16:39:00.001+09:002018-07-03T16:40:01.726+09:00xismo から Unity へ obj 書き出しする時の設定デフォだと UV 変になったりしちゃったので、以下のようにするとうまくいった。<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnCUANi-WYZ5gXkQvqENRIvGMC1LS3Gnpd9W6Y8pjIcctTbjZAUmp6wAA7dnBcIgq-Em-Y6dS9RO6qcnr7TFk2r2VaT9-Tmm7RvzE9pgwiaLBVUJq2h_UISiOedGwgdKue3d22tTfgiaH_/s1600/xismo.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="389" data-original-width="325" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnCUANi-WYZ5gXkQvqENRIvGMC1LS3Gnpd9W6Y8pjIcctTbjZAUmp6wAA7dnBcIgq-Em-Y6dS9RO6qcnr7TFk2r2VaT9-Tmm7RvzE9pgwiaLBVUJq2h_UISiOedGwgdKue3d22tTfgiaH_/s320/xismo.png" width="267" /></a></div>
倍率は xismo は cm のつもりで作ってるので、100分の1にした。<br />
X軸を反転にチェック。<br />
UVのV座標を反転にチェック。これをしないと変になる。<br />
面を表裏反転はオフに。これをオンにしてると左右が反転しちゃう。<br />
モディファイアと表示ノードのみはお好きにどーぞ。<br />
<br />
あとは出力された .obj と .mtl と テクスチャを Unity へわたしてあげればOK。パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-12970342081856853612018-06-25T17:52:00.002+09:002018-06-25T17:54:20.244+09:00アップロードされたファイルを Node-RED で受け取る方法<div>
例えば画像を Node-RED へアップロードしたい、とかの時です。</div>
<div>
下のフロー図は、ファイルを送信できるアップロードページと、送られてきたファイルを鯖上に保存するフローのサンプルです。</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2DorwL2JSMbH1NjSVLUpTA7Ylql3PjgEdtI8qa1E3R1zC7l9xHiWpNanlR4Oe0hSxAyXhAJLat6ka4CgX8TaDk4LHo_tfLUxJ1eJ2YcGvQ1gY8tEcl7iyzNknLVITMLzWcb0DBvpgzo2W/s1600/node_red_upload01.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="160" data-original-width="542" height="117" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2DorwL2JSMbH1NjSVLUpTA7Ylql3PjgEdtI8qa1E3R1zC7l9xHiWpNanlR4Oe0hSxAyXhAJLat6ka4CgX8TaDk4LHo_tfLUxJ1eJ2YcGvQ1gY8tEcl7iyzNknLVITMLzWcb0DBvpgzo2W/s400/node_red_upload01.png" width="400" /></a></div>
<div>
フローの JSON コード貼ると化けちゃうブログなので、下記の説明を読んで各自で自作してくださいw<br />
<br />
ただし環境によっては file ノード(ファイル作成ノード)がない場合もあります。(IBM Cloud のボイラーテンプレートで用意された Node-RED とか)</div>
<div>
その場合は file ノードの代わりに、データベースなどへの保存の処理を行う必要があるわけですが、それはまた別のお話……</div>
<div>
<br />
では、個々のノードについてザッと説明します。<br />
<h2>
アップロードページのフロー</h2>
</div>
<div>
まずは動作確認のためにも、ファイルをアップロードするためのページを用意します。</div>
<div>
<h3>
「[get] /upload」http 入力ノード</h3>
</div>
<div>
Node-RED 鯖の /upload に GET でアクセス(単にブラウザでアクセス)されたときのフローがここからスタート。<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2KJt3ErrRhExXfsDV40PCAYncREYNf0Ps4K4FZXiiANV_yIV9gI11FZRooVPml0d1sKIiv2tl22ak2mzKfnrGUs3QFMFBl955dXf-XIcCsgKQBXk_11p2ail312qZY8hRF9plJyyEEXw7/s1600/node_red_upload02.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="294" data-original-width="524" height="111" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2KJt3ErrRhExXfsDV40PCAYncREYNf0Ps4K4FZXiiANV_yIV9gI11FZRooVPml0d1sKIiv2tl22ak2mzKfnrGUs3QFMFBl955dXf-XIcCsgKQBXk_11p2ail312qZY8hRF9plJyyEEXw7/s200/node_red_upload02.png" width="200" /></a></div>
<h3>
「HTML」template ノード</h3>
</div>
<div>
ここでファイルをアップロードできる HTML を msg.payload にぶち込みます。<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEABBruoZQSUeA-NTx5sVYnLmzeYXT586fc3-S7RlqQxRxw1HToddHSkL76fEvTqcDKeUX6UJHlU-sd4EEu10BY6ESJQzumV2V8DRCfsZAA3Fy76p_6QMGeSO_Sf6PYQiraNH4LEzxXg3J/s1600/node_red_upload03.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="718" data-original-width="525" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEABBruoZQSUeA-NTx5sVYnLmzeYXT586fc3-S7RlqQxRxw1HToddHSkL76fEvTqcDKeUX6UJHlU-sd4EEu10BY6ESJQzumV2V8DRCfsZAA3Fy76p_6QMGeSO_Sf6PYQiraNH4LEzxXg3J/s200/node_red_upload03.png" width="145" /></a></div>
HTML はこんな感じ。</div>
<blockquote>
<!doctype html><br />
<html><br />
<head><br />
<meta charset="utf-8"><br />
<title>アップロード</title><br />
</head><br />
<body><br />
<form action="/upload" method="post" enctype="multipart/form-data"><br />
<input name="file" type="file" id="file"><br><br />
<input type="submit" value="アップロード"><br />
</form><br />
</body><br />
</html></blockquote>
ちゃんと form 要素の method属性は post に、enctype 属性は multipart/form-data に設定しましょう。<br />
<h3>
http 出力ノード</h3>
<div>
上記の HTML をここで返します。</div>
<div>
それにより無事、アクセスしてきたブラウザにはアップロードページが表示されます。<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgX7wH5rD8pJUKUI4SAtko1YDVNMQ99nYfX-yRVf8LAUSEnIJypKw_Com8n67QLuy9eNDMOTbs4FANh2oT0AEqnNE9zJ7iSGexEIcy4ibSX_11nWNF0_od58D9aOmPuqJ81VmMFCVVc-59U/s1600/node_red_upload04.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="716" data-original-width="540" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgX7wH5rD8pJUKUI4SAtko1YDVNMQ99nYfX-yRVf8LAUSEnIJypKw_Com8n67QLuy9eNDMOTbs4FANh2oT0AEqnNE9zJ7iSGexEIcy4ibSX_11nWNF0_od58D9aOmPuqJ81VmMFCVVc-59U/s200/node_red_upload04.png" width="150" /></a></div>
特に何も設定しなくてもデフォで Content-Type: text/html として返してくれるので楽ちん。<br />
<h2>
ファイルを受け取ったときのフロー</h2>
</div>
<div>
こっからが本題。</div>
<div>
先のページからファイルがアップされた時のフローです。</div>
<h3>
「[post] /upload」http 入力ノード</h3>
<div>
アップロードページと同じ URL だけど、POST だった場合はこっちがスタートします。</div>
<div>
ファイルがアップされるはずなので、ノード編集画面の「ファイルのアップロード」にチェックを入れましょう。</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjaxep-YvcUCTAfZaWjOEgu54-erWRxHOKcRvzy3Q9dSwspS6TXklWtTZ6WlGOGl9SuxxMWLBFqU7JOhLKbd9x-gaNPZcJEMl-zyZAcRTHuDTaAHcRZpK7GHMOjiMZVrfWvbKs6eK16BlF/s1600/node_red_upload05.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="716" data-original-width="524" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjaxep-YvcUCTAfZaWjOEgu54-erWRxHOKcRvzy3Q9dSwspS6TXklWtTZ6WlGOGl9SuxxMWLBFqU7JOhLKbd9x-gaNPZcJEMl-zyZAcRTHuDTaAHcRZpK7GHMOjiMZVrfWvbKs6eK16BlF/s200/node_red_upload05.png" width="146" /></a></div>
<div>
チェック入れておかないと msg.payload にバイナリバッファが入っちゃって意味不明になります。</div>
<div>
入れておくことでファイルは msg.req.files に格納され、msg.payload には HTML の form の各値が格納された状態になります。</div>
<h3>
「処理」function ノード</h3>
<div>
ここでは簡単なエラーチェックをしつつ、応答のフローとファイル保存のフローに分けています。</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWD7s5p9FBq6crQSn3m_gIbNV51EuTk0r_S_t3OGFqPnZQRqKTEc4_J37-z1dIkLbHmCs2SSdAvvc3VGUOVSrRAE2g_K6HkC1Y34bzr1hQC3RCnq8J2clJUALtTgB9HQN5ta6NOL1Jid_g/s1600/node_red_upload06.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="668" data-original-width="524" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWD7s5p9FBq6crQSn3m_gIbNV51EuTk0r_S_t3OGFqPnZQRqKTEc4_J37-z1dIkLbHmCs2SSdAvvc3VGUOVSrRAE2g_K6HkC1Y34bzr1hQC3RCnq8J2clJUALtTgB9HQN5ta6NOL1Jid_g/s200/node_red_upload06.png" width="156" /></a></div>
<div>
出力数は 2 にして、return の [0] は応答のフローへ、return の [1] はファイル保存のフローへ分かれるようにしました。<br />
コードは以下の通り。</div>
<blockquote class="tr_bq">
let files = msg.req.files;<br />
if (files.length === 0) {<br />
msg.payload = "ファイルが添付されてないよ";<br />
return [msg, null];<br />
}<br />
msg.payload = "たぶん保存したよ";<br />
//<br />
let msg2 = {};<br />
msg2.payload = files[0].buffer;<br />
msg2.filename = "/home/user/" + files[0].originalname;<br />
return [msg, msg2];</blockquote>
まず、msg.req.files の数を見て、ちゃんとファイルが含まれているかをチェックしています。<br />
もしファイルが含まれていなかったら、ファイル保存のフローへは null を返すことで、フローが進まないようにしています。<br />
他にも必要であれば msg.req.files[0].mimetype などを確認して、想定外のファイル形式を弾いたりしても良いでしょう。<br />
<br />
で、問題がなかった場合、新たにファイル保存フロー用のオブジェクト msg2 をこしらえます。<br />
そして次の「ファイル作成」ノードのために、msg2.payload にファイルのバイナリバッファを入れます。<br />
あと、保存先とファイル名もここで設定してしまいます。<br />
サンプルでは鯖上の /home/user/ へ元のファイル名のまま保存するようにしました。<br />
<h3>
「HTML」template ノード その2</h3>
<div>
応答フローの template ノードです。<br />
ここでは応答用の HTML を作成して msg.payload に入れています。<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibqLVL0OMHdDXDVWKztt2N0Kaxxj4au-DXoyfw4PLw-PFDZdRwzgvpg0GCrg-Ooaxjo4e6FE72ddmSFGMYqOnha_gwnNPlJ07_gCGVSTSoL9xvGm17JTt5QOVDhD4zvzYW69nhch3xuk64/s1600/node_red_upload07.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="669" data-original-width="523" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibqLVL0OMHdDXDVWKztt2N0Kaxxj4au-DXoyfw4PLw-PFDZdRwzgvpg0GCrg-Ooaxjo4e6FE72ddmSFGMYqOnha_gwnNPlJ07_gCGVSTSoL9xvGm17JTt5QOVDhD4zvzYW69nhch3xuk64/s200/node_red_upload07.png" width="156" /></a></div>
予め先の「処理」function ノードで msg.payload にはメッセージが入れられているので、Mustache タグを利用して payload の内容を HTML に差し込んでいます。<br />
↓こんな感じ。</div>
<blockquote>
<!doctype html><br />
<html><br />
<head><br />
<meta charset="utf-8"><br />
<title>結果</title><br />
</head><br />
<body><br />
<p>{{payload}}</p><br />
</body><br />
</html></blockquote>
<div>
ヒゲ便利w<br />
<h3>
http 出力ノード</h3>
</div>
<div>
応答フローでも先の http 出力ノードを再利用。えこえこ。</div>
<h3>
「ファイル作成」file ノード</h3>
<div>
鯖上にファイルを保存します。</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEVMH8FjYsugi4RbTu8lRcwj0r-hA8iCBqR2Zzqu2FwdzHDou8egGpnRp0IxdU7em__GE2HyF5xvhLXrJzobetdeV25lgiSfbzBVckBnH9GB8IUNlW7wAEIxf_lPMZw8KDwxLDexX8c5_q/s1600/node_red_upload08.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="671" data-original-width="525" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEVMH8FjYsugi4RbTu8lRcwj0r-hA8iCBqR2Zzqu2FwdzHDou8egGpnRp0IxdU7em__GE2HyF5xvhLXrJzobetdeV25lgiSfbzBVckBnH9GB8IUNlW7wAEIxf_lPMZw8KDwxLDexX8c5_q/s200/node_red_upload08.png" width="156" /></a></div>
<div>
ノード編集画面で「動作」を「ファイルを上書き」にして「メッセージの入力のたびに改行を追加」のチェックは外しておきましょう。</div>
<div>
「ファイル名」は先の「処理」function ノードで設定済みなので、ここでは空にしておきます。</div>
<div>
(以前は何か入力されていても、msg 側が優先されてたけど、最近 msg 側で設定済みなのにノード編集画面でも何か入力されてると警告されるようになったっぽぃ)</div>
<div>
<br /></div>
<div>
以上、個々のノードの説明でした。</div>
<div>
実際に /upload へブラウザでアクセスしてみて、動作を確認してみましょう!</div>
<div>
そして何か間違えている場合、またはもっといい方法がある場合は教えてくださいw</div>
<div>
<br /></div>
<div>
おしまーいヽ(=´▽`=)ノ</div>
<div>
<br /></div>
<div>
<br /></div>
パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-58452436894154505112018-06-21T12:15:00.000+09:002018-11-07T17:13:48.927+09:00Node-RED で base64 エンコードとかデコードしたい時Node-RED は受信した画像とかローカルのファイルとかをバイナリバッファでやり取りするけど、Google さんの Cloud Vision API に画像送りたい時とかには base64 エンコードして送らなきゃいけなかったりするときのなんやかんや。<br />
<h2>
方法1:node-red-node-base64ノードを使う。</h2>
超楽ちん。<br />
<a href="https://flows.nodered.org/node/node-red-node-base64">https://flows.nodered.org/node/node-red-node-base64</a><br />
こいつをメニュー「パレットの管理」から追加して使うだけ。<br />
msg.payload がバイナリバッファなら base64 にしてくれて、逆に base64 だったらバイナリバッファにしてくれます。<br />
<h2>
方法2:Node.js の Buffer クラスを利用する。</h2>
<b><span style="color: red;">下記、new Buffer() は非推奨になりました。<br />
今後は変わりに Buffer.from() を使いましょう。</span></b><br />
<a href="https://nodejs.org/api/buffer.html">https://nodejs.org/api/buffer.html</a><br />
<br />
function ノードで<br />
<blockquote class="tr_bq">
<span lang="EN-US">let buffer = new Buffer(msg.payload);<br />
msg.payload = buffer.toString('base64');<br />
return msg;</span></blockquote>
とかすれば base64 に変換できます。<br />
これも楽ちん。<br />
逆にバイナリバッファにデコードしたいときは<br />
<blockquote class="tr_bq">
<span lang="EN-US">msg.payload = new Buffer(msg.payload, 'base64');<br />
return msg;</span></blockquote>
てな感じ。<br />
<br />
おしまい。パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-70649571819168439892018-05-21T17:50:00.003+09:002018-05-21T17:50:57.116+09:00Vcc、Vee、Vbb、Vdd、Vss、Vgg、V+、V-、GND、の違いとは?トランジスタの歴史的な経緯により、異なる表記になったようです。<br />
とりあえず Vcc、Vdd は入力電圧。<br />
Vee、Vss は出力電圧ないしは GND と思っておけば OK と思われます。(すごいマサカリ飛んできそうですがw)<br />
<br />
具体的には回路の内部構造が TTL なのか CMOS なのかによって使い分けられているようです。<br />
<br />
TTL なら<br />
Vcc:コレクター<br />
Vee:エミッター<br />
Vbb:ベース<br />
<br />
CMOS なら<br />
Vdd:ドレイン<br />
Vss:ソース<br />
Vgg:ゲート<br />
<br />
ってことらしいよ。<br />
でも TTL と CMOS が混在している回路も増えてきて、人類の見通しの甘さを露呈しているらしいよwパンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-15875687479840946462018-05-02T13:15:00.001+09:002018-05-22T15:15:24.930+09:00Arduino の使い方(初心者向け)2018年版Arduino 互換ボードを買ったので自分用の初心者向け基礎知識な備忘録。<br />
いつものごとく間違っていることも自信満々に書いてるぞ☆<br />
[書き始め2018年5月/飽きるまで随時更新]<br />
<br />
以下、Arduino UNO 互換ボードと NANO 互換ボードでの話だよ。<br />
Arduino は、いろいろな種類があって特にハード面ではかなり異なるので、しっかり確認してから使う。(電源とか)<br />
<h2>
Arduino とは?</h2>
<div>
マイコンの動作に必要なものをボードにまとめたもの。</div>
<div>
つまりマイコンを簡単に使えるようにしたもの。</div>
<div>
Arduino の種類によって乗っているマイコンが異なり、当然仕様や機能なども変わってくる。</div>
<div>
ハード自体がオープンソースなので、色々と派生したり亜種があったりする。</div>
<div>
<br /></div>
<div>
ちな、Raspberry Pi とは違って OS はない。<br />
<h2>
スケッチ?</h2>
</div>
<div>
プログラムのこと。</div>
<h2>
便利なサイト</h2>
<div>
<a href="https://www.arduino.cc/">Arduino 公式</a></div>
<div>
<a href="https://create.arduino.cc/">Arduino Create</a></div>
<div>
Web Editor とかある。<br />
<br />
<a href="https://www.tinkercad.com/circuits">Tinkercad Circuits</a><br />
<img border="0" data-original-height="327" data-original-width="500" height="130" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxHcRnd3wqcmRAR832V3WtwZMl5XPeUshLYNnxIBRAI0wMazHwPE2WZyitk3rcIuLKgGCuDaFlmx3HvivvMnn_Ls2F57VJeUU8c3XRoGdvl91sDgGZ_naEfeBRmxzj_7f4Tm2DrKt3kZRU/s200/program%255B1%255D.gif" width="200" /><br />
ブレッドボード図(回路図)作成から、シミュレーション、スケッチ作成までできるちょっと凄すぎる Web サービス。<br />
Fritzing ほど部品はないけど、基本的なものは揃っているし、なによりシミュレーションできるのが助かりすぎる!<br />
提供元は 3DCG ソフトウェアで有名な Autodesk 。要 Chrome か Firefox。<br />
<br />
<a href="http://www.falstad.com/circuit/">Circuit Simulator Applet</a><br />
Webブラウザ上で動く回路シミュレータ。<br />
ちょっと癖のある使い勝手だけど、ショートカットキーを覚えるとすごく早く回路が組める。<br />
Arduino に繋ぐ回路のテストに便利。</div>
<h2>
開発環境(IDE)</h2>
<div>
やっぱ今どきは Web IDE っしょ。<br />
<a href="https://create.arduino.cc/">Arduino Create</a></div>
<div>
互換ボードでもOK。<br />
【要確認】Arduino 以外のマイコンは、Libraries で検索して Favorites からzipダウンロードして Custom に上げれば使えるっぽい?</div>
<h2>
電源</h2>
<div>
電源スイッチはない。PC じゃないから電ブチOK。<br />
<h3>
UNO</h3>
</div>
<div>
動作電圧:5V<br />
DCジャックの入力電圧(推奨):7-12V<br />
<br />
給電は USB から DCジャックから VIN ピンからのいずれか。<br />
ただし VIN は直でマイコンにつながっているので、5V 以外繋いだらイカン。(5.5V くらいまでらしいよ)<br />
<h3>
NANO</h3>
</div>
<div>
動作電圧:5V</div>
<div>
VIN の入力電圧(推奨):7-12V</div>
<div>
<br /></div>
<div>
給電は USB から VIN から 5V ピンからのいずれか。</div>
<div>
UNO とは異なり VIN はレギュレータに繋がっているので、7~12V を繋げられる。</div>
<div>
また、5V ピンからも給電できるが、これは安定した 5V を繋げる必要がある。</div>
<h2>
(アナログ・デジタル)I/O ピン</h2>
<div>
I / Oピンあたりの扱える推奨DC電流は 20mA まで。<br />
いくつかのピンをまとめて出力 150mA 入力 100mA の制限もあるけど、1ピン 20mA を制限としていれば問題ない。はず。(さすがに 10 本のピンで 20mA 出したら壊れるそうです;)<br />
<br />
5Vピンは200mA。<br />
3.3Vピンは50mA。<br />
<br />
PWM 出力ができるのは、UNO の場合はボードに~が描かれているピンのみ。<br />
NANO の場合は D3,D5,D6,D9,D10,D11 ピンが対応。<br />
アナログ出力(PWM)のためにデジタルピンを使うという点がややこい。</div>
<h2>
13番のピン</h2>
<div>
13番は内蔵 LED と連動している。<br />
プログラムの定数「LED_BUILTIN」がこれ。<br />
<h2>
UNO と NANO のマイコン</h2>
</div>
<div>
ATmega328P<br />
スケッチ済みのマイコンを Arduino から取り外してブレッドボード上で動作させるなんてことも可能。<br />
まぁ互換ボードは殆どマイコン取り外せないけどなw<br />
よく商品説明とか名称に「SMD」とか書いてあるけど、それは表面実装(Surface Mount Device)されてるから(結果的に)マイコン取れないぞってことらしいよ。<br />
<h2>
マイコンのタイマー</h2>
<h2>
割り込みとは?</h2>
<h2>
SPI、I2Cとは?</h2>
</div>
<div>
どちらもシリアル通信の規格。</div>
<div>
マスター(親機・Arduinoなど)とスレーブ(子機・センサーなど)の通信に利用される。</div>
<div>
SPI は線が多くなるけど比較的高速に通信できる。</div>
<div>
I2C は線は少なくて済むけど比較的低速な通信になる、といった違いがある。</div>
<div>
どちらも複数のデバイスを接続できる。</div>
<div>
デバイスの電源電圧に注意。</div>
パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com1tag:blogger.com,1999:blog-1884643169428471138.post-10514026862595080102018-04-11T18:13:00.001+09:002018-04-13T14:02:35.672+09:00Stencyl 3.4.0 での HTML5 書き出しについてFlash 死亡とともに、どうも Stencyl も衰退しつつあるようですが、実験的とは言え HTML5 書き出しもできるようなのでテストしてみました。<br />
<br />
テスト環境は以下のとおりです。<br />
<ul>
<li>Windows 8.1 64bit</li>
<li>Stencyl 3.4.0 (Build 9300)</li>
</ul>
まずいきなり Test Game はできるのに HTML5 での Pubilish が<br />
「Encountered errors while building your game.」<br />
などと表示されて失敗する現象に遭遇。<br />
<br />
シーンを作っただけのゲームでも発生するので、初っ端から絶望モードですが、思い切って Stencyl を再インストールしたら、このエラーは発生しなくなりました。<br />
ただし、単に再インストールするだけではなく事前に<br />
C:\Users\{ユーザー名}\AppData\Roaming\Stencyl<br />
を削除またはリネームしておく必要がありました。<br />
<br />
なお、そのフォルダ内の<br />
stencylworks\games<br />
にはゲームデータが入っているので、再インストールして作成された同フォルダにコピーすれば、引き続き利用できます。<br />
先の書き出せなかったゲームも新環境では書き出せたので、このフォルダ内の何かが悪さしていたのかなと思います。<br />
<br />
ちなみに、そうしてインストールした Stencyl を立ち上げたら「パーミッションがないぞ」みたいなメッセージが出ましたが無視しても問題なく使えておりますw<br />
<h3>
HTML5での注意点</h3>
<ul>
<li>IE11 では動かない。(Edge は未確認)</li>
<li>Sound ファイルは ogg を要求される。</li>
<li>iPhone では音が出ない。(Android は OK)</li>
<li>Setting の項目は WEB っぽい</li>
<li>Setting の Scale Mode は無視されるっぽい</li>
<li>Setting の Start In Full Screen? をチェックすると動かない</li>
</ul>
PCの Chrome と FireFox そして Android の Chrome では問題なし。<br />
<h3>
SWF 向けに作ったものを HTML5 で書き出し直した<strike>アホな</strike>ゲーム</h3>
<div>
<div>
いずれもスマホでは画面サイズとかタップとかの関係で遊べません。</div>
</div>
<div>
<br /></div>
<div>
<a href="http://mutenka.pandako.com/ahoge201504html5/">IEON スーパーマーケット</a> | <a href="http://mutenka.pandako.com/ahoge201504/">Flash版</a></div>
<div>
分かりにくいけどタイトル画面で既に商品並び替えできますんで。</div>
<div>
<br /></div>
<div>
<a href="http://mutenka.pandako.com/ahoge201401html5/">身を粉にして働け車</a> | <a href="http://mutenka.pandako.com/ahoge201401/">Flash版</a></div>
<div>
概ね問題なし。</div>
<div>
<br /></div>
<div>
<a href="http://mutenka.pandako.com/murige201312html5/">鏡の女王</a> | <a href="http://mutenka.pandako.com/murige201312/">Flash版</a></div>
<div>
ドワーフに捕まった時のシーンリロードで Blur Out が機能していない。</div>
<div>
他の効果では問題なかったけど、あえてそのままにしています。</div>
<div>
<br /></div>
<div>
あれ?結構いけるじゃないですか。</div>
<div>
スマホ向けゲームもちゃんと意識して作ればいける気がします。</div>
<div>
まぁミニゲームばかりなので、もっと大規模なゲームだとなにか問題が出るかもしれませんが、いつまでも実験段階なのは何が問題なのでしょうか。</div>
<div>
購入者専用フォーラムとか見たら書いてあるのかなー。</div>
<div>
<br /></div>
しかし告知通り2017年中に HTML5 対応が完了していればワンチャンあったのではないかと思うだけに残念でなりません。パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-23319347712437989602018-01-26T12:37:00.003+09:002018-01-26T13:25:28.617+09:00Raspberry Pi の純正カメラモジュール(v2)を Motion で利用する方法そもそも Motion の公式ドキュメントにやり方は書いてあります。<br />
<br />
<a href="https://motion-project.github.io/motion_config.html#Basic_Setup_PiCam">https://motion-project.github.io/motion_config.html#Basic_Setup_PiCam</a><br />
<br />
Motion で純正カメラモジュール(Piカメラ Official V2)を利用したい場合は<br />
<br />
sudo apt-get install motion<br />
<br />
で Motion をインストールした後<br />
<br />
sudo modprobe bcm2835-v4l2<br />
<br />
で bcm2835-v4l2 モジュールをインストールすればOK。<br />
<br />
もちろん「Raspberry Pi の設定」で「インターフェイス」の「カメラ」は有効にしておきましょう。<br />
<br />
引き続き raspistill コマンドなんかも Motion が動いていないときであれば利用できます。<br />
<br />
motion の設定方法や使い方も、まずは公式ドキュメントをご覧になることをおすすめします。<br />
<br />
<a href="https://motion-project.github.io/motion_guide.html">https://motion-project.github.io/motion_guide.html</a><br />
<br />
ブラウザ上で確認しながら設定変更する方法なんかもあります。(ちょっと野暮ったいですが…)<br />
パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-26210935865980898962018-01-05T14:25:00.000+09:002018-01-05T14:25:12.062+09:00Microbit の稼働時間(ミリ秒)があんまり正確ではない問題Microbit で時計やタイマーやストップウォッチを作ってみたくなるのは誰しもが通る道かと思いますが、いざ「稼働時間(ミリ秒)」や「一時停止(ミリ秒)」を使ってやってみると、全然正確ではないことがわかります。<br />
<br />
まず試しに、このような3分タイマーを作ってみました。<br />
タイマー開始と終了時にニャンキャットが流れます。<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpigY9lxz-9NCD7nbQ1f6lY17q1aTc5LzktdYJpe_Z1miMjWEJlyRDOtSYwTVa3_swuNUOpEKSsrz103-PyE1mMWfxQRjXlnaUEFFN200JYg8pT64rK1lEtw9ZItpcROeYeS2FpwUYYPNS/s1600/timer02.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="359" data-original-width="1078" height="132" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpigY9lxz-9NCD7nbQ1f6lY17q1aTc5LzktdYJpe_Z1miMjWEJlyRDOtSYwTVa3_swuNUOpEKSsrz103-PyE1mMWfxQRjXlnaUEFFN200JYg8pT64rK1lEtw9ZItpcROeYeS2FpwUYYPNS/s400/timer02.png" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><a href="https://makecode.microbit.org/_KLpD52ek41af">エディターでみる</a></td></tr>
</tbody></table>シミュレーター上では特に問題ないのですが、実機で動かして実際のストップウォッチで計ってみると、だいたい3分1秒くらいで音がなります。<br />
これを10分にしてみると、だいたい10分3秒くらいに音がなりました。<br />
どうやら1分間で約0.3秒ほど遅れるようです。<br />
<br />
まぁ数秒のズレならまだ良いのですが、そもそも私は1時間毎にお知らせするタイマーを作りたかったので、これでは1時間18秒毎にお知らせするタイマーになってしまいます。<br />
(2時間後には36秒もズレるわけです)<br />
<br />
ただ、何度試しても結果が大きく変わることはなかったので、ある程度正確に「遅れている」ようです。<br />
つまりこの遅れ分、早めてあげればもう少し精度が上げられそうです。<br />
<br />
ということで、60 - 0.3 = 59.7 = 59700ミリ秒を1分としてカウントするタイマーを作ってみました。<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibiKsBEXc85gw_eY3RLIDWxOJjmMrB9HWjdKx35pfu-cJSoHBwk5ui8vz2vKQSCU-8hrwXvcw-mkbtL2xFZ7AV-bSDhwbrZOdlYBhszaFS-OCNauNzxDlgb68DXDy2Tuq24HLfU30-Vsta/s1600/timer01.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="429" data-original-width="1008" height="170" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibiKsBEXc85gw_eY3RLIDWxOJjmMrB9HWjdKx35pfu-cJSoHBwk5ui8vz2vKQSCU-8hrwXvcw-mkbtL2xFZ7AV-bSDhwbrZOdlYBhszaFS-OCNauNzxDlgb68DXDy2Tuq24HLfU30-Vsta/s400/timer01.png" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><a href="https://makecode.microbit.org/_h6rMsEYitPJe">エディターでみる</a></td></tr>
</tbody></table>上記のとは変数「分」の使い方が変わっている点に注意w<br />
<br />
今度は開始は「ピコーン!」でアラームを「ニャンキャット」にしました。<br />
また、簡素化のためグラフ表示は無しw<br />
<br />
これで3分程度ならば、気にならないレベルになりました。<br />
<br />
しかし、1時間で試してみたところ、まだ数秒ズレが発生してしまいます。<br />
しかも困ったことに試す度に微妙に結果が異なるようになってしまいました。<br />
流石にこのレベルになると、電源や気温、個体差などによって変化してしまうのかもしれません。<br />
<br />
私の環境では、59690ミリ秒を1分とすることで、1時間あたりの誤差を1秒以下にすることができました。<br />
そのあたりは環境に合わせ、みなさん調整してみてください。<br />
<br />
おしまい。パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-81111203967369086302017-12-27T13:03:00.000+09:002017-12-27T13:04:33.560+09:00Azure の Web App Bot(Bot Framework)の Teams チャンネルが繋がらない場合の対処法なんかバグらしいですよw(2017年12月現在)<br />
https://stackoverflow.com/questions/tagged/microsoft-teams<br />
<br />
Azure の Bot Framework (Web App Bot とか Bot Channels Registration とか Functions Bot とか)を Microsoft Teams チャンネルと接続してもサーバーにメッセージが送られないという問題があります。<br />
<br />
で、どうすればいいかというと、なんと!<br />
<ol>
<li>Microsoft Teams チャンネルを追加する前に <span style="color: red;"><b>Skype チャンネルを追加</b></span>します!</li>
<li>それからMicrosoft Teams チャンネルを追加!</li>
<li>すると動くwww</li>
</ol>
<div>
もし先に Teams チャンネルを追加してしまっている場合は、Skype 追加してから Teams 消すと動きます。(私の環境では消しただけで動きました超意味不明w)</div>
<br />
<br />
早く修正されるといいなー。お試しあれ。パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com0tag:blogger.com,1999:blog-1884643169428471138.post-17097492436335380822017-12-20T13:16:00.000+09:002017-12-20T13:23:00.609+09:00microbit にネジをつけると色々捗る<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGIPbHDe7jXm4FxQCZnW4jqGYrzzhpKe-XibzxsFokBSsrigA01guyG_hxdE4FR3VtuEsmTjQLfx2P2NsOokjG-XMkhDHy439ioXv6NTVDgP0KqFfsNHJjRJ8iuLNgekkVJ6nlOOZuy-yO/s1600/microbit-front%255B1%255D.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" data-original-height="364" data-original-width="431" height="168" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGIPbHDe7jXm4FxQCZnW4jqGYrzzhpKe-XibzxsFokBSsrigA01guyG_hxdE4FR3VtuEsmTjQLfx2P2NsOokjG-XMkhDHy439ioXv6NTVDgP0KqFfsNHJjRJ8iuLNgekkVJ6nlOOZuy-yO/s200/microbit-front%255B1%255D.png" width="200" /></a></div>
micro:bit の大きな GPIO 端子にはバナナクリップやワニクリップを繋ぐことができますが、何度もガシガシしてると傷ついてしまいそうで心配になります。<br />
<div style="clear: both;">
そこで、Kitronik の<a href="https://www.switch-science.com/catalog/3178/">電源ボード</a>を参考に、GPIO 端子にネジ(ボルト)を付けてみたところ、すごく便利だったので記事にしてみました。</div>
<br />
なお、この記事は <a href="https://qiita.com/advent-calendar/2017/microbit">microbit Advent Calendar 2017</a> の21日に参加しています。<br />
<h2>
作り方</h2>
まず、以下のものを用意します。<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiS0Q74eb_rPKW-_3TQ8kS5vp27Zw3MH8qn0t1HRuyXjN8X90Gu5GGRCgGImef5_jzK8_OgsPRqk6JnJGqDIUunMDqe49GksGUdOfcoPGDdSIeVPqBEgFWsl80z2DRoT192X0-hmROfBiSC/s1600/0614.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="322" data-original-width="429" height="240" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiS0Q74eb_rPKW-_3TQ8kS5vp27Zw3MH8qn0t1HRuyXjN8X90Gu5GGRCgGImef5_jzK8_OgsPRqk6JnJGqDIUunMDqe49GksGUdOfcoPGDdSIeVPqBEgFWsl80z2DRoT192X0-hmROfBiSC/s320/0614.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">※写真のスペーサーは 10mm です;</td></tr>
</tbody></table>
<ul>
<li><b>皿ネジ×5個</b>:サイズ M3、長さ 5mm</li>
<li><b>スペーサー(オネジ・メネジ)×5個</b>:サイズ M3、長さ <span style="color: red;">5mm</span></li>
<li><b>ナット×5個</b>:サイズ M3</li>
</ul>
<div>
通電させたいので、いずれも素材は黄銅(真鍮)、メッキはニッケルのものが良いです。</div>
<div>
ネジは皿です。なべネジだと隣接する端子に接触してしまう恐れがあります。</div>
<div>
画像内の「お菓子の箱の紙」は絶縁用に用意したものですが、お金に余裕のある人は素直に絶縁ワッシャーを用意すべきだと思います。(でも後記の理由により要らないかも)</div>
<div>
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div>
で、それらをこんな感じに取り付けます。</div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIak_TViDVqrUo9rQKF0YNpgApByl-ea89LAPYOuVHqqyip-wmSbKQf5ns7bsJVaxjyZATcA-8Wh1Gs0nbquT3UelgsAVs7HFQrhzzJYKPJTHT0oPAhXxCb80pIWb7uTz3tisJ_6d7g8Xk/s1600/0615.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="297" data-original-width="396" height="240" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIak_TViDVqrUo9rQKF0YNpgApByl-ea89LAPYOuVHqqyip-wmSbKQf5ns7bsJVaxjyZATcA-8Wh1Gs0nbquT3UelgsAVs7HFQrhzzJYKPJTHT0oPAhXxCb80pIWb7uTz3tisJ_6d7g8Xk/s320/0615.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">※しつこいようですがこのスペーサーは 10mm です;</td></tr>
</tbody></table>
<div>
ネジ・micro:bit・絶縁体・スペーサー・ナット、という順番です。</div>
<div>
ちなみに、<a href="https://qiita.com/nakatafu/items/f963921146d2ccaddd3e">こちらの記事</a>によると micro:bit の裏側の GPIO 端子(っぽいもの)はどこにも繋がっていないらしいので、そもそも絶縁する必要もないかもしれません…未確認ですが…(^o^;)</div>
<div>
<br /></div>
<div>
さて、これらを取り付けるだけで、なんと micro:bit が!</div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXEbpUKIOM-AzF9YwR-imDwg8_qqXlsU5nAvLMKa4m1bLvLaj6sfHZKNiUV7qntSOBBT-NBbwPyxxojpYdz1YL6q58bWTsiXgbbbEuJyf1PZNWEzAhFoOAIAmQGXBB3P9CVW_yWhX6vtC4/s1600/0616.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="340" data-original-width="453" height="240" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXEbpUKIOM-AzF9YwR-imDwg8_qqXlsU5nAvLMKa4m1bLvLaj6sfHZKNiUV7qntSOBBT-NBbwPyxxojpYdz1YL6q58bWTsiXgbbbEuJyf1PZNWEzAhFoOAIAmQGXBB3P9CVW_yWhX6vtC4/s320/0616.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">※既にご承知の通り 10mm です</td></tr>
</tbody></table>
<div>
立ちます!(爆)</div>
<div>
<br /></div>
<div>
LED も見やすくなるし、操作もしやすくなるので個人的にはこれだけでもやる価値はあると思います。まじで。</div>
<div>
ただし、うっかり<span style="color: red;">鉄板などの上に置くとショートする</span>のでご注意くださいw</div>
ちなみに写真のように 10mm のスペーサーを利用すると、より安定します(>▽<)b<br />
<div>
<br /></div>
<div>
そして当初の目的通り、心置きなくワニれます。</div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEie-qBavcNEo2CvjR4GvW1bifzIb08nbO57aeAi6TomO5eHySobm_tK1BkrqI1RxDUG8wsCA-O6Vx3lDaiqK8WDiwAYlx2n1NePQaIFpl_sglaTmxJl7R9E_ZY1A5jompoaSXhTLycSEdJy/s1600/0620.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="360" data-original-width="480" height="240" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEie-qBavcNEo2CvjR4GvW1bifzIb08nbO57aeAi6TomO5eHySobm_tK1BkrqI1RxDUG8wsCA-O6Vx3lDaiqK8WDiwAYlx2n1NePQaIFpl_sglaTmxJl7R9E_ZY1A5jompoaSXhTLycSEdJy/s320/0620.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">ネジ山は気にしない派</td></tr>
</tbody></table>
<div>
さらにナットで足を挟めば……</div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiR9DuXXGZoEzDuLoX1y8UJQKDaP-xfpO5DAekuzNi-rcEfCdywnjzOg7vCl4A2S0sPHDSaMa1f_oqLt6pDXXNcwvB7mZNOx0LSNlUvpOJsQIlhvyuvFtCIK0GW9782oFP0dAY8VXtnuV_Y/s1600/0625.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="360" data-original-width="480" height="240" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiR9DuXXGZoEzDuLoX1y8UJQKDaP-xfpO5DAekuzNi-rcEfCdywnjzOg7vCl4A2S0sPHDSaMa1f_oqLt6pDXXNcwvB7mZNOx0LSNlUvpOJsQIlhvyuvFtCIK0GW9782oFP0dAY8VXtnuV_Y/s320/0625.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">足はかぎ状にすると良い</td></tr>
</tbody></table>
ブレッドボードに刺せれて、これまた便利!<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiug-I7D9Zbc73E2mk-Si2EjzG-NxFeOMOcCKvFLqrXTZImAeFQ1epzwnsm6C_V1lYr5gxBvIr7oY1H8QlIRxQuaQs-1GhO6MqPmd9eRO83L2EghWZoMwq-q0Pp-vdKhbo_JWt-ROerBb8A/s1600/0623.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="360" data-original-width="480" height="240" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiug-I7D9Zbc73E2mk-Si2EjzG-NxFeOMOcCKvFLqrXTZImAeFQ1epzwnsm6C_V1lYr5gxBvIr7oY1H8QlIRxQuaQs-1GhO6MqPmd9eRO83L2EghWZoMwq-q0Pp-vdKhbo_JWt-ROerBb8A/s320/0623.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">しかも立つ!</td></tr>
</tbody></table>
さらにさらに、ユニバーサル基板をなんやかんやすることでオリジナルの電源ボードなんかも付けることができます!ヽ(=´▽`=)ノ<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifm82ljRv7qe3v3DNFMIR04TMixuZZVZysTNee_tILkyXqeIeuwZRTfD3XtAN9P7ZMpl3TFiaKifCwo8khy7Fpw_FQEjDIdhm9qXoPAdFGxyf7HMJKqC-YPIJTfr8fX_OegICH-tkDc-mU/s1600/0647.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="360" data-original-width="480" height="240" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifm82ljRv7qe3v3DNFMIR04TMixuZZVZysTNee_tILkyXqeIeuwZRTfD3XtAN9P7ZMpl3TFiaKifCwo8khy7Fpw_FQEjDIdhm9qXoPAdFGxyf7HMJKqC-YPIJTfr8fX_OegICH-tkDc-mU/s320/0647.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">せっかくなので圧電サウンダとブザーとLEDも付けた</td></tr>
</tbody></table>
コンパクトかつコードレスなので持ち運びやすくなって、超絶便利です。<br />
こういった使い方をする場合、スペーサーの長さを 5mm にすることがポイントです。<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRXgfXMaZhIY2kqE2m7TmoyQd1ycz2J7WMm8sdNgtO19ZZXMcxq5Rk6FmYlTJL1z3VitPbYCcUD50_063qBNtCxL0F_7hY0JptVozp2USPby7DXozAZSD6DsBMUuFsp47upbr0MMdsbqy2/s1600/0654.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="360" data-original-width="480" height="240" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRXgfXMaZhIY2kqE2m7TmoyQd1ycz2J7WMm8sdNgtO19ZZXMcxq5Rk6FmYlTJL1z3VitPbYCcUD50_063qBNtCxL0F_7hY0JptVozp2USPby7DXozAZSD6DsBMUuFsp47upbr0MMdsbqy2/s320/0654.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">皆さんお待ちかね 5mm の写真です</td></tr>
</tbody></table>
写真では私の無計画な半田付けがそれを台無しにしていますが、5mm スペーサーだと基盤がうまいこと電源用コネクターに乗っかって、安定することが分かるかと思います。<br />
<div>
<br />
このオリジナル電源ボードの作り方も、いつか記事にしたいと思います。<br />
<h2>
おわりに…</h2>
ネジとかナットってホームセンターとかだと100個単位とかでしか売ってなくて全然安くないし、そもそも鉄ユニクロとかしかなかったりするので、電子部品屋さんで買ったほうが良かったりしますよねー。<br />
<br />
初めてアキバの西川電子部品さんで買ったんですが、「全部で60円!」とか言われたときはなんか申し訳ない気持ちになりましたw<br />
<br />
おしまい!</div>
パンダコhttp://www.blogger.com/profile/02636300771182432252noreply@blogger.com1