読者です 読者をやめる 読者になる 読者になる

とりあえずtwoをbowerに登録しておいた

それなんてRaphael感も若干あるtwo.jsです。 ちょっと(どころではなく)弄りたかったのですが、bowerに見つからなかったので、登録しておきました。 bower install two とするだけで落ちてくるので試してみます

bowerについて

bowerが0.9.2になり、gitリポジトリが変更になりました。 twitter/bower=>bower/bower 基本 bowerとは、WebのJavaScript package managerです。 npmやgem、cartonのように、jqueryやd3、angularなど、プロダクトのwebで必要なpackageを管理するツールです。 …

doccoとgrunt-doccoのごにょごにょについて

doccoという結構使いやすい*1ドキュメント生成ツールがあります。 これのgruntのpluginがあるのですが、これにまつわるもやもやについて docco doccoはコードの中にmarkdownを書いてインラインコメントアウトするとよしなにdocumentを生成してくれます。 0.6…

d3.js advent calendar 22日目

d3 advent calendar 22日目d3でデータをネスト化したりして、いろいろなグラフを描いてみよう!(まとめ) まとめ的な統括的なものです sample garalley見たら載ってることも多いですが、総括して見られることがメリットだと思ってください 注意:面倒なのでco…

d3.js advent calendar 21日目

d3 advent calendar 21日目d3で適当なデータを作ったり、いろいろフォーマットする d3の便利な関数の具体的な使い方 サンプルデータを生成する サンプルデータって必要ですよね。そんな時の方法です var size = 24 * 7 * 14, mean = 100, stdev = 20; var no…

d3.js advent calendar 20日目

d3 advent calendar 20日目d3.layout.tree d3.layout.tree d3.layout.treeは「樹形図」を描くことができる.layoutです 書きたいですよね?樹形図! 概要 このlayoutは、前回紹介したhierarchyの具体的な表現例の1つになります。 従って、ネスト化されたデー…

d3.js advent calendar 19日目

d3 advent calendar 19日目d3.layout.hierarchy d3.layout.hierarchy このlayoutは直接利用するものではなく、d3.layout.treeなど階層構造を表現するためのベースlayoutです。 今日はこのlayoutのAPIにふれて、次回で具体的なlayoutであるtreeの使い方を説明…

paramtuner v0.0.0リリース

