4D v16

SVG_Define_radial_gradient

Home

 
4D v16
SVG_Define_radial_gradient

SVG_Define_radial_gradient 


 

SVG_Define_radial_gradient ( parentSVGObject ; id ; startColor ; endColor {; cx ; cy ; r {; fx ; fy}} ) -> Function result 
Parameter Type   Description
parentSVGObject  SVG_Ref in Reference of parent element
id  String in Name of gradient
startColor  String in Start color
endColor  String in End color
cx  Integer in Coordinate on X axis of center of endColor
cy  Integer in Coordinate on Y axis of center of endColor
Integer in Radius of endColor
fx  Integer in Coordinate on X axis of center of startColor
fy  Integer in Coordinate on Y axis of center of startColor
Function result  String in Reference of gradient

The SVG_Define_radial_gradient command sets a new radial gradient in the SVG container designated by parentSVGObject and returns its reference. If parentSVGObject is not an SVG document, an error is generated.

A gradient consists in a continuous progressive color transition from one color to another along a vector. Once specified, gradients are called on a given graphic element, while indicating whether this element must be filled or edged with the gradient called.

The id parameter specifies the name of the gradient. If an element with the same name exists, it will be replaced. This is the name that will be used to call the gradient each time a that a color expression is expected by using the syntax "url(#ID)".

The startColor and endColor parameters specify the colors used to begin and end the gradient.

The optional cx, cy and r parameters specify, in percent, the external border circle of the endColor of the gradient. Their values must be included between 0 and 100.

The optional fx and fy parameters specify, in percent, the focus point of the gradient. The startColor begins at the point [fx,fy]. Their values must be included between 0 and 100. If these arguments are omitted, this point coincides with [cx,cy].

Example  

 $svg:=SVG_New
 
 SVG_Define_radial_gradient($svg;"grad1";"yellow";"red")
 SVG_New_rect($svg;10;10;90;90;0;0;"black";"url(#grad1)")
 SVG_New_text($svg;"grad1";12;10)
 
 SVG_Define_radial_gradient($svg;"grad2";"yellow";"red";50;50;20;50;50)
 SVG_New_rect($svg;110;10;90;90;0;0;"black";"url(#grad2)")
 SVG_New_text($svg;"grad2";112;10)
 
 SVG_Define_radial_gradient($svg;"grad3";"yellow";"red";80;60;50;60;80)
 SVG_New_rect($svg;10;110;90;90;0;0;"black";"url(#grad3)")
 SVG_New_text($svg;"grad3";12;110)
 
 SVG_Define_radial_gradient($svg;"grad4";"yellow";"red";20;50;80;20;30)
 SVG_New_rect($svg;110;110;90;90;0;0;"black";"url(#grad4)")
 SVG_New_text($svg;"grad4";112;110)
 
  `Save document
 SVG_SAVE_AS_TEXT($svg;"test.svg")
  `Free up memory
 SVG_CLEAR($svg)



See also 

SVG Colors
SVG_Define_linear_gradient

 
PROPERTIES 

Product: 4D
Theme: Structure and Definitions
Number: 65984

 
HISTORY 

Created: Composant 4D SVG v11.3

 
ARTICLE USAGE

4D SVG Component ( 4D v16)