2012-08-23 53 views
1

我試圖在點擊多維數據集的特定面時收到「3d」多維數據集以聆聽我的點擊,但我不斷收到錯誤消息。Raphael JS +點擊處理程序

代碼:http://jsfiddle.net/qa3P7/1/

在WINLOAD功能,我已經添加以下代碼:

cube.object[0].click(function(){ 
    alert('test'); 
}); 

但它返回:Object #<Object> has no method 'click'

當我這樣做:cube.object[0],我得到了正確的「立方體面部」:

cube.object[0] 
Object 
bl: Array[3] 
br: Array[3] 
c: "url("img/cube/bianco.jpg")" 
clip: 123.18126918267271 
id: "face_2" 
normal: Array[2] 
object: z 
shadow: null 
tl: Array[3] 
tr: Array[3] 
__proto__: Object 

我對這一切都很新穎,經過數小時的努力和研究,我被卡住了。

+0

它是由該庫創建的名爲'cube'的對象。但是'cube.object [0] .object'代表一個Raphael元素,但我無法使它工作。 'console.log(cube.object [0] .object)'總是返回'null',我不知道爲什麼。當我只登錄'cube'並點擊開發者控制檯中的對象時,我會看到所有的方法和屬性。非常奇怪...... –

+0

@DanLee這正是我嘗試它時發生的情況。通過點擊chrome控制檯選擇'cube.object [0] .object',我可以看到所有的方法和東西,但是在編寫'console.log(cube.object [0] .object)'時,它總是返回' null'。我不知道爲什麼:( – Andrej

+0

你有沒有考慮過使用Three.js? – Neil

回答

0

這是有問題的,因爲該立方體的每一個可見表面是在每個框架上重新重繪(見drawFrame)和.click()是聖拉斐爾路徑的方法,在這種情況下被稱爲face.object。每次重新繪製臉部時,您都可以嘗試重新指定點擊處理程序,但是我認爲更好的方法是抓住畫布上的點擊並手動識別光標下的臉部。

+0

我用'getImageData'做了或多或少的相同的事情來識別當前光標下的像素顏色,並且將顏色鏈接到特定的一側,但是當使用圖像時,並非每一面的顏色都一樣,事情就會變得複雜化。 – Andrej

+0

我不認爲它在數學上太難,因爲您知道立方體在任何時間點的確切轉換,甚至是它的座標可見面(因爲它們是在'drawQuad'中計算的)。 – Qnan