1
我正在繪製raphael路徑並使用「eye.node.id」爲其分配ID。我試圖讓id有問題地改變顏色使用:以編程方式訪問Raphael路徑
`var selectedBodyPart = p.getById(1001);
selectedBodyPart.attr('fill', 'blue');`
但它不起作用。我的小提琴是: http://jsfiddle.net/RaoBurugula/okgdtzzh/3/ 注:我已經添加了jQuery的參考,但仍康壽給我一個錯誤 「未捕獲的ReferenceError:$沒有定義」
HTML
<div id="bodyMapContainer">
</div>
JS
//RAPAEL PAGE
width = 700;
height = 900;
var bodyMapContainer = document.getElementById("bodyMapContainer");
var p = Raphael(20,0,width,height);
//var p = Raphael(bodyMapContainer,"100%","100%");
p.rect(0,0,width,height);
p.setViewBox(0,0,width,height,true);
drawEyes(150,45, 11, "Left Eye");
drawEyes(129,46, 11, "Right Eye");
//ID for the eyes
var eyeId = 1000;
selectEye();
function drawEyes(xCoordinate,yCoordinate, radius, bodyPartName){
var eye = p.circle(xCoordinate,yCoordinate, radius);
eyeId ++;
eye.node.id= eyeId;
eye.title=bodyPartName;
eye.attr ("stroke", "#F3F3FE");
eye.hover(hoverIn, hoverOut);
eye.click(bodyPartClicked);
eye.attr('fill', 'red');
}
// Hover in function
function hoverIn() {
this.attr('fill', 'green');
console.log($(this).attr('id'));
}
// Hover out function
function hoverOut() {
this.attr('fill', 'red');
}
function bodyPartClicked(){
var selectedBodyPart = $(this).attr('title');
console.log($(this).attr('title'));
console.log($(this).attr('id'));
}
function selectEye(){
var selectedBodyPart = p.getById(1001);
selectedBodyPart.attr('fill', 'blue');
}
感謝你,非常有幫助。 – BRDroid