| |
chore_ashwin 04-14-2004, 08:50 AM I want to print 3 circles step by step, ie display ist then pose then display next
I am using setTimeout() function as follows but it is not working, whole dig seems to be drawn at the same time
please help me out how to use setTimeout(), or anyother way to do the same
<svg onload="init(evt)" >
<script language="javascript">
<![CDATA[
var svgDocument=null;
var svgns ="http://www.w3.org/2000/svg";
var node;
function init(event){
svgDocument= event.target.ownerDocument;
for(var i=0;i<3;i++){
node = svgDocument.createElementNS(svgns, "circle");
node.setAttributeNS(null, "id",i);
node.setAttributeNS(null, "cx",i*50);
node.setAttributeNS(null, "cy",50);
node.setAttributeNS(null, "r", 15);
node.setAttributeNS(null,"fill", "yellow");
svgDocument.documentElement.appendChild(node);
setTimeout("timeout()",1000);
}
}
function timeout(){
}
window.timeout=timeout;
]]>
Anonymous 04-14-2004, 09:46 AM hi chore_ashwin
try like this :
<svg onload="init(evt)" >
<script language="javascript">
<![CDATA[
var svgDocument=null;
var svgns ="http://www.w3.org/2000/svg";
var node;
var svgDocument;
var Timer=0
function init(event){
svgDocument= event.target.ownerDocument;
Timer=setTimeout("createCircle(1)",1000);
}
function createCircle(c){
var i=c
node = svgDocument.createElementNS(svgns, "circle");
node.setAttributeNS(null, "id",i);
node.setAttributeNS(null, "cx",i*50);
node.setAttributeNS(null, "cy",50);
node.setAttributeNS(null, "r", 15);
node.setAttributeNS(null,"fill", "yellow");
svgDocument.documentElement.appendChild(node);
if(i<3){
i++
Timer=setTimeout("createCircle("+i+")",1000);
}
}
]]>
hope it helps
Holger
http://www.treebuilder.de[/quote]
chore_ashwin 04-16-2004, 07:22 AM Thanks for ur support
It is working fine
But i have another problem. It seems that after calling afunction with setTimeout() Execution proceeds imidiately to the next statement......
If i want to acess the elements that are created in a function called with setTimeout(), I cant acess them as the element is not created yet so It flags the Err as "null is null or not an object"
How do i control that this statement is executed after the element is created
ex
<svg onload="init(evt)" >
<script language="javascript">
<![CDATA[
var svgDocument=null;
var svgns ="http://www.w3.org/2000/svg";
var node;
var svgDocument;
var Timer=0
function init(event){
svgDocument= event.target.ownerDocument;
Timer=setTimeout("createCircle(1)",1000);
// i think err is flaged due to this statement as element is yet not created
//Am i correct
var tgtElement=svgDocument.getElementById(0);
tgtElement.setAttribute("fill","blue");
}
function createCircle(c){
var i=c
node = svgDocument.createElementNS(svgns, "circle");
node.setAttributeNS(null, "id",i);
node.setAttributeNS(null, "cx",i*50);
node.setAttributeNS(null, "cy",50);
node.setAttributeNS(null, "r", 15);
node.setAttributeNS(null,"fill", "yellow");
svgDocument.documentElement.appendChild(node);
if(i<3){
i++
Timer=setTimeout("createCircle("+i+")",1000);
}
}
]]>
</script>
</svg>
please tell me how do i solve it
Anonymous 04-16-2004, 10:18 AM Hi chore
i see no need in doing so.
you can easily acess the created element from the function whitch creates the elements.
like this:
<svg onload="init(evt)" >
<script language="javascript">
<![CDATA[
var svgDocument=null;
var svgns ="http://www.w3.org/2000/svg";
var node;
var svgDocument;
var Timer=0
function init(event){
svgDocument= event.target.ownerDocument;
Timer=setTimeout("createCircle(1)",1000);
}
function createCircle(c){
var i=c
node = svgDocument.createElementNS(svgns, "circle");
node.setAttributeNS(null, "id",i);
node.setAttributeNS(null, "cx",i*50);
node.setAttributeNS(null, "cy",50);
node.setAttributeNS(null, "r", 15);
node.setAttributeNS(null,"fill", "yellow");
svgDocument.documentElement.appendChild(node);
//place any function that needs acess to circle i here e.g.
node.setAttributeNS(null,"fill", "blue");
if(i<3){
i++
Timer=setTimeout("createCircle("+i+")",1000);
}
}
]]>
</script>
</svg>
hth
Holger
chore_ashwin 04-17-2004, 07:18 AM thanks
Anonymous 06-04-2004, 03:21 AM Hi chore
i see no need in doing so.
you can easily acess the created element from the function whitch creates the elements.
like this:
<svg onload="init(evt)" >
<script language="javascript">
<![CDATA[
var svgDocument=null;
var svgns ="http://www.w3.org/2000/svg";
var node;
var svgDocument;
var Timer=0
function init(event){
svgDocument= event.target.ownerDocument;
Timer=setTimeout("createCircle(1)",1000);
}
function createCircle(c){
var i=c
node = svgDocument.createElementNS(svgns, "circle");
node.setAttributeNS(null, "id",i);
node.setAttributeNS(null, "cx",i*50);
node.setAttributeNS(null, "cy",50);
node.setAttributeNS(null, "r", 15);
node.setAttributeNS(null,"fill", "yellow");
svgDocument.documentElement.appendChild(node);
//place any function that needs acess to circle i here e.g.
node.setAttributeNS(null,"fill", "blue");
if(i<3){
i++
Timer=setTimeout("createCircle("+i+")",1000);
}
}
]]>
</script>
</svg>
hth
Holger
Anonymous 06-07-2004, 07:43 AM Hi chore
i see no need in doing so.
you can easily acess the created element from the function whitch creates the elements.
like this:
<svg onload="init(evt)" >
<script language="javascript">
<![CDATA[
var svgDocument=null;
var svgns ="http://www.w3.org/2000/svg";
var node;
var svgDocument;
var Timer=0
function init(event){
svgDocument= event.target.ownerDocument;
Timer=setTimeout("createCircle(1)",1000);
}
function createCircle(c){
var i=c
node = svgDocument.createElementNS(svgns, "circle");
node.setAttributeNS(null, "id",i);
node.setAttributeNS(null, "cx",i*50);
node.setAttributeNS(null, "cy",50);
node.setAttributeNS(null, "r", 15);
node.setAttributeNS(null,"fill", "yellow");
svgDocument.documentElement.appendChild(node);
//place any function that needs acess to circle i here e.g.
node.setAttributeNS(null,"fill", "blue");
if(i<3){
i++
Timer=setTimeout("createCircle("+i+")",1000);
}
}
]]>
</script>
</svg>
hth
Holger
| |