HTML 5カンバスの回避は重複

Question

に行動を埋め、私は私のアイソメトリック四角の間に目に見えるラインを持っている上に、あなたが写真で見ることができるように、これはsligthly互いに重なり合う各正方形によって引き起こされます。今では、私が描くのに使う座標系のために重なり合うことは避けられません（そして私はそれを変更したくありません）。

この私が達成したいどのような正方形

cRenderContext.beginPath(); 

cRenderContext.moveTo(iPosX, iPosY); 
cRenderContext.lineTo(iPosX + iTileWidthIncrement, iPosY - iTileHeightIncrement); 
cRenderContext.lineTo(iPosX + iTileWidth, iPosY); 
cRenderContext.lineTo(iPosX + iTileWidthIncrement, iPosY + iTileHeightIncrement); 
cRenderContext.lineTo(iPosX, iPosY); 

cRenderContext.fillStyle = "rgba(1, 0, 1, 1)"; 
cRenderContext.fill(); 
cRenderContext.closePath(); 

を描画するために使用してコードイムはとても基本的に、現在何もやって埋める停止する方法があり、いずれの外形線外で正方形を描くことです重複していますか？

編集：各四角形はわずかに異なる色で描かれているので、全領域を1つの色で塗りつぶすだけで完了することはできません（すべて黒色に見えますが、または青チャンネル）

Answer 1

は、この比較：これで

http://jsfiddle.net/HmVtz/

：

http://jsfiddle.net/HmVtz/1/

違いを見ますか？

コードの違いは、私が代わりにピクセルの半分のピクセルに描いてるということです。キャンバスはそんなに奇妙です。アンチエイリアス/サブピクセルレンダリングについていつか読んでください。

なぜこれが問題なのか簡単な説明は、Ask Professor Markup hereを参照してください。