TOURISTIC:バネモデルによるグラフ描画をJavaScriptで
2007年05月17日23:34 バネモデルによるグラフ描画をJavaScriptで カテゴリIT バネモデルによるグラブ描画をするJavaScriptライブラリを書きました。 サンプルはこちら http://sawamuland.com/graph/sample.html バネモデルの基本は２つのノード(点)がつながれている場合、そこにバネがあるとして力(内向きまたは外向き)を計算し、 さらに自分とつながっていない全てのノードから距離に応じた斥力(反発する力)を受けるとして位置の移動を繰り返します。 つまり、つながれた２点が近すぎる場合は反発し、遠い場合は引き合い、つながれてない他の点からは等しくはなれようとするため多くのエッジ(線)を持つ集合が固まり、線が少ないノードはそこから離れて行きます。 この実装ではバネの力は log( ノード距離 / バネの長さ ) に適当な係数をかけて計算し
EfficientJavaScript - Dev.Opera - 効率的な JavaScript
EfficientJavaScript - Dev.Opera - 効率的な JavaScript 目次 この文書について 効率的な JavaScript ECMAScript eval や Function のコンストラクタを使うのはやめよう eval を書き換えよう 関数を使いたいなら function を使おう with を使うのはやめよう 性能を決める関数で try-catch-finally を使うのはやめよう eval と with は隔離しよう グローバル変数を使うのはやめよう 暗黙のオブジェクト変換に気をつけよう 性能を決める関数で for-in を使うのはやめよう 文字列は累積スタイルで使おう プリミティブの操作は関数呼び出しより速い setTimeout() や setInterval() には文字列でなく関数を渡そう DOM 再描画と再フロー 再フローの回数をでき
404 Blog Not Found:Digest - 今日にでも使うべきJavaScriptの7つのテクニック
2007年04月25日12:00 カテゴリLightweight LanguagesBlogosphere Digest - 今日にでも使うべきJavaScriptの7つのテクニック 良質の記事だけに全訳したかったのだけど、時間もないので紹介と抄録。 Digital Web Magazine - Seven JavaScript Techniques You Should Be Using Today サンプルコードは、適宜書き換えてあります。 1. Branch when possible - 分岐はなるはやで これは実例を見た方が早いでしょう。クロスブラウザー対応のaddListener()を考える。機能だけを考えれば、以下でOK。 function addListener(el, type, fn) { if ( window.addEventListener ) { el.addE
JavaScriptでIEかどうかをたったの1行で判別する方法:phpspot開発日誌
Dean Edwards: Sniff! My current frog exaggerator of choice JavaScriptでIEかどうかをたったの1行で判別する方法。 なんと、次の1行だけで、isMSIE 変数に、IEで見れば true 、そうでなければ false を代入することが出来ます。 var isMSIE = /*@cc_on!@*/false; 次のサンプルコードで確認しました。 <html> <script language="javascript"> var isMSIE = /*@cc_on!@*/false; if (isMSIE) { alert('IE!'); } else { alert('not IE!'); } </script> <body> </body> </html> IEであれば IE! を alert し、そうでなければ not I
javascript - はてダでは書けないはてなブックマーク技25個 : 404 Blog Not Found
2007年04月07日13:30 カテゴリLightweight Languages javascript - はてダでは書けないはてなブックマーク技25個 こういう技の紹介って、JSがあればもっとわかりやすいんだけどはてダはJS禁なので。 はてブクロニクル - 記憶する部屋 - はてなブックマーカーなら当然知ってる25個の技をわざわざ書いてみた このような、知ってる人にとっては当然かもしれないけれど、もしかすると知らない人もいるんじゃない？というものをわざわざ書くことは誰かの役になりそうだな、と考え このグループのテーマであるはてなブックマークに関するもので当たり前のことを書いてみることにします。Enjoy! Dan the Hatena::Bookmarker Blog URL Feed URL はてブID: 日付: 色: 最も多くブックマークされた記事を見る http://b.hat
メタ検索サイトものぐサーチ : 404 Blog Not Found
2007年03月17日07:45 カテゴリLightweight Languages メタ検索サイトものぐサーチ というのを作ってみた。 Monogsearch まず使い勝手がものぐさ。 検索フレーズをフィールドに入れて、検索サイトのアイコンをクリックするだけ。 それにもまして、作りがものぐさ。 これ、ファイルを一つしか使っていない。メタ検索部分は全部JavaScriptによる実装。実はローカルコピーでもちゃんと動作する(笑)。よってAjaxは使っていない。それでもAmazonのバナーは検索フレーズ連動になっているし、メタ検索サイトとして最低限の機能は備えていると思う。 感想や機能追加のリクエストは本entryへのTBまたはCommentにて。 Enjoy! Dan the Search Engineer 「Lightweight Languages」カテゴリの最新記事
画像カーソル位置をズームインできるライブラリ「tjpzoom.js」:phpspot開発日誌
valid.tjp.hu - tjpzoom.js 2.0 - JavaScript / CSS / DOM image magnifier As you may have realized, this is a tool that brings images closer. This is the new version of my script, tjpzoom. 画像カーソル位置をズームインできるライブラリ「tjpzoom.js」。 次のように、カーソル位置の画像をズームできます。 知っておけば、ウォーリーを探せ風の簡単なゲームを作ったり、サイトのキャンペーンとしての面白い１要素として使えそう。 設置方法は簡単で、まず、次のようにスクリプトを読み込みます。 <script type="text/javascript" src="http://valid.tjp.hu/zoom2/tj
miya2000の日記 - これからドラッグ＆ドロップを書く人のために
2012/07/22 追記 久しぶりに確認したところ、IE9 では以下で指摘している IE (このときは IE6 でした) の問題(3, 4, 6)がすべて解消されていました。 また、Firefox での問題(5)も Firefox14 で試したらは解消されていました(ただ、All-in-One Sidebar のパネルの上では mousemove イベントが発生しないようでした)。 Chrome20 や Safari5 でも問題無く動作していますから、現在においてドラッグ＆ドロップを実装するには mousedown 時の preventDefault() だけでOKと言えそうです。すばらしいですね！ safari で動かないらしいのでどなたか情報ください！(くやしい!) というかこういうのに勝ち負けはないので実装できてる方は是非トラックバックお願いします。当方既に ipod 中毒ですし
0.5px は見えているか？ - IT戦記
ちょっと アニメーション作ってて、見えたり見えなかったりする 1px が気になるので調べてみた いきなり、結論 結論から言うと 0.5px 〜 1px が見えるかどうかはブラウザによる。（Firefox だけ挙動が違う） 実証コード http://usrb.in/amachang/static/tmp/pxtest.html 手元のブラウザでは Win Opera 1px から見える Win IE6 1px から見える Win IE7 1px から見える Win Firefox 0.5px から見える（四捨五入で求めてる） Linux Firefox 0.5px から見える（四捨五入で求めてる） Linux Konqueror 1px から見える まとめ 1px を気にするときってありますよね！そんなときはFirefox の px 指定は四捨五入と覚えておこう。
ちょっと差のつく「Copy URL 」のカスタマイズ | *LOVE IS DESIGN*
記事を書くとき参考にした記事にリンクしたり、これも読んでほしいな……と「関連記事」のリストを入れたりすることってよくありますよね。 Firefox をお使いの方なら、アドオンの「Copy URL+」を入れている方も多いと思いますが、「Copy URL+」にひと工夫してちょっと差のつくリンクをしてみませんか？ Copy URL+で関連エントリーの被はてブ数を表示 しげふみメモ:関連記事一覧に はてなブックマーク数を付けてみる で紹介されていた 住 太陽さんの記事 は関連リンクが多すぎる気もするんですが、でもこのアイデアはなかなかいいですね。 単著もないのに関連リンクをたくさん並べていると読む気がしなくなるという方もいらっしゃるかもしれませんが、ブックマークがたくさんついていたらちょっと読んでみたいなという気になるかもしれませんね。 さっそく「<LI>タグ付きでリンクとブックマーク数」を us
【コラム】そろそろきっちりJavaScript 第1回 "Firebug"の導入〜関数リテラルとは? (MYCOMジャーナル)
多彩な演出効果をカンタンに導入できる事で脚光を浴びたprototype.jsの登場を皮切りに、インターネットで公開されているJavaScriptライブラリの数は、この一年で急激に増加した。何かやりたいことがあったときはWebで検索すれば、大抵、どこかにライブラリが転がっている。便利な世の中になったものだ。 一方、Webを通じて提供されるサービスは多様化の一途を辿っている。JavaScriptライブラリは整ってきたが、当然、置くだけでは機能しない。ライブラリのサポートページには簡単なサンプルが載っているものの、サンプルがそのまま適用できるケースはごくわずかだ。しかたなく、他の誰かが似たような事をやっていないかとWeb検索するはめになる。 思えば、これまでJavaScriptを言語としてとらえ、きっちり向き合う機会は少なかったのではないだろうか。 1995年の終わり、Netscape Navi
javascript - meta bookmarkletのひな形 : 404 Blog Not Found
2007年02月25日06:15 カテゴリLightweight Languages javascript - meta bookmarkletのひな形 私はメタ男くんなので、さらにメタ、すなわちこういうmeta bookmarkletを簡単に作る方法を考えてみた。 Life is beautiful: 複数のbookmarkletの機能を一つにまとめた「シオレット」 そこで、いくつかのBookmarkletの機能を一つにまとめた、メタBookmarkletを自分のために作ったのだが、せっかくなので、ここで公開。まずは、メタブックマークレットそのもの。ここでは選択されたテキストに対して何かをするbookmarkletを用意。 MetaBookMarklet - Selected Text とりあえずSafariとFirefoxとOperaで動作確認。IEの動作確認きぼんぬ。 [追記:IE6
Life is beautiful: 複数のbookmarkletの機能を一つにまとめた「シオレット」
Bookmarkletの存在を知ってから、いくつか気に入ったものをインストールしたり、自分で作ってみたりして遊んで来たのだが、普通のウェブページへのリンクも含めて数が増えてくるとツールバーが一杯になってしまい、使い勝手がぐっと悪くなる。 そこで、いくつかのBookmarkletの機能を一つにまとめた、メタBookmarkletを自分のために作ったのだが、せっかくなので、ここで公開。名づけて「シオレット」だ（bookmark=しおり）。 【シオレットのインストールの仕方】 [シオレット] ← このリンクを右ボタンでクリックして「お気に入り/bookmark」として追加する。左ボタンでクリックしてしまうと、シオレットがこのページ上で動いてしまうので注意（その場合は、グレーの部分をクリックすればメニューを閉じることができる）。 追加する場所としては、Firefoxの場合は Bookmark To
ブラウザ上で画像やテキストを自由に編集する方法 | P O P * P O P
ご存知の方も多いかと思いますが、ご存知ない方のためにちょっとしたTipsをご紹介。Internet Explorer5.5以上限定ですが。 Webサイトをブラウザ上で自由に編集できてしまうテクニックです。やり方は簡単。下記のJavaScriptをアドレスバーに打ち込むだけ。 javascript:document.body.contentEditable='true'; document.designMode='on'; void 0 こんな（↓）感じです。 ドラッグ＆ドロップで画像を動かせる他、テキストも自由に書きかえることができます。これはコンテンツをブラウザ上で編集できる「contentEditable」というタグを活用したTipsですね。 » contentEditableについて スクリーンショットを取る時にいらない画像を簡単に消したりできるのは便利かも。diggからの情報でした
忘れてはいけない超絶JavaScriptライブラリ「BlueShoes:JavaScript Collection」:phpspot開発日誌
BlueShoes: JavaScript Collection Get all the above components in one package. There is an example that uses most of the components.忘れてはいけない超絶JavaScriptライブラリ「BlueShoes:JavaScript Collection」。 既に紹介したと思っていたJavaScriptライブラリであるBlueShoesの紹介。 ご存知の方も多いと思いますが、知らない人も多いようですね。 ライブラリ、というより、リッチなコンポーネント集といったイメージで、次のような様々なコントロールが使えます。 WYSIWYGエディタ Excel風スプレッドシート ツリービュー スライダーコントロール 他にも下記の様々なリッチコンポーネントが使えます。 入力系コンポーネ
最速インターフェース研究会 :: prototype.jsのObject汚染を回避する方法
かなりターゲットの狭いTips。役に立たない。 prototype.jsというRuby on Railsなんかのフレームワークで使われている有名なJavaScriptのライブラリがあって、これが色々と使えそうな処理を綺麗に詰め込んであり、デファクトスタンダート的な地位を確立しているのだけれど、ちょっと微妙だなーと思うところがあって、それはObject.prototypeを拡張してしまう点。 実際の弊害はこういう。 http://d.hatena.ne.jp/nazoking/20050425/1114374966 要は連想配列として使うときに困るって話。 多分prototype.jsはJavaScriptの側でロジックを組むことをあまり想定していないため、この辺の問題にあんまり配慮していないのではないかと思うのだけれど、とりあえず無理やり回避する方法を思いついたので書いてみる。 http:
ブラウザ上で動作するOSのまとめ:phpspot開発日誌
Big WebOS roundup - 10 online operating systems reviewed at franticindustries - web 2.0, social networking, IT technology trends. ブラウザ上で動作するOSのまとめ。 Ajaxが登場して以来、いろいろと出てきたWebOSを見てみましょう。 Craythur Desktoptwo EyeOS Glide Goowy Orca Purefect SSOE XinDESK YouOS なかなか面白いサービスが多く、JavaScriptで実装しているUIについても見るだけで参考になる部分がありそうです。
PerlにおけるCPANのJavaScript版「JSAN」:phpspot開発日誌
JSAN - Home JavaScript Archive Network is a comprehensive resource for Open Source JavaScript libraries and software. PerlにおけるCPANのJavaScript版「JSAN」。 PHPでいうとPEARみたいなものらしいです。 JSANにアップする手順は「ウノウラボ Unoh Labs: JavascriptライブラリをJSANへアップする手順」で知ることができます。 こういった標準的なところでライブラリが充実してくれば嬉しいですね。
JavaScript編集に役立つEclipseプラグイン「JSEclipse」:phpspot開発日誌
Adobe Labs - JSEclipse JSEclipse is a new plugin for the Eclipse environment that helps developers code JavaScript faster and with no errors. JavaScript編集に役立つEclipseプラグイン「JSEclipse」 コード補完機能やアウトライン機能など、Eclipse同様、便利な編集機能を提供してくれます。 Dojo, prototype.js, script.aculo.us, yahoo ui library, Qooxdoo などの補完にも対応しているようです。 なかなか便利そうですね。 関連サイト PHPエディタ - フリーのwindows用php統合開発環境 - phpspot
便利すぎて困る程のFireBug1.0系を使ってみよう:phpspot開発日誌
Firebug - Web Development Evolved 便利すぎて困る程のFireBug1.0系を使ってみよう、ということで、広く使われているであろう0.4系と変わった点をプレビュー。 Googleなどの検索エンジンで、addons.mozilla.org にUPされている0.4系が上に表示されているため、まだ1.0系を使っていない人も多いのではないでしょうか？(という私もそうでした) FireBug1.0系のインストール方法の紹介〜その追加された強力すぎる機能について見ていきましょう。 FireBug1.0系インストール http://www.getfirebug.com/ にてFireBug1.0系のインストール。 FireFox - DOMインスペクタのインストール FireFoxインストール時にDOMインスペクタが入っていない場合は、FireBug1.0系の機能を最大限
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
