GraphSvg Module

class epyk.core.html.graph.GraphSvg.Animate(page, attribute_name, type, from_pos, to_pos, duration, repeat_count)
class epyk.core.html.graph.GraphSvg.AnimateTransform(page, attribute_name, type, from_pos, to_pos, duration, repeat_count)
class epyk.core.html.graph.GraphSvg.Circle(report, x, y, r, fill)
class epyk.core.html.graph.GraphSvg.Defs(page)
linearGradient(html_code, x1='0%', y1='0%', x2='100%', y2='0%', gradient_transform=None)

The <linearGradient> element lets authors define linear gradients that can be applied to fill or stroke of graphical elements.

Related Pages:

Parameters:
  • html_code – String. The HTML id of the component

  • x1 – Float.

  • y1 – Float.

  • x2 – Float.

  • y2 – Float.

  • gradient_transform

Return type:

LinearGradient

marker(html_code, viewBox, refX, refY)

The <marker> element defines the graphic that is to be used for drawing arrowheads or polymarkers on a given <path>, <line>, <polyline> or <polygon> element.

Related Pages:

Parameters:
  • html_code

  • viewBox

  • refX

  • refY

Return type:

Marker

radialGradient(html_code)

The <radialGradient> element lets authors define radial gradients that can be applied to fill or stroke of graphical elements.

Related Pages:

Parameters:

html_code – String. The HTML id of the component.

Return type:

radialGradient

class epyk.core.html.graph.GraphSvg.Ellipse(page, cx, cy, rx, ry)
class epyk.core.html.graph.GraphSvg.ForeignObject(page, x, y, width, height)
add(components)
Parameters:

components

class epyk.core.html.graph.GraphSvg.G(page, fill, stroke, stroke_width)
class epyk.core.html.graph.GraphSvg.Line(page, x1, y1, x2, y2)
marker_end(marker_code)
Parameters:

marker_code

marker_mid(marker_code)
Parameters:

marker_code

marker_start(marker_code)
Parameters:

marker_code

markers(marker_code)
Parameters:

marker_code

class epyk.core.html.graph.GraphSvg.LinearGradient(page, html_code, x1, y1, x2, y2, gradient_transform)
stop(offset, styles)
Parameters:
  • offset

  • styles

class epyk.core.html.graph.GraphSvg.Marker(page, html_code, viewBox, refX, refY)
arrow(size=None)

Related Pages:

Parameters:

size

markerHeight(value)
Parameters:

value

markerWidth(value)
Parameters:

value

orient(orientation)
Parameters:

orientation

property url

Related Pages:

https://developer.mozilla.org/en-US/docs/Web/SVG/Element/marker

class epyk.core.html.graph.GraphSvg.Path(page, x, y, fill, origin, bespoke_path, stroke=None, options=None, profile=None)
curve_to(x1, y1, x2, y2)

Related Pages:

Parameters:
  • x1 – Number.

  • y1 – Number.

  • x2 – Number.

  • y2 – Number.

horizontal_line_to(x)
Parameters:

x – Number.

line_to(x, y)
Parameters:
  • x – Number.

  • y – Number.

markers(marker_code)
Parameters:

marker_code

move_to(x, y)
Parameters:
  • x – Number.

  • y – Number.

quadratic_bezier_curve_to(x1, y1, x2, y2)

Related Pages:

Parameters:
  • x1 – Number.

  • y1 – Number.

  • x2 – Number.

  • y2 – Number.

smooth_curve_to(x1, y1, x2, y2)

Related Pages:

Parameters:
  • x1 – Number.

  • y1 – Number.

  • x2 – Number.

  • y2 – Number.

smooth_quadratic_bezier_curve_to(x, y, absolute=True)

Related Pages:

Parameters:
  • x – Number.

  • y – Number.

  • absolute – Boolean. Optional.

vertical_line_to(y)
Parameters:

y – Number.

class epyk.core.html.graph.GraphSvg.Polygone(page, points, fill)
class epyk.core.html.graph.GraphSvg.Polyline(page, points, height, width, fill, options)
marker_end(marker_code)
Parameters:

marker_code

marker_mid(marker_code)
Parameters:

marker_code

marker_start(marker_code)
Parameters:

marker_code

markers(marker_code)
Parameters:

marker_code

class epyk.core.html.graph.GraphSvg.RadialGradient(page, html_code)
stop(offset, styles)
Parameters:
  • offset

  • styles

class epyk.core.html.graph.GraphSvg.Rectangle(page, x, y, width, height, fill, rx, ry)
class epyk.core.html.graph.GraphSvg.SVG(page, width, height, html_code=None, options=None, profile=None)
circle(x, y, r, fill='None', stroke=None, stroke_width=None)

The <circle> element is used to create a circle.

Related Pages:

Parameters:
  • x – Float. The x coordinate of the circle.

  • y – Float. The y coordinate of the circle.

  • r – Float. The r attribute defines the radius of the circle.

  • fill

  • stroke

  • stroke_width

Return type:

Circle

