在拉斐爾JavaScript庫中查找紙張/畫布的絕對位置

如何在使用拉斐爾JavaScript庫時如何找到紙張/畫布的絕對位置？在拉斐爾JavaScript庫中查找紙張/畫布的絕對位置

例如，假設最小工作示例如下：

<html> 
<head> 
<script type="text/javascript" src="raphael.js"></script> 
<script> 
    window.onload = function() { 
     var size = 600; 
     var paper = new Raphael(document.getElementById("canvas_container"), 
           size, size); 
     var c = paper.circle(100, 100, 50).attr({fill: "#00f"}); 
     var x = 0; // get the paper's absolute x coordinate 
     var y = 0; // get the paper's absolute y coordinate 
     document.getElementById("coordinates").innerHTML = x + " " + y; 
    }; 
</script> 
<style type="text/css"> 
    #canvas_container { 
     width: 600px; 
     margin-left: auto; 
     margin-right: auto; 
     border: 1px solid #aaa; 
    } 
</style> 
</head> 
<body> 
    <p id="coordinates"></p> 
    <div id="canvas_container"></div> 
</body> 
</html>

如何找到絕對X，並從頁面頂部的紙張y座標不知道的div的ID它住在？（在這個例子中，我知道，但我的實際情況使得知道DIV ID要複雜得多。）

來源

2011-01-30 agarrett

確定。我看到它應該是現在：

var x = this.paper.canvas.offsetLeft; 
var y = this.paper.canvas.offsetTop;

這似乎在IE 8.0和Chrome 9.0上都能正常工作。

來源

2011-01-30 04:46:40 agarrett

爲了讓您的拉斐爾紙的ABS的位置，你可以使用jQuery：

$(paper.canvas).offset()

來源

2011-09-15 09:10:54 lajarre

注意：這段代碼給出了不同的瀏覽器不同的結果以及它與紙的狀態結果的變化... – lajarre 2011-10-24 16:08:41

接受的解決方案不適合我的工作，它給了我X = -1，Y = -1 ，所以如果有人有同樣的問題我解決了這種方式：

var x = paper.canvas.parentNode.offsetLeft; 
var y = paper.canvas.parentNode.offsetTop;

來源

2015-06-18 10:01:58

在拉斐爾JavaScript庫中查找紙張/畫布的絕對位置

回答

相關問題