Skip to content

Instantly share code, notes, and snippets.

@sfpgmr
sfpgmr / .gitignore
Last active October 18, 2015 07:08
Web Audio モジュラー接続画面デモ
typings
@sfpgmr
sfpgmr / .gitignore
Last active October 20, 2015 12:25
Web Audio APIのモジュラー接続デモを作ってみる(3)
typings
src
.vscode
@sfpgmr
sfpgmr / .gitignore
Last active October 24, 2015 21:22
Web Audio APIのモジュラー接続デモを作ってみる(4)
typings
src
.vscode
node_modules
bower_componets
@sfpgmr
sfpgmr / README.md
Last active January 4, 2016 08:27
馬の3Dアニメーション(VR対応)
@sfpgmr
sfpgmr / README.md
Last active January 11, 2016 08:23
ブロック崩しを作る(1)
@sfpgmr
sfpgmr / Readme.md
Last active May 25, 2016 20:24
YouTube Viewer Sample

このサンプルについて

Youtube Data APIとYoutube Player APIを使用した勉強を兼ねたサンプルコードです。

使い方

  1. 検索したいタイプ(Channel,Video,Playlist)を選択します。
  2. 検索ボックスにキーワードを入力し、エンターキーを押すと検索結果をサムネイルで表示します。
  3. チャンネルやプレイリストをクリックすると動画一覧を表示します。動画一覧にマウスカーソルをポイントするとプレビュー再生します。
@sfpgmr
sfpgmr / index.html
Last active May 25, 2016 20:32
WebGL 0001 地球と戦闘機を表示する
<!DOCTYPE html>
<html>
<head>
<title>WebGL Test</title>
<meta name="keywords" content="WebGL,HTML5,three.js" />
<meta name="description" content="WebGL,HTML5,three.js" />
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//www.sfpgmr.net/scripts/three/three.js"></script>
<script src="//www.sfpgmr.net/scripts/three/Detector.js"></script>
<script src="//www.sfpgmr.net/scripts/three/stats.min.js"></script>
@sfpgmr
sfpgmr / README.md
Last active October 23, 2016 09:04
SVGからthree.jsのshapeへの変換(3)

SVGからthree.jsのshapeへの変換(3)

エドワード・マイブリッジの「Horse in motion」をInkscapeでトレースし、各馬をセル化したものをthree.jsのshapeに変換し表示しています。

3Dっぽく回転させてみてます。

下記のURLから動くデモが見れます。Windows 10 Tech Preview 9926 のIE11では動作しませんでした。ひょっとするとIE11ではそもそも動作しないのかもしれません。原因は不明ですが。。

http://bl.ocks.org/sfpgmr/afe9d11885e81086fa80

@sfpgmr
sfpgmr / README.md
Last active October 23, 2016 09:08
SVGによる馬のアニメーションです。

SVGアニメーション

SVGによる馬のアニメーションです。 エドワード・マイブリッジの「Horse in motion」をInkscapeでトレースし、各馬をセル化してアニメーションしています。

@sfpgmr
sfpgmr / README.md
Last active October 23, 2016 09:09
three.jsのPathのシリアライズ

three.jsのPathのシリアライズ(2)

エドワード・マイブリッジの「Horse in motion」をInkscapeでトレースし、各馬をセル化したものをthree.jsのshapeに変換し表示しています。

今回はシリアライズ・デシリアライズのコードを最適化してみました。 http://bl.ocks.org/sfpgmr/cee0c48acb0854e2055c#pathSerializer.js

下記のURLから動くデモが見れます。Windows 10 Tech Preview 9926 のIE11では動作しませんでした。ひょっとするとIE11ではそもそも動作しないのかもしれません。原因は不明ですが。。

http://bl.ocks.org/sfpgmr/cee0c48acb0854e2055c