שלח תשובה

זירת השאלות

1022
צפיות
1
תשובות

svg circles.push

,‏ 13 במרץ, 2012

היי,

מתחת דוגמא של קוד שמצייר עיגולים ושולח אותם במרחב:
http://jsfiddle.net/centerwow/nnjsw/4/
1- לא הבנתי מה השימוש של השורה הבאה בתוך הקוד:


circles.push(newCircle);



2 – הכנסתי את קטע הקוד לתוך קובץ html ולא הצלחתי להריץ אותו למה?

תודה!




<html>
<head>
<title>Your title here</title>

<script type = "text/javascript" language = "Javascript">
<!– Hide from older browsers;
var svgns = ‘http://www.w3.org/2000/svgvar svgElement = document.createElementNS(svgns, ‘svg’);
document.body.appendChild(svgElement);

var Circle = function(x,y,size){
this.element = document.createElementNS(svgns, ‘circle’);
this.x = x;
this.y = y;
this.size = size;

this.dx = 10*(Math.random()-0.5);
this.dy = 10*(Math.random()-0.5);

this.element.setAttribute(‘cx’, this.x+’px’);
this.element.setAttribute(‘cy’, this.y+’px’);
this.element.setAttribute(‘r’, this.size+’px’);
this.element.setAttribute(‘stroke’, ‘black’);
this.element.setAttribute(‘stroke-width’, ‘2px’);
this.element.setAttribute(‘fill’, ‘red’);

svgElement.appendChild(this.element);
Circle.prototype.update = function(){
this.x += this.dx;
this.y += this.dy;
this.element.setAttribute(‘cx’, this.x+’px’);
this.element.setAttribute(‘cy’, this.y+’px’);

var circles = [];
for (var i = 0; i< 10; i++) {
var newCircle = new Circle(100,100,10);
circles.push(newCircle);
}

window.setInterval(function(){
for (var i = 0; i< circles.length; i++) {
circles[i].update();
}
}, 30);




// end hide –>
</script>
</head>
<body>
<!– Insert HTML here –>

</body>
</html>


תגיות:

1 תשובות

  1. push זו פונקציה מובנת של JS להוספת ערך לסוף המערך

    אני לא בטוח למה זה לא רץ לך, יכול להיות שחסר דוקטייפ ויכול להיות שיש שגיאת JS או משהו כזה (נראה שאתה פונה ל-document.body לפני שיצרת אותו), פשוט מעולם לא עבדתי ישירות עם SVG.

    אני ממליץ לך להציץ על הספרייה הבאה: http://raphaeljs.com

שלח תשובה