More RENDER Examples - Revision history

Swapna: /* Ball rolling inside a circle - Animation */

2022-03-14T16:20:20Z

Ball rolling inside a circle - Animation

2022-03-14T16:19:41Z

Ball rolling inside a circle - Animation

2022-03-14T15:30:19Z

Circle Slide Animation

2022-02-21T11:53:21Z

Circle Slide Animation

2022-02-21T11:45:26Z

Ball rolling inside a circle - Animation

2022-02-17T16:02:34Z

2022-02-17T10:56:51Z

2022-01-20T11:39:20Z

Ball Animation

2022-01-20T11:38:15Z

2022-01-13T12:13:59Z

PolyPoints with Ellipse

@@ Line 482: / Line 482: @@
+	[
 		["id","type","coordinates","fill", "stroke", "stroke-width", "cx","cy","r","count","transform-origin"],
-		["big","circle",,"white","green",8,300,300,205],
+		["big","circle",,"white","orange",8,300,300,205],
 		["small","circle","M150,300 a 150,150 0 1,0 300,0 a 150,150 0 1,0 -300,0","black","black",,150,300,50,1,[300,300]]
+	]

@@ Line 482: / Line 482: @@
+	[
 		["id","type","coordinates","fill", "stroke", "stroke-width", "cx","cy","r","count","transform-origin"],
-		["big","circle",,"white","orange",8,300,300,205],
+		["big","circle",,"white","green",8,300,300,205],
-		["one","circle","M150,300 a 150,150 0 1,0 300,0 a 150,150 0 1,0 -300,0","black","black",,150,300,50,1,[300,300]]
+		["small","circle","M150,300 a 150,150 0 1,0 300,0 a 150,150 0 1,0 -300,0","black","black",,150,300,50,1,[300,300]]
+	]
 );
@@ Line 491: / Line 491: @@
+	[
 		["id","animate","animationsettings"],
-		["one","animate",[["loop","rotate","duration","easing"],[true,360,3*1000, "linear"]]]
+		["small","animate",[["loop","rotate","duration","easing"],[true,360,3*1000, "linear"]]]
+		]
+	,

@@ Line 455: / Line 455: @@
 slide=RENDER(
+	[
-		["id","type","fill", "stroke", "stroke-width", "stroke-miterlimit","stroke-dasharray","cx","cy","r"],
+		["id","type","fill", "stroke", "stroke-width","stroke-dasharray","cx","cy","r"],
-		["one","circle","none",["blue","green","red"],2,,[15,15],150,250,59]
+		["one","circle","none",["blue","green","red"],2,[15,15],150,250,59]
+	]
 );

@@ Line 472: / Line 472: @@
 </syntaxhighlight>
-[[File:circle_slide.png]]
+[[File:Circle_slide.gif]]
 =Ball rolling inside a circle - Animation=

@@ Line 500: / Line 500: @@
 ""
 </syntaxhighlight>
-[[File:ball_inside_circle.png]]
+[[File:Render_movingball_inside_circle.gif]]
 =Related=
 [[RENDER_Examples | Basic Examples ]]

← Older revision		Revision as of 11:38, 20 January 2022
Line 420:		Line 420:


−	==Related==	+	=Ball Animation=
		+	<syntaxhighlight lang="javascript">
		+	move=RENDER(
		+	[
		+	["id","type","cx","cy","r","width","height","fill","count","transform-origin"],
		+	["circle1","circle",200,300,20, ,,"green",1,[100,200]],
		+	["circle2","circle",200,300,8, ,,"red",1,[200-10,200]],
		+	["circle3","circle",200,300,25, ,,"blue",1,[150,200]],
		+	["circle4","circle",200,300,12, ,,"pink",1,[250-10,200]],
		+	["circle5","circle",200,300,16, ,,"purple",1,[150-10,200]]
		+	]
		+
		+	);
		+	RENDER(
		+	[
		+	["id" , "animate","animationsettings"],
		+	["circle1" , "animate",[["loop","rotate","duration","easing"],[true,-360,5*1500,"linear"]]] ,
		+	["circle2" , "animate",[["loop","rotate","duration","easing"],[true,360,5*2000,"linear"]]],
		+	["circle3" , "animate",[["loop","rotate","duration","easing"],[true,-360,5*1000,"linear"]]] ,
		+	["circle4" , "animate",[["loop","rotate","duration","easing"],[true,360,5*1000,"linear"]]],
		+	["circle5" , "animate",[["loop","rotate","duration","easing"],[true,360,5*1000,"linear"]]]
		+	]
		+	,
		+	move
		+	)
		+	""
		+	</syntaxhighlight>
		+	[[File:moving_cicles.png]]
		+
		+
		+	=Related=
	[[RENDER_Examples \| Basic Examples ]]		[[RENDER_Examples \| Basic Examples ]]

@@ Line 405: / Line 405: @@
-=PolyPoints with Ellipse=
+=PolyPoints with Ellipses=
 <syntaxhighlight lang="javascript">
@@ Line 412: / Line 412: @@
+    [
        ["type","cx","cy","rx","ry","stroke","stroke-width","fill","count"],
-	["ellipse",i=>300+pts[i][0],i=>300+pts[i][1],100,8,"purple",2,"rgba(10,20,128,0.1)",pts.length,"3,3"],
+      ["ellipse",i=>300+pts[i][0],i=>300+pts[i][1],100,8,"purple",2,"rgba(10,20,128,0.1)",pts.length,"3,3"],
 	     ],
+)