こちらで反省したとおり、使いやすいようにgruntから切り離しました(最初からそうしろ・・・ in codeでチューニング(というか、今は乱数で総当り。最適化のロジックは鋭意作成中)してその結果を利用して、なにか、とかができます。 github npm npm install p…

grunt-contrib-tuning v0.0.0 リリース

grunt-contrib-tuningをリリースしました。 いろいろなパフォーマンスのチューニングをgruntから利用することができます。 grunt.loadNpmTasks 'grunt-contrib-tuning' と登録して grunt.initConfig tuning: test: params: alpha: range: [1, 100] beta: ran…

d3のd3.interpolateObjectで返される補間オブジェクトが共有化されてる

issue:1030 d3.interpolateObjectは2つのオブジェクトを補間してくれるので欠損データの扱いとかが楽にできるんですが、バグ?というか、ハマるところ。 var ts = [ {time: new Date(2012, 0, 1), sum: 132435}, {time: new Date(2012, 0, 2), sum: 133450},…

Parallel.js雑感

Parallel.jsという、JS (browserでもnodeでも!)でマルチコア並列処理をするためのライブラリが公開されたのでさくっと紹介(2月10日に最初のcommitみたいです) READMEを読むと「せっかく web worker こなれてきたからもっと十分に使えるようにしようぜ!」っ…

d3.js advent calendar 18日目

d3 advent calendar 18日目d3.layout.pie d3.layout.pieとは 最初は簡単かつ使い勝手の良いlayoutであるPieからですこれは、文字通り、ぶっちゃけダルい円弧のPathを生成するための開始角と終端角の2つを計算してくれます 入出力 このlayoutは 入力: key - v…

d3.js advent calendar 17日目

d3 advent calendar 17日目d3.layout Layoutとは 僕が好きな一節はこの資料のLayoutsのところです(スライド中の直リンクが無いです) Layoutはデータである:最利用可能なデータ生成アルゴリズムであり、表示形式ではない Layoutは多様である:各々のLayoutは…

d3.js advent calendar 16日目

d3 advent calendar 16日目d3.behavior.drag dragとは せっかくのHTMLですし、ドリルダウンで詳細にデータを深掘りしたいですよね。そのインタラクションとしてd3で用意されている一つがd3.behavior.dragです 使い方 基本的には、選択された要素に対して.cal…

d3.js advent calendar 15日目

もう、どんどん、遅れてきていて、今日は17日ですが、15日目のd3.js API Advent Calendarの記事です d3 advent calendar 15日目internal api 内部API 15日目は次のような内部的なAPIについて紹介します d3.functor d3.rebind d3.dispatch 使い所 d3.dispatch…

d3.js advent calendar 14日目

d3 advent calendar 14日目d3.interpolate d3.intepolate() .interpolate()は、15日目で紹介する.transition() (jQueryのanimate的なもの)の内部でも使われている、2つの状態間を計算するAPIです 使い所 連続的に間を埋める必要が有る時 連続的な行列が欲し…

d3.js advent calendar 13日目

d3 advent calendar 13日目d3.svg.axis d3.svg.axis みんな大好きxy軸です。これがないとグラフを書いても意味がわからないので、大事です。でも、位置の調整とか割りと大変だし、tickとかどうすんべー、というのをd3では予期に計らってくれています 基本 d3…

d3.js advent calendar 12日目

d3 advent calendar 12日目d3.svg API (2/2) 12日目は、11日目で紹介しきれなかった、.arc(), .chord()を紹介します d3.svg.arc() 文字通り、円弧を描く(=円弧になるようなPATHを作成する)APIです 実装: 準備 var colors = d3.scale.category20(); /* 色 */v…

d3.js advent calendar 11日目

d3 advent calendar 11日目d3.svg API (1/2) 基本的な使い方 そもそもsvgはいくつかの表現要素を定義しています rect: 矩形: x, y, width, height[, rx, ry] circle: 円: cx, cy, r ellipse: 楕円: cx, cy, rx, ry line: 線分: x1, y1, x2, y2 polyline: pol…

d3.js advent calendar 10日目

これは、d3.js API Advent Calendarの10日目の記事です d3.js advent calendar 10日目Loading API d3のLoading API d3には、チャートを作成するためのデータを取得する方法として、Loading APIを提供していますheader付tsvやcsvをObject Arrayに変換してくれ…

d3.js advent calendar 9日目

これは、d3.js API Advent Calendarの9日目の記事です d3.js advent calendar 9日目 d3.time d3.time.format d3.time.scale d3.time.interval 大きく3つのAPIにわかれますが、特筆すべきはintervalです。これだけ覚えていればいいです! d3.time.format Date…

d3.js advent calendar 8日目

d3.js advent calendar 8日目 Colors d3で色の扱う方法は以下の3つです 離散値・名義などまたは様々な色を使う:d3.scale.categoryXX 連続値・グラデーション:d3.scale.linear / d3.interpolate Colors APIを利用する d3.scale.categoryXX d3.scale.ordinal…

d3.js advent calendar 7日目

d3.js advent calendar 7日目 d3.scale.ordinal 離散的な入出力値の変換に役立ちます「それ、連想配列?」って思った人は正解で、内部では連想配列を保持していて、それに登録/参照を行なっています 基本的な使い方 var os = d3.scale.oridnal() .domain(["…

d3.js advent calendar 6日目

これは、d3.js API Advent Calendarの6日目の記事です d3.js advent calendar 6日目 d3.scale d3.scaleは、おそらく大きの人がd3を使う主目的である「グラフ」を描く際に、X-Y軸や、データをグラフの矩形範囲内に収めるために利用するための重要なAPIです ま…

d3.js advent calendar 5日目

これは、d3.js API Advent Calendarの5日目の記事です。短くてマジすいません。でも、紹介しておきたいAPIなので取り上げました d3.js Advent Calendar 5日目random api d3.random d3.random.normal()で、正規分布を得ることができます。 実例 var n = d3.ra…

d3.js advent calendar 4日目

これは、d3.js API Advent Calendarの4日目の記事です。 d3 advent calendar 4日目 d3にあるその他の Array Operatorの紹介 特筆すべきは、d3.rangeとd3.nestです。特にnestは非常に有用なので覚えて損はないです! d3.split 最初のnull / undefinedで分割さ…

d3.js advent calendar 3日目

これは、d3.js API Advent Calendarの3日目の記事です。 d3.js Advent Calendar 3日目Array API (1/2) Array API JavaScript の Arrayのおさらい d3のArray API (この部分2回に分けます) Array API はいくつもあります ですが、mike bostockはこうおっしゃっ…

d3.js advent calendar 2日目

これは、d3.js API Advent Calendarの2日目の記事です。 d3.js Advent Calendar 2日目selector api (2/2) .data(), .datum(), .enter() 2日目は、Event APIと上記3つのd3がdata driven documentと呼ばれる所以たるメソッドを紹介しますselector APIによって…

d3.js advent calendar 1日目

これは、d3.js API Advent Calendarの1日目の記事です d3.js Advent Calendar 1日目selector api (1/2) Selector APIとは DOMの操作(HTMLだけではなくSVGの要素も)はSelector APIを叩いて行う基本のキ できること DOMの取得 DOMの追加/削除 DOMの属性/style…

Chromexpressを作ってみた

ChromeのSocket APIが気になると書いたのですが、その後いろいろ子供の寝かしつけで寝落ちたりしてる間に、 @komasshu さんに先をこされて悔しかったので、作ってみました。 chrome の socket APIを使ってNodeのexpressのようなことができます。 githubに上…

ArrayBufferについて

WebSocketやchrome.socket、AudioやVideo APIなどが進んできたせいで、JavaScriptで生データを触ることが増えてきています。 その時に使えるのがArrayBufferというオブジェクトなんですがいまいち整理がついてないので、MDNを訳しながら、まとめてみました。…

ChromeのSocket APIが気になって仕方がない

html5conference2012で @komasshu さんの発表を聞き、裏で質問をしてから、Google Packaged APIが気になっています。 特に、tcpあたりでListenができる?あたりが気になっていて、これができると、server無しで、browser間メッセージングやコミュニケーショ…

html5カンファレンスに参加してきました

html5カンファレンスに参加してきました。娘の幼稚園の運動会の練習があったことを失念しており、午前中(8時45分)から息子の面倒を見たり、病欠の子の代わりに園児に混じってリレーに参加したりとした後、午後からの参戦でした。 会場につくと LTのなのにス…

2012/06/30 XSSについて追記しましたjQuery 1.8のbeta 1がリリースされました。このバージョンではcustom buildが可能になる「modularity」という機能が追加されました。 この機能により、ajax, css, dimensions, effects, and offsetという機能を除外したjq…

meteorについて

わかってる依存関係 underscore git meteorのbin (/usr/local/bin/meteor) やってることは、引数をつけて、meteor.js (僕のmac OSXでは/usr/local/meteor/app/meteor/meteor.js)を実行する exec "$DEV_BUNDLE/bin/node" "$METEOR" "$@"以降「$METEOR_HOME=/u…

Log4js on express でcssとかjsとか画像とかのログが落ちないようにする

本文 この記事はJavaScript Advent Calendar 2011 (Node.js/WebSocketsコース) : ATNDの5日目の記事です。Expressでサービスをリリースしたりするとログとかちゃんと取る必要があるのですが、既存の404 · GitHubだと、.cssとか.jsとか.gifとか.pngとか.jpe?g…

fancyboxを使っていてiframe呼び出しでかつPOSTでデータを引き渡したい場合

jQueryプラグインのfancyboxはglobalの名前空間汚染とかもなく、swfとかiframeとかajaxとかtemplateとかが使えるので重宝しています。ただ、iframeでは当然GETの呼び出ししか出来ず、データをPOSTで渡して表示させたいときには使うことができません。時間が…

jQuery 1.7がリリースされました

リリースノートはこちら。注目しているAPIは以下です。 Event API(.on/.off ) これまでbind/unbindだったものがon/offを使えます また、セレクターが引数に取られた場合は、.delegate()と同じ挙動を取ります。 $('a').bind('click', myHandler); $('a').on('…

複数Webアプリを1つのホストで立ち上げる方法

expressを使うとわりかし簡単にWebアプリを作れます。 で、いくつもつくって立ち上げ続けたいのですが、ポートをいちいち分けてアクセスするのもイケてないです。 そんな時に使うのがnode-http-proxyを使います。node-http-proxy自体は結構色々出来るんです…

便利機能満載のライブラリUnderscore.js

便利機能満載のライブラリUnderscore.js - にのせき日記が「力尽きた」と仰っているので勝手に続きを書く Object Functions tap _.tap(object, interceptor)chainを使うときに、途中にobjectを割り込ませ、chainの途中結果を知ることが第一義の目的。 _([1,2…

mongooseの埋め込みオブジェクトの変更に伴う保存について

node.js + mongo + express で遊んでいます。 @snamuraさんも言っていたとおり、鼻血が出るほどnode.js + mongodbは相性がよく、また、mongooseがよく出来ています。以下mongoose 1.0.13の利用例 var mongoose = require('mongoose'), Schema = mongoose.Sch…

jQuery 1.5のDeferredを翻訳してみた

Deferred Object バージョン1.5で導入された jQuery.Deferred は、コールバックキューに複数のコールバックメソッドを登録し、コールバックキューから登録されたコールバックメソッドを呼び出し、同期的/非同期的な関数のいずれかの success または failure …

jQuery 1.5 beta1がでたようです

面白そうな変更点(jQuery Blog » jQuery 1.5 Beta 1 Released)をつらつらと Ajax moduleでPromise的な記述が可能に(全体的書きなおされたようです jQuery Blog » jQuery Community Updates For December 2010 $.getJSON(url).complete(successCallback).erro…

に参戦してきた

振り返り中 by kawasakiさん Rich UI with JS @amachang Shibuya.js的にHMLT5は「DOM はあと HTML 」 Agenda Drag and Drop Event Capturing Border Box Drag and Drop Source Target Data Transfer preventDefaultでしねる mime-typeを設定できて、設定して…

perseInt

parseIntはn進数に変換してくれるナイスな関数なのですが基数は36までしか対応してくれません >< 大文字、小文字のアルファベットを識別して、62進数に対応して欲しい。<自分で作れ window.parseInt = (function(){ if(parseInt.toString().indexOf('[nat…

new Dateのすごいところ

new Date(fullyear, month, day)でDateオブジェクトを作り、monthには[(0, "1月"),(1, "2月"),..,(11, "12月")]なんだけど new Date(2009, 12, 1); //Fri Jan 01 2010 00:00:00 GMT+0900 12以上の数字を入れると、年をインクリしてくれる!当然13とか14と化…

延々と円を分割するjs

だいぶ前にあった気がするけど、PHUNがマウスオーバーすると円が分裂していくFLASH | IDEA*IDEAで取り上げられてた。html5の勉強会では自己組織マップで画像を学習する、ってのが作りたかったんだけど、クロスドメインで取得した画像はgetImageDataができな…

html5-hackathonに参戦してきた

WorkerはWorker間通信NG Canvasはクロスドメインがある drawImageは可能で、その上に線を引いたりもできるが、getImageDataはできない CSS Transform 当日 ネタとしては、画像を読み込んでSOMに食わせてやろうかと思っていました。 Canvasで画像処理して、Wo…