KineticJSを検証するジグソーパースを検証しますか？

Question

スクランブルされた後、私のジグソーパースを元の場所に戻すのをどのように検証することができるのでしょうか。そして私がパズルを完成させたことを示しますか？私はKineticJSライブラリを使用しています。ありがとうございました：）

function jigsaw(){
    var imageObj = new Image();
    imageObj.src = "kidwallpaper.jpg";
    imageObj.onload = function(){
        drawImage(this);
    }
 }

.

PS：私のjsfiddle： http://jsfiddle.net/vfez6/21/

Answer 1

各ピースが別のピースに接続する円を定義することです。

例えば、あなたのパズルがわずか2個を持っていると仮定します - トップピースとボトムピース。

この図は、トップピースの赤い円とボトムピースの金色の円を示しています。

接続円を正確に重ね合わせたら、部分が正確に接続されています。

もちろん、あなたはおそらくあなたのプレーヤーに誤りの余白を与えたいので、正確にが円を重ねる必要はありません。 2つの円がまったく重なっているならば、それは解決した「十分に良い」です。

2列のx、y、半径を定義した場合、あなたはこのようにそれらがまったく重なっているかどうかを知ることができます：

var dx = circle2.x - circle1.x;
var dy = circle2.y - circle1.y;
var isSolved = Math.sqrt(dx*dx+dy*dy) <= circle.radius*2;

.

あなたはあなたの作品を回転させているのを見ます。つまり、2個の回転角度が接続されるのが同じであることもテストする必要があります。

自然にあなたは実際に円を描くことはないでしょう - 彼らはイラストのためだけにここにいます。