Canvas と Core Graphics

Nov 21, 2010

Canvas と Core Graphics は似てるよ、という話

Canvas も Core Graphics も Apple が作った仕様だからか、とても似ています。なので、片方を抑えていれば(もしかしたら)コンバート可能です。

Canvas Core Graphics
var canvas = document.getElementById('canvas');
// コンテクストの取り出し
var ctx = canvas.getContext('2d'); CGContextRef ctx = UIGraphicsGetCurrentContext();
// 線をのスタイルを決める
ctx.lineWidth(1); CGContextSetLineWidth(ctx, 1);
ctx.strokeStyle = "rgba(0, 0, 0, 1)"; CGContextSetRGBStrokeColor(ctx, 0, 0, 0, 1);
// 線を描く
ctx.beginPath();
ctx.moveTo(0, 0); CGContextMoveToPoint(ctx, 0, 0);
ctx.lineTo(100, 100); CGContextAddLineToPoint(ctx, 100, 100);
ctx.stroke(); CGContextStrokePath(ctx);

いずれもコンテクストを取り出し、そのコンテクストに対して色々命令する感じになります。
メソッド名も非常に似たものになっています。
またいずれもfill(線)およびstroke(塗り)を描く、という事が基本的な操作になります。
全体的に Core Graphics だと冗長になります(というか、Cocoa は基本的にいつも長いです。JS になれていると、文字列や配列の操作は悪魔的です...)。


Comments