More RENDER Examples

Segmented Render Arrays

Segmented Arrays with empty element. Each Segment can have its own heading

RENDER(
   [
	  ["type","size"],
	  ["circle",100],
	  ["circle",200],
	  [],
	  ["type","size"],
	  ["circle",400],
	  ["circle",600]
   ]
)

Timeline of Draw

RENDER(
   [
	  ["timeline","type","size"],
	  [,"circle",100],
	  [10000,"circle",200],
	  [],
	  ["type","size"],
	  ["circle",400],
	  ["circle",600]
   ]
)

Drawing Strokes Simulation

RENDER(
   [
	   ["timeline","type","size","draw"],
	  [,"circle",100,true],
	  [4000,"circle",200,true],
	  [],
	  ["type","size","draw"],
	  ["circle",400,true],
	  ["circle",600,true]
   ]
)

Line Modes

Line modes. Get modes from CURVEMODES() part of the string gives the mode like stepbefore

RENDER(
	[
		["type"   ,   "size"      ,   "coordinates"                  , "stroke"      , "fill" ,"linemode"  ],
			["line"      ,   null   ,   [100,10,200,100,300,299,200,300]            , "red"   , "blue"   , "catmull"]
	]
);
""

Arrow Heads on Lines

marker-start marker-end marker-mid

RENDER(
	[
		["type"   ,   "size"      ,   "coordinates"                  				, "stroke"      , "fill" , "marker-start"],
			["line"      ,   null   ,   [100,10,200,100,300,299,200,300]            , "red"   		, "blue" ,	"#arrow"]
	]
);
""

Arrow Heads on Lines and Line Modes

RENDER(
	[
		["type"   ,   "size"      ,   "coordinates"                  , "stroke"      , "fill" ,"linemode" ,"marker-end" ],
		["line"      ,   null   ,   [100,10,200,100,300,299,200,300]            , "red"   , "blue"   , "stepbefore","arrow"]
	]
);
""

Arrow Heads at Start, End and Middle of Line

-arrows mid start and end

RENDER(
	[
		["type"   ,   "size"      ,   "coordinates"                  , "stroke"      , "fill" ,"linemode" ,"marker-end","marker-mid","marker-start" ],
			["line"      ,   null   ,   [100,10,200,100,300,299,200,300]            , "red"   , "blue"   , "stepbefore","arrow","arrow","arrow"]
	]
);
""