You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
2014.08.20 名前を変更しました。 wamml => MMLEmitter Web Audio API用のMMLイベントシーケンサーを作りました。 MMLEmitter- GitHub MMLEmitter - online playground 概要 音楽プログラムを大雑把に説明すると 楽器 (音色) 譜面 (音程とタイミング) の二つの要素を解決するプログラムと言えます。MMLEmitter はこの 譜面 の部分のみを解決するライブラリです。AudioContext と MML を引数にシーケンサーを生成して起動すると、MML に記述したタイミングでイベントが発火するので、そこで音を出す処理を行います。Web Audio API 依存なので今のところ(サポートされないかぎり) IE では動作しません。あ、MML というのは楽譜を文字列で表現するための記法です。 MML - Mu
最近、Google から物理エンジンに関して面白そうなライブラリが登場したようなので jsdo.it で試してみました。 Googleがオープンソースの2D物理エンジンLiquidFun 1.1をリリース このライブラリは「Box2D」(2D の物理エンジンライブラリ)に、流体シミュレーション関連の機能を拡張したライブラリとなっているようです。 (ちなみに、JavaScript 版のライブラリは、C++ 版を Emscripten でコンバージョンしたものとなっているようです。) Wave Machine Particles Soup Soup Stirrer Impulse Rigid Particles Elastic Particles Surface Tension Theo Jansen サンプルを動かしてみるだけでも、結構楽しいので、興味がある方は試してみては如何でしょうか。
ここ数日、2D 物理演算がマイブームです。 JavaScript の 2D 物理演算ライブラリとして「box2dweb」をサンプルをよく見かけますが、 シェイプと剛体を個別に作成する必要があり、個人的には、ちょっと使いにくい印象です。 そこで、比較的、最近登場した物理演算ライブラリ「Matter.js」を使ってみることにしました。 このライブラリは機能的に「box2dweb」と遜色なく、後発なだけに、API も整理されていて分かりやすいです。他のライブラリに比べてコンパクトな点も特徴です。 ゴゴゴとドドド ゴゴゴのコード(抜粋) シェイプの Path は SVG ライクに記述する仕様のようです。 for (var i = 0; i < 3; i++) { var x = 100 + i * 10; var y = 100 - i * 100; var shape = { label: 'S
昨日の記事の続きです。 jsdo.it を1年間続けて分かったこと - CX's Hatena Blog jsdo.it で試してみたライブラリをカテゴリ別にまとめてみました。 「→」にあるリンクは各ライブラリに対するサンプルになります。 2D(Canvas 系) Pixi.js https://github.com/GoodBoyDigital/pixi.js → pixi.js でドット絵を変形させるテスト - jsdo.it EaselJS https://github.com/CreateJS/EaselJS → EaselJS でレゴっぽくドット絵を作るテスト - jsdo.it Fabric.js https://github.com/kangax/fabric.js → fabric.js でドット絵を描いてみるテスト - jsdo.it Paper.js https://g
春の某試験に向けて勉強をしているのですが、息抜きに、SVG を使って、問題の解答を描いて見ました。 1.素の SVG で図を描いてみる 2.ライブラリ+JavaScript を用いてアニメーションさせてみる なお、ライブラリとして Snap.svg - Home を使用してみました。 Snap.svg は Raphael.js の作者による SVG のライブラリで、Raphael.js との大きな違いは、モダンブラウザを対象にしている点とのことです。 ライブラリに助けられている部分は、ありますが、JavaScript でアニメーションを同期的に表示するのは意外に難しいのだと感じました。(単に、自分が、使い方を理解してないだけかと思いますが。。。) おまけ 以前、HTML5 Canvas を用いて、某クイズの解答をアニメーションで作っていたことを思い出しました。 アニメーションで表現した方が
Why SVG (and Snap)? SVG is an excellent way to create interactive, resolution-independent vector graphics that will look great on any size screen. And the Snap.svg JavaScript library makes working with your SVG assets as easy as jQuery makes working with the DOM. Modern features for modern browsers Snap.svg is designed for modern browsers and therefore supports the newest SVG features like masking
All library need for game in 163kb png file. Each pixel is one ascii character look sphere texture. library used Three.js, Oimo.js, Sea3d, Rvo.js, TweenLite. green ball control by oimo red ball control by rvo var head = document.getElementsByTagName('head')[0]; var info = document.getElementById('info'); var sourceInfo = ""; var img = new Image(); img.onload = function() { var t01 = Date.now(); va
○○ で地球を回してみるシリーズ。 今回日程 シリーズ構成言語 1日目OpenGL で地球を回してみるテスト C/C++ 2日目DirectX で地球を回してみるテスト C/C++ 3日目Java 3D で地球を回してみるテスト Java 4日目WebGL で地球を回してみるテスト JavaScript 5日目Three.js で地球を回してみるテスト JavaScript 6日目Babylon.js で地球を回してみるテスト JavaScript 7日目gl.enchant.js で地球を回してみるテストJavaScript 8日目PhiloGL で地球を回してみるテスト JavaScript 9日目CubicVR.js で地球を回してみるテスト JavaScript ⇒最終日Away3D で地球を回してみるテストJavaScript 追加+1Flash 版 Away3D で地球を回して
○○ で地球を回してみるシリーズ。 今回日程 シリーズ構成言語 1日目OpenGL で地球を回してみるテスト C/C++ 2日目DirectX で地球を回してみるテスト C/C++ 3日目Java 3D で地球を回してみるテスト Java 4日目WebGL で地球を回してみるテスト JavaScript 5日目Three.js で地球を回してみるテスト JavaScript 6日目Babylon.js で地球を回してみるテストJavaScript 7日目gl.enchant.js で地球を回してみるテストJavaScript 8日目PhiloGL で地球を回してみるテストJavaScript ⇒9日目CubicVR.js で地球を回してみるテストJavaScript 最終日Away3D で地球を回してみるテストJavaScript 追加+1Flash 版 Away3D で地球を回してみるテ
○○ で地球を回してみるシリーズ。 今回日程 シリーズ構成言語 1日目OpenGL で地球を回してみるテスト C/C++ 2日目DirectX で地球を回してみるテスト C/C++ 3日目Java 3D で地球を回してみるテスト Java 4日目WebGL で地球を回してみるテスト JavaScript 5日目Three.js で地球を回してみるテスト JavaScript 6日目Babylon.js で地球を回してみるテストJavaScript ⇒7日目gl.enchant.js で地球を回してみるテストJavaScript 8日目PhiloGL で地球を回してみるテストJavaScript 9日目CubicVR.js で地球を回してみるテストJavaScript 最終日Away3D で地球を回してみるテストJavaScript 追加+1Flash 版 Away3D で地球を回してみるテ
Drawing lines in Mozilla based browsers and the Internet Explorer - The Code Project - JavaScript JavaScriptで線を描画する方法についての記事。 JavaScriptで線を描画するためのGraphicsクラスライブラリも配布しているようです。 Graphicsクラスライブラリを使うと、次のような簡単なコードで線を描画できるようです。 var g = new Graphics(); g.drawLine(100,50,200,70); g.paint(); ダイナミックなインタフェースを実現するJavaScript ライブラリも多いですが、 こういったJavaScriptでの図形描画機能についてもおさえておきたいですね。 関連エントリ ブラウザ上で動作するJavaScript製のMSペイ
Chart Usage (WebFX) In web applications developed now days a lot of the logic that previously resided on the server side is now being implemented on the client side. This is especially true for information presentation, components such as trees and columnlist makes it possible for users to interact with the application, or web site if you wish, without contacting the server. However the ability to
via O’Reilley Radar Yahoo! UI Library で、Yahoo! が実際に使っている Javascript のライブラリ集が公開されている。 Yahoo! のどこでこんなユーザインタフェースが使われてるんだろう? と思うぐらい、サンプルで見せられる UI パーツは豊富だ。それぞれの “Example” を見てまわるだけでもおなかいっぱいだ。 コアユーティリティ アニメーション クロスブラウザ対応の XMLHttpRequest ラッパ DOM 操作 ドラッグアンドドロップ イベントハンドリング UI コントロール部品 カレンダー スライダー ツリー ドラッグアンドドロップなんかは、ファンタジースポーツで使われているのを見たことがあるので知っていた。複数のリスト間でアイテムの移動や並べ替えを行うときには使えるパーツだろう。 日本語カレンダーなんかも、いい感じで再利
それは何? prototype.js は Sam Stephenson によって書かれた JavaScript ライブラリです。 この熟考の上記述された標準に準拠したコードは、Web 2.0 において特徴となるリッチでインタラクティブなウェブページを制作する際の重荷を、あなたの肩から取り去ってくれるでしょう。 もしこのライブラリを使ったことがあるなら、充実したドキュメントがこのライブラリの売りではないことに気がついたはずです。 私は他の開発者と同様に、ソースコードを読み、試行錯誤しながら prototype.js を理解しました。 自分が学んでいる間にメモを取り、それを他の人たちと共有することは価値があるのでは、と考えたのです。 加えて、このライブラリによって提供されているオブジェクト、クラス、関数、拡張機能についての 非公式リファレンス も提供しています。 ここで提供する例とリファレンス
ファイル resizegrip エレメントをマウスでリサイズできる透明グリップ resizegrip - エレメントをマウスでリサイズできる透明グリップ floatingWindow 浮遊するウィンドウを生成する floatingWindow - 浮遊するウィンドウクラス buttondrag エレメントをマウスでドラッグ&ドロップ buttondrag - エレメントをマウスでドラッグ&ドロップさせる floatingLayer レイヤを浮遊させる floatingLayer - 浮遊するレイヤクラス xbrowser いくつかのブラウザで共通して使える基礎関数 xdom - DOM操作系関数 isbrowser - ブラウザ判定 Point - x,y の構造体 json json方式のエンコードとデコード json - json方式のエンコードとデコード ajax 非同期通信 aja
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く