タグ

ブックマーク / arikui.hatenadiary.jp (6)

  • vb.jsの日記 : For Next - f8g

    人気のプログラミング言語、VisualBasicっぽく書けるJavaScriptライブラリを開発する日記です。 最初はFor Nextステートメントを実装したいと思います。 function For(start){ For.isExit = false; return { To: function(end){ var step = 1; var loop = function(f){ return { Next: function(){ for(var i = start; i <= end; i += step){ if(For.isExit) break; f(i); } } }; }; loop.Step = function(n){ step = n; return loop; }; return loop; } }; }; function ExitFor(){ For.isEx

    vb.jsの日記 : For Next - f8g
  • 画像を分割してランダムに配置するモザイク - f8g

    カラー画像だと少々面倒臭そうなので、グレースケールに変換してからやります。手順はこんな感じです。 グレースケール化 10 * 10 に分割 分割画像のRGBを平均して分類 分類ごとにランダムソート 再配置 コード 使用 ImageProcessing.prototype.f= function(fnc){ return fnc(this); }; var clips = {}; ip = ImageProcessing .load("image.png") .lock() // グレースケール .each(function(px, x, y, self){ self.setPixel(x, y, px.grayScale()); }) .update() // 分割して色ごとにまとめる // 分割した画像の平均でまとめるてるので結構適当 .f(function(self){ var cli

    画像を分割してランダムに配置するモザイク - f8g
  • Tombloo Mozaic でソート by 色 - f8g

    Greasemonkeyでやろうとしたけど動かなかったんで、そのままHTMLにコード書き込みました。HTMLは通常、 Firefoxのプロファイルディレクトリ\extensions\tombloo@brasil.to\chrome\content\library\Mosaic.html にあります(多分)。Mosaic.htmlの一番下の方にでもコードを書いてやります。 <script src="http://github.com/arikui/image_processing.js/tree/master%2Fimage_processing.js?raw=true"></script> <script type="text/javascript"> (function(){ // sort button var button = $("control").appendChild(doc

    Tombloo Mozaic でソート by 色 - f8g
  • 等高線を描く - f8g

    基盤地図情報を使うと画像が公開できないので、普通の画像のRGBを標高値として等高線を描きます。 アルゴリズムが合ってんだか間違ってんだか分からん。(間違ってたのでコード修正しました) 簡単なアルゴリズムでは、画像を三角形に分割してその中で線を引いていきます。 使用 // 点 function Point3D(x, y, z){ if(!x) x = 0; if(!y) y = 0; if(!z) z = 0; this.x = x; this.y = y; this.z = z; } /** * 分割して線を引かせる部分 * @boxInterval 三角形の大きさ * @conInterval 等高線を引く間隔 */ ImageProcessing.prototype.drawContour = function(boxInterval, conInterval){ var ps = [

    等高線を描く - f8g
  • 基盤地図情報をcanvasで - f8g

    最近でもないけど、基盤地図情報が無料でダウンロードできるようになった。 http://fgd.gsi.go.jp/download/ blogで画像を公開するのには申請が必要みたいなので今回は画像なし。 データ GML版の方が軽くてシンプルなのでそっちを使ってやります。(だた、そこで公開されている閲覧ソフトでは処理できないみたいですが) 一番下のほうにある数値標高モデルをダウンロードすると、ZIPファイルにいくつかXMLが入ってますが、今回は適当にやるので、適当にひとつ選びます。 データは大体こんな感じで書かれてます。(というか仕様知らんので詳しくはそっちを) 多分右下の座標 多分左上の座標 , メッシュのセルの数。番号がlowからhighまで、xとyについて書かれてる。 標高値のデータ。タイプ,値[改行] タイプは、その他: 陸地、データなし: たぶん海(値は-9999.) 処理 それっ

    基盤地図情報をcanvasで - f8g
  • OperaのCanvasが凄いのでモザイク - f8g

    いまさらながらOperaにはgetPixel/setPixelがあることを知りました。 http://orera.g.hatena.ne.jp/higeorange/20080604/1212505679 Operaさんはすげえぜ! ただ、色の指定が文字列ってところが使いづらい。 ということでモザイク。 CanvasRenderingContext2DGame.Color = function(r, g, b){ this.r = r; this.g = g; this.b = b; this.toString = function(){ return "rgb(" + [this.r, this.g, this.b] + ")"; }; }; CanvasRenderingContext2DGame.prototype._getPixel = function(x, y){ var co

    OperaのCanvasが凄いのでモザイク - f8g
  • 1