重新定位元素改變X和Y當文本框

Question

我最近問this問題詢問是否有當用戶改變文本框的X和Y座標在畫布上移動層的方法。我找到了一種方法來做到這一點，但它確實存在一些錯誤。

爲了讓事情更容易理解我已經添加了我的畫布的2個工作codepens在問題的底部！

我已經試過的東西：

document.getElementById('x').onchange=function(){selectedLayer.offsetX = 100; 
drawMarker(selectedLayer); 
}; 

document.getElementById('y').onchange=function(){selectedLayer.offsetY = 100; 
drawMarker(selectedLayer); 
}; 

當用戶改變文本框的值現在的層會自動轉到100.100座標爲像它應該。同時使用這個層後，將重新定位自己後保持正常。 （仍然能夠移動）

我想其他的事情：

document.getElementById('x').onchange=function(){selectedLayer.offsetX = document.getElementById('x').value; 
drawMarker(selectedLayer); 
}; 

document.getElementById('y').onchange=function(){selectedLayer.offsetY = document.getElementById('y').value; 
drawMarker(selectedLayer); 
}; 

利用這一點，將得到的文本框的值，但也有使用一些這方面的問題：
- 當在輸入值在文本框中，圖層將轉到比給定值大100倍的coördinate。 （當輸入X = 1它會去到x = 100）
- 該層被重新定位後，我不能夠選擇/再移動圖層。

爲了把事情說清楚這裏有兩個例子在工作codepens：

The first thing I've tried (offsetX = 100;)

The second thing I've tried (offsetX = document.getElementById('x').value)

要嘗試一下在codepens做出textlayer並移動了一點在畫布上。當你看到X和Y的文本框填充在底部嘗試改變的值，你會看到這一點。 （低於5第二codepen使用價值）

如果有人知道如何解決這個問題，因此將得到正確的值，所以它會選擇留後，將是巨大的！

Answer 1

修正這個帶着幾分怪異的解決辦法，但是這是我使用的是什麼現在：

document.getElementById('x').onchange=function(){ 
    selectedLayer.offsetX = document.getElementById('x').value - canvasOffsetX + 360; 
    drawMarker(selectedLayer); 
}; 

document.getElementById('y').onchange=function(){ 
    selectedLayer.offsetY = document.getElementById('y').value - canvasOffsetY + 101.91; 
    drawMarker(selectedLayer); 
};