click(js_funcs, profile=False, source_event=None, on_ready=False)

Add an event on the SVG.

Parameters:
  • js_funcs – List of Js Functions. A Javascript Python function.

  • profile – A Boolean. Set to true to get the profile for the function on the Javascript console.

  • source_event – A String. Optional. The source target for the event.

  • on_ready – Boolean. Optional. Specify if the event needs to be trigger when the page is loaded.

defs()

The <defs> element is used to store graphical objects that will be used at a later time. Objects created inside a <defs> element are not rendered directly. To display them you have to reference them (with a <use> element for example

Usage:

defs = poly.defs()

Related Pages:

ellipse(cx, cy, rx, ry)

The <ellipse> element is used to create an ellipse.

Related Pages:

Parameters:
  • cx – Float. The cx attribute defines the x coordinate of the center of the ellipse.

  • cy – Float. The cy attribute defines the y coordinate of the center of the ellipse.

  • rx – Float. The rx attribute defines the horizontal radius.

  • ry – Float. The ry attribute defines the vertical radius.

Return type:

Ellipse

foreignObject(x, y, width, height)

The <foreignObject> SVG element includes elements from a different XML namespace. In the context of a browser, it is most likely (X)HTML.

Related Pages:

Parameters:
  • x – Float. The x coordinate of the foreignObject.

  • y – Float. The y coordinate of the foreignObject.

  • width – Float or Percentage. The width of the foreignObject.

  • height – Float or Percentage. The height of the foreignObject.

Return type:

ForeignObject

g(fill='None', stroke=None, stroke_width=None)

The <g> SVG element is a container used to group other SVG elements.

Related Pages:

Parameters:
  • fill – String. Optional. The color for the component background.

  • stroke – String. Optional. The color for the border.

  • stroke_width – Float. Optional. The width of the component’s border.

Return type:

G

line(x1, y1, x2, y2, stroke=None, stroke_width=None)

The <line> element is used to create a line.

Related Pages:

Parameters:
  • x1 – Float. The x1 attribute defines the start of the line on the x-axis.

  • y1 – Float. The y1 attribute defines the start of the line on the y-axis.

  • x2 – Float. The x2 attribute defines the end of the line on the x-axis.

  • y2 – Float. The y2 attribute defines the end of the line on the y-axis.

  • stroke

  • stroke_width

Return type:

Line

path(x=0, y=0, fill='none', from_origin=False, bespoke_path=None, stroke=None)

The <path> element is used to define a path.

Related Pages:

Parameters:
  • x – Number.

  • y – Number.

  • fill – String. Optional.

  • from_origin

  • bespoke_path

  • stroke

Return type:

Path

polygon(points, fill='None')

The <polygon> element is used to create a graphic that contains at least three sides.

Related Pages:

Parameters:
  • points – String. The points attribute defines the x and y coordinates for each corner of the polygon.

  • fill – String. Optional.

Return type:

Polygone

polyline(points, fill='None')

The <polyline> element is used to create any shape that consists of only straight lines (that is connected at several points).

Related Pages:

Parameters:
  • points

  • fill

Return type:

Polyline

rect(x, y, width, height, fill, rx=0, ry=0)

The <rect> element is used to create a rectangle and variations of a rectangle shape.

Usage:

Related Pages:

Parameters:
  • x

  • y

  • width

  • height

  • fill

  • rx

  • ry

Return type:

Rectangle

text(text, x, y, fill=None)

The <text> element can be arranged in any number of sub-groups with the <tspan> element. Each <tspan> element can contain different formatting and position.

Related Pages:

Parameters:
  • text – String. The text to be added to the container.

  • x – Float. The x coordinate of the starting point of the text baseline.

  • y – Float. The y coordinate of the starting point of the text baseline.

  • fill

triangle(points, fill='None', options=None)

A polyline element with three points.

Related Pages:

Parameters:
  • points

  • fill

  • options

Rtpye:

Polyline

class epyk.core.html.graph.GraphSvg.SVGItem(page: PageModel, vals, html_code: Optional[str] = None, options: Optional[Union[bool, dict]] = None, profile: Optional[Union[List[Union[str, JsDataModel]], str]] = None, css_attrs: Optional[dict] = None)
fill(color)
Parameters:

color

transform(attribute_name, type, from_pos, to_pos, duration=4, repeat_count='indefinite')
Parameters:
  • attribute_name

  • type

  • from_pos

  • to_pos

  • duration

  • repeat_count

class epyk.core.html.graph.GraphSvg.TSpan(page, text, x, y)
class epyk.core.html.graph.GraphSvg.Text(page, text, x, y, fill)
line(text, x, y)

The SVG <tspan> element defines a subtext within a <text> element or another <tspan> element. It allows for adjustment of the style and/or position of that subtext as needed.

Related Pages:

Parameters:
  • text – String. The text to be added to the container

  • x – Float. The x coordinate of the starting point of the text baseline.

  • y – Float. The y coordinate of the starting point of the text baseline.

Return type:

TSpan