width, height がマイナスな図形は描画されない

Point(100, 100) を始点として、Point(0, 0) を終点とした rect を描画したい場合、Size(-100, -100) とできれば楽なのですが・・・

<div id="canvas"></div>

var drawer = goog.graphics.createGraphics(300, 300);
drawer.render(goog.dom.$('canvas'));  // #canvas にレンダリング
// マイナスサイズの rect を描画する
drawer.drawRect(100, 100, -100, -100, null, new goog.graphics.SolidFill('#000000'));

この結果は、div#canvas が (300, 300) サイズになるだけで、目的の rect は描画されません。 サイズがマイナスな図形は描画できないようです。

妥協策として、以下のように始点を調整します。

var drawer = goog.graphics.createGraphics(300, 300);
drawer.render(goog.dom.$('canvas'));  // #canvas にレンダリング
var x = 100;
var y = 100;
var w = -100;
var h = -100;
if (w < 0) {  // width がマイナスなら x をずらす
    w = -w;
    x = x - w;
}
if (h < 0) {  // height がマイナスなら y をずらす
    h = -h;
    y = y - h;
}
drawer.drawRect(x, y, w, h, null, new goog.graphics.SolidFill('#000000'));

これで目的の描画が可能になります。

Google API Expertが解説する Closure Libraryプログラミングガイド