| Title: | Interactive JointJS Diagrams |
|---|---|
| Description: | Create interactive 'JointJS' diagrams. Wraps the JavaScript library 'JointJS' to create interactive html widgets. It will let the user draw and interact with diagrams. |
| Authors: | Pepijn de Vries [aut, cre, dtc] (ORCID: <https://orcid.org/0000-0002-7961-6646>), clientIO [cph] (Authors of the bundled JointJS library) |
| Maintainer: | Pepijn de Vries <[email protected]> |
| License: | GPL (>= 3) |
| Version: | 0.0.0.9002 |
| Built: | 2026-11-14 16:29:38 UTC |
| Source: | https://github.com/pepijn-devries/jointjs |
A wrapper around the JavaScript JointJS library to create an interactive html widget. It can be used to draw and edit diagrams.
jointjs( paper = jointjs_paper$new(), graph = NULL, width = NULL, height = NULL, elementId = NULL )jointjs( paper = jointjs_paper$new(), graph = NULL, width = NULL, height = NULL, elementId = NULL )
paper |
Either a named list with paper properties, or a jointjs_paper class object. |
graph |
Either a named list of cells to draw, or a jointjs_graph class object |
width |
Fixed width for widget (in css units). The default is
|
height |
Fixed height for widget (in css units). The default is
|
elementId |
Use an explicit element ID for the widget (rather than an automatically generated one). Useful if you have other JavaScript that needs to explicitly discover and interact with a specific widget instance. |
An object of class htmlwidget that will intelligently print
itself into HTML in a variety of contexts including the R console, within R
Markdown documents, and within Shiny output bindings.
Other widgets:
jointjs-shiny
if (interactive()) { graph <- jointjs_graph$new()$ add_elements( jointjs_rectangle$new(id = "hello", label = list(text = "Hello"))$ set_position(5, 5), jointjs_circle$new(id = "world", label = list(text = "World"))$ set_position(70, 5), jointjs_doubleLink$new(source = list(id = "hello"), target = list(id = "world")) ) jointjs(graph = graph) }if (interactive()) { graph <- jointjs_graph$new()$ add_elements( jointjs_rectangle$new(id = "hello", label = list(text = "Hello"))$ set_position(5, 5), jointjs_circle$new(id = "world", label = list(text = "World"))$ set_position(70, 5), jointjs_doubleLink$new(source = list(id = "hello"), target = list(id = "world")) ) jointjs(graph = graph) }
An image with a border and label.
jointjs_cell -> jointjs_element -> jointjs_image -> jointjs_borderedImage
jointjs_cell$set_attrs()jointjs_element$get_list()jointjs_element$set_background()jointjs_element$set_body()jointjs_element$set_bodyText()jointjs_element$set_border()jointjs_element$set_header()jointjs_element$set_headerText()jointjs_element$set_image()jointjs_element$set_label()jointjs_element$set_line()jointjs_element$set_outline()jointjs_element$set_position()jointjs_element$set_shadow()jointjs_element$set_top()jointjs_element$set_wrapper()jointjs_borderedImage$new()Initialise the object
jointjs_borderedImage$new(href, ...)
hrefA Uniform Resource Identifier (URI) to locate the image
...Arguments passed to parent class initialiser
jointjs_borderedImage$clone()The objects of this class are cloneable with this method.
jointjs_borderedImage$clone(deep = FALSE)
deepWhether to make a deep clone.
It is a backbone structure used by jointjs to construct elements for a diagram. Usually you don't initiate cells directly. Rather, it is more efficient to create its children and grandchildren, e.g.: jointjs_circle, jointjs_image, jointjs_rectangle, etc.
jointjs_cell$new()Initialise a jointjs_cell class object.
jointjs_cell$new(id, type, z, ...)
idA unique identifier (character) used to identify the cell.
It can be used to link cells together, by referring to these ids. By
default a 16 character random hexadecimal code is generated as an id.
typeSpecifies the type of cell this object represents. Its advised
to create cells using its or grand-children
(e.g. jointjs_circle, jointjs_rectangle, etc.). They will automatically
assign the correct type for you. By default it will be set to
"standard.Rectangle" (a rectangle).
zA depth index. It will determine the plotting order on its parent container.
...Parameters that will be set as SVG attributes to this object.
jointjs_cell$set_attrs()Set attributes to the cell
jointjs_cell$set_attrs(...)
...Any valid attributes to a JointJS cell.
jointjs_cell$get_list()Coerce the jointjs_cell object to a named list.
jointjs_cell$get_list()
jointjs_cell$clone()The objects of this class are cloneable with this method.
jointjs_cell$clone(deep = FALSE)
deepWhether to make a deep clone.
Other root-classes:
jointjs_graph,
jointjs_paper
A circle shape.
jointjs_cell -> jointjs_element -> jointjs_circle
jointjs_cell$set_attrs()jointjs_element$get_list()jointjs_element$set_background()jointjs_element$set_body()jointjs_element$set_bodyText()jointjs_element$set_border()jointjs_element$set_header()jointjs_element$set_headerText()jointjs_element$set_image()jointjs_element$set_label()jointjs_element$set_line()jointjs_element$set_outline()jointjs_element$set_position()jointjs_element$set_shadow()jointjs_element$set_top()jointjs_element$set_wrapper()jointjs_circle$new()Initialise the object
jointjs_circle$new(...)
...Arguments passed to parent class initialiser
jointjs_circle$clone()The objects of this class are cloneable with this method.
jointjs_circle$clone(deep = FALSE)
deepWhether to make a deep clone.
Other elements:
jointjs_cylinder,
jointjs_element,
jointjs_ellipse,
jointjs_headeredRectangle,
jointjs_image,
jointjs_inscribedImage,
jointjs_path,
jointjs_polygon,
jointjs_polyline,
jointjs_rectangle,
jointjs_textBlock
A cylinder with a vertical base and an elliptical top.
jointjs_cell -> jointjs_element -> jointjs_cylinder
jointjs_cell$set_attrs()jointjs_element$get_list()jointjs_element$set_background()jointjs_element$set_bodyText()jointjs_element$set_border()jointjs_element$set_header()jointjs_element$set_headerText()jointjs_element$set_image()jointjs_element$set_label()jointjs_element$set_line()jointjs_element$set_outline()jointjs_element$set_position()jointjs_element$set_shadow()jointjs_element$set_top()jointjs_element$set_wrapper()jointjs_cylinder$new()Initialise the object
jointjs_cylinder$new(...)
...Arguments passed to parent class initialiser
jointjs_cylinder$set_body()Set body attributes for the element.
jointjs_cylinder$set_body(fill, stroke, strokeWidth, magnet, topRy, ...)
fillFill colour
strokeStroke colour
strokeWidthWidth of the stroke line
magnetWhen set to TRUE, the element can be used as
source or target for a jointjs_link.
topRyThe vertical radius of the exposed area of the cylinder base, as an absolute value or a percentage.
...Arguments passed to parent class initialiser
jointjs_cylinder$clone()The objects of this class are cloneable with this method.
jointjs_cylinder$clone(deep = FALSE)
deepWhether to make a deep clone.
Other elements:
jointjs_circle,
jointjs_element,
jointjs_ellipse,
jointjs_headeredRectangle,
jointjs_image,
jointjs_inscribedImage,
jointjs_path,
jointjs_polygon,
jointjs_polyline,
jointjs_rectangle,
jointjs_textBlock
Create a double line link between a source and target element or location in a JointJS diagram.
jointjs_cell -> jointjs_link -> jointjs_doubleLink
jointjs_doubleLink$new()The link initialiser.
jointjs_doubleLink$new(source, target, vertices, ...)
source, targetsource and target indicate
the route the link should take. It can be a point (a list with
an x and y coordinate), or a list containing an id of
the element that should be linked. You can also provide a port
value to that list if you wish to connect to a specific port
on the element.
verticesA list of coordinates where the link should
pass through. The list is unnamed and each element should
be a list of and x and y value.
...Arguments passed to parent class initialiser.
jointjs_doubleLink$clone()The objects of this class are cloneable with this method.
jointjs_doubleLink$clone(deep = FALSE)
deepWhether to make a deep clone.
Other link:
jointjs_link,
jointjs_shadowLink
A generic template to create shapes for a jointjs_graph. Shapes are
visualised by https://www.w3.org/groups/wg/svg/ elements.
jointjs_element objects are R's representation of such elements.
This R class specifies the elements such that they can be used to
construct a jointjs_graph. It's usually more effective to initialise
a child class, such as jointjs_rectangle, jointjs_image, jointjs_circle,
etc.
Parameters are all based on SVG attributes, you can use the
... arguments to pass other valid attributes. Note that the
attributes are renamed in camel-case conform the JointJS spefications.
So, SVG attribute font-family becomes fontFamily, stroke-width
becomes strokeWidth, etc.
jointjs_cell -> jointjs_element
jointjs_element$set_position()Set the element's position relative to its parent container.
jointjs_element$set_position(x, y)
x, yCoordinates relative to its parent container.
jointjs_element$set_image()Set image attributes for the element.
jointjs_element$set_image(href, ...)
hrefA Uniform Resource Identifier (URI) to locate a resource (e.g. image)
...Additional SVG attributes accepted by the specific SVG element
jointjs_element$set_border()Set border attributes for the element.
jointjs_element$set_border(fill, stroke, strokeWidth, ...)
fillFill colour
strokeStroke colour
strokeWidthWidth of the stroke line
...Additional SVG attributes accepted by the specific SVG element
jointjs_element$set_background()Set background attributes for the element.
jointjs_element$set_background(fill, stroke, strokeWidth, ...)
fillFill colour
strokeStroke colour
strokeWidthWidth of the stroke line
...Additional SVG attributes accepted by the specific SVG element
jointjs_element$set_top()Set top attributes for the element (used to visualise the top of a cylinder base).
jointjs_element$set_top(fill, stroke, strokeWidth, ...)
fillFill colour
strokeStroke colour
strokeWidthWidth of the stroke line
...Additional SVG attributes accepted by the specific SVG element
jointjs_element$set_line()Set line attributes for the element.
jointjs_element$set_line(stroke, strokeWidth, ...)
strokeStroke colour
strokeWidthWidth of the stroke line
...Additional SVG attributes accepted by the specific SVG element
jointjs_element$set_shadow()Set shadow attributes for the element.
jointjs_element$set_shadow(stroke, strokeWidth, ...)
strokeStroke colour
strokeWidthWidth of the stroke line
...Additional SVG attributes accepted by the specific SVG element
jointjs_element$set_outline()Set outline attributes for the element.
jointjs_element$set_outline(stroke, strokeWidth, ...)
strokeStroke colour
strokeWidthWidth of the stroke line
...Additional SVG attributes accepted by the specific SVG element
jointjs_element$set_wrapper()Set wrapper attributes for the element.
jointjs_element$set_wrapper(stroke, strokeWidth, ...)
strokeStroke colour
strokeWidthWidth of the stroke line
...Additional SVG attributes accepted by the specific SVG element
jointjs_element$set_header()Set header attributes for the element.
jointjs_element$set_header(fill, stroke, strokeWidth, ...)
fillFill colour
strokeStroke colour
strokeWidthWidth of the stroke line
...Additional SVG attributes accepted by the specific SVG element
jointjs_element$set_headerText()Set headerText attributes for the element.
jointjs_element$set_headerText(text, color, fontFamily, fontSize, ...)
textA text to display
colorColour of the element
fontFamilyFont family for the text to display
fontSizeFont size for the text to display
...Additional SVG attributes accepted by the specific SVG element
jointjs_element$set_bodyText()Set bodyText attributes for the element.
jointjs_element$set_bodyText(text, color, fontFamily, fontSize, ...)
textA text to display
colorColour of the element
fontFamilyFont family for the text to display
fontSizeFont size for the text to display
...Additional SVG attributes accepted by the specific SVG element
jointjs_element$set_body()Set body attributes for the element.
jointjs_element$set_body(fill, stroke, strokeWidth, magnet, ...)
fillFill colour
strokeStroke colour
strokeWidthWidth of the stroke line
magnetWhen set to TRUE, the element can be used as
source or target for a jointjs_link.
...Additional SVG attributes accepted by the specific SVG element
jointjs_element$set_label()Set label attributes for the element.
jointjs_element$set_label(text, color, fontFamily, fontSize, ...)
textA text to display
colorColour of the element
fontFamilyFont family for the text to display
fontSizeFont size for the text to display
...Additional SVG attributes accepted by the specific SVG element
jointjs_element$get_list()Returns a named list representation of the element.
jointjs_element$get_list()
jointjs_element$clone()The objects of this class are cloneable with this method.
jointjs_element$clone(deep = FALSE)
deepWhether to make a deep clone.
Other elements:
jointjs_circle,
jointjs_cylinder,
jointjs_ellipse,
jointjs_headeredRectangle,
jointjs_image,
jointjs_inscribedImage,
jointjs_path,
jointjs_polygon,
jointjs_polyline,
jointjs_rectangle,
jointjs_textBlock
An elliptical shape.
jointjs_cell -> jointjs_element -> jointjs_ellipse
jointjs_cell$set_attrs()jointjs_element$get_list()jointjs_element$set_background()jointjs_element$set_body()jointjs_element$set_bodyText()jointjs_element$set_border()jointjs_element$set_header()jointjs_element$set_headerText()jointjs_element$set_image()jointjs_element$set_label()jointjs_element$set_line()jointjs_element$set_outline()jointjs_element$set_position()jointjs_element$set_shadow()jointjs_element$set_top()jointjs_element$set_wrapper()jointjs_ellipse$new()Initialise the object
jointjs_ellipse$new(...)
...Arguments passed to parent class initialiser
jointjs_ellipse$clone()The objects of this class are cloneable with this method.
jointjs_ellipse$clone(deep = FALSE)
deepWhether to make a deep clone.
Other elements:
jointjs_circle,
jointjs_cylinder,
jointjs_element,
jointjs_headeredRectangle,
jointjs_image,
jointjs_inscribedImage,
jointjs_path,
jointjs_polygon,
jointjs_polyline,
jointjs_rectangle,
jointjs_textBlock
An image embedded into a rectangle with a label.
jointjs_cell -> jointjs_element -> jointjs_image -> jointjs_embeddedImage
jointjs_cell$set_attrs()jointjs_element$get_list()jointjs_element$set_background()jointjs_element$set_body()jointjs_element$set_bodyText()jointjs_element$set_border()jointjs_element$set_header()jointjs_element$set_headerText()jointjs_element$set_image()jointjs_element$set_label()jointjs_element$set_line()jointjs_element$set_outline()jointjs_element$set_position()jointjs_element$set_shadow()jointjs_element$set_top()jointjs_element$set_wrapper()jointjs_embeddedImage$new()Initialise the object
jointjs_embeddedImage$new(href, ...)
hrefA Uniform Resource Identifier (URI) to locate the image
...Arguments passed to parent class initialiser
jointjs_embeddedImage$clone()The objects of this class are cloneable with this method.
jointjs_embeddedImage$clone(deep = FALSE)
deepWhether to make a deep clone.
Use the jointjs_graph class to define a diagram that can be rendered
with jointjs().
jointjs_graph$new()Initialise a JointJS Graph
jointjs_graph$new(x, ...)
xA named list of cell objects represented as lists.
You can use the graph state object returned by a Shiny widget
to initiate a graph class object.
...Ignored
jointjs_graph$add_elements()Add elements to the graph. These can be any object that inherit from the jointjs_cell class. So, these can be shapes like jointjs_rectangle and jointjs_image, but also links like jointjs_doubleLink.
jointjs_graph$add_elements(...)
...Pass any number of items to be added to the graph here.
jointjs_graph$get_widget()This is just short for jointjs(graph = x), where x
is a jointjs_graph class object.
jointjs_graph$get_widget(...)
...Arguments passed to jointjs()
jointjs_graph$get_list()Returns the list of cells that define the graph.
jointjs_graph$get_list()
jointjs_graph$clone()The objects of this class are cloneable with this method.
jointjs_graph$clone(deep = FALSE)
deepWhether to make a deep clone.
Other root-classes:
jointjs_cell,
jointjs_paper
A rectangle with a header.
jointjs_cell -> jointjs_element -> jointjs_headeredRectangle
jointjs_cell$set_attrs()jointjs_element$get_list()jointjs_element$set_background()jointjs_element$set_body()jointjs_element$set_bodyText()jointjs_element$set_border()jointjs_element$set_header()jointjs_element$set_headerText()jointjs_element$set_image()jointjs_element$set_label()jointjs_element$set_line()jointjs_element$set_outline()jointjs_element$set_position()jointjs_element$set_shadow()jointjs_element$set_top()jointjs_element$set_wrapper()jointjs_headeredRectangle$new()Initialise the object
jointjs_headeredRectangle$new(header, headerText, bodyText, ...)
headerEither a jointjs_rectangle or a named list with
SVG rectangle attributes.
headerTextA named list with SVG text element properties
bodyTextA named list with SVG text element properties
...Arguments passed to parent class initialiser
jointjs_headeredRectangle$clone()The objects of this class are cloneable with this method.
jointjs_headeredRectangle$clone(deep = FALSE)
deepWhether to make a deep clone.
Other elements:
jointjs_circle,
jointjs_cylinder,
jointjs_element,
jointjs_ellipse,
jointjs_image,
jointjs_inscribedImage,
jointjs_path,
jointjs_polygon,
jointjs_polyline,
jointjs_rectangle,
jointjs_textBlock
An image with a label.
jointjs_cell -> jointjs_element -> jointjs_image
jointjs_cell$set_attrs()jointjs_element$get_list()jointjs_element$set_background()jointjs_element$set_body()jointjs_element$set_bodyText()jointjs_element$set_border()jointjs_element$set_header()jointjs_element$set_headerText()jointjs_element$set_image()jointjs_element$set_label()jointjs_element$set_line()jointjs_element$set_outline()jointjs_element$set_position()jointjs_element$set_shadow()jointjs_element$set_top()jointjs_element$set_wrapper()jointjs_image$new()Initialise the object
jointjs_image$new(href, ...)
hrefA Uniform Resource Identifier (URI) to locate the image
...Arguments passed to parent class initialiser
jointjs_image$clone()The objects of this class are cloneable with this method.
jointjs_image$clone(deep = FALSE)
deepWhether to make a deep clone.
Other elements:
jointjs_circle,
jointjs_cylinder,
jointjs_element,
jointjs_ellipse,
jointjs_headeredRectangle,
jointjs_inscribedImage,
jointjs_path,
jointjs_polygon,
jointjs_polyline,
jointjs_rectangle,
jointjs_textBlock
An image inscribed in an ellipse with a label.
jointjs_cell -> jointjs_element -> jointjs_image -> jointjs_inscribedImage
jointjs_cell$set_attrs()jointjs_element$get_list()jointjs_element$set_background()jointjs_element$set_body()jointjs_element$set_bodyText()jointjs_element$set_border()jointjs_element$set_header()jointjs_element$set_headerText()jointjs_element$set_image()jointjs_element$set_label()jointjs_element$set_line()jointjs_element$set_outline()jointjs_element$set_position()jointjs_element$set_shadow()jointjs_element$set_top()jointjs_element$set_wrapper()jointjs_inscribedImage$new()Initialise the object
jointjs_inscribedImage$new(href, ...)
hrefA Uniform Resource Identifier (URI) to locate the image
...Arguments passed to parent class initialiser
jointjs_inscribedImage$clone()The objects of this class are cloneable with this method.
jointjs_inscribedImage$clone(deep = FALSE)
deepWhether to make a deep clone.
Other elements:
jointjs_circle,
jointjs_cylinder,
jointjs_element,
jointjs_ellipse,
jointjs_headeredRectangle,
jointjs_image,
jointjs_path,
jointjs_polygon,
jointjs_polyline,
jointjs_rectangle,
jointjs_textBlock
Create a link between a source and target element or location in a JointJS diagram.
jointjs_cell -> jointjs_link
jointjs_link$new()The link initialiser.
jointjs_link$new(source, target, vertices, ...)
source, targetsource and target indicate
the route the link should take. It can be a point (a list with
an x and y coordinate), or a list containing an id of
the element that should be linked. You can also provide a port
value to that list if you wish to connect to a specific port
on the element.
verticesA list of coordinates where the link should
pass through. The list is unnamed and each element should
be a list of and x and y value.
...Arguments passed to parent class initialiser.
jointjs_link$new(vertices = list(
list(x = 50, y = 50),
list(x = 40, y = 60)
))
jointjs_link$clone()The objects of this class are cloneable with this method.
jointjs_link$clone(deep = FALSE)
deepWhether to make a deep clone.
Other link:
jointjs_doubleLink,
jointjs_shadowLink
## ------------------------------------------------ ## Method `jointjs_link$new()` ## ------------------------------------------------ jointjs_link$new(vertices = list( list(x = 50, y = 50), list(x = 40, y = 60) ))## ------------------------------------------------ ## Method `jointjs_link$new()` ## ------------------------------------------------ jointjs_link$new(vertices = list( list(x = 50, y = 50), list(x = 40, y = 60) ))
Set up a sheet of paper to draw jointjs diagrams on. This class can be used
to define the paper specifications. These specifications are needed when
creating a widget with jointjs().
jointjs_paper$new()Initiate a paper object
jointjs_paper$new(
width,
height,
background = list(color = "#E9ECEF"),
gridSize = 20,
drawGrid = list(name = "dot", args = list(color = "#808080", thickness = 1)),
interactive = TRUE,
snapLinks = list(radius = 20),
defaultLink = jointjs::jointjs_cell$new(NULL, "standard.Link", .connection =
list(stroke = "#2C3E50", strokeWidth = 2), `.marker-target` = list(fill = "#2C3E50",
d = "M 10 0 L 0 5 L 10 10 z")),
validateConnection =
htmlwidgets::JS("\n function(cellViewS, magnetS, cellViewT, magnetT, end, linkView) {\n if (cellViewS === cellViewT) return false;\n return cellViewT && cellViewT.model.isElement();\n }\n "),
...
)
widthPaper width in CSS units.
heightPaper height in CSS units.
backgroundA named list with background properties. The list can
contain the elements color, image (an URL for a background image),
position (x and y coordinate for the image), size of the
background image (width and height), repeat a CSS background-repeat
property, quality coefficient for image quality, opacity in the
range of 0-1, watermarkAngle in degrees. If set to FALSE no
background is drawn.
gridSizegridSize in CSS units
drawGridA named list specifying how to draw a grid on the paper.
An element name can use any of these predefined grid patterns:
"dot" (default), "fixedDot", "mesh", or "doubleMesh".
Use an element named args to specify pattern properties.
If set to FALSE, no grid is drawn.
interactiveUse a logical value to enable or disable all
interactive elements. Or use a named list of interactions with
logical values to enable or disable specific interactions
snapLinksA logical value indicating if links should be snapped
to magnets. Or a named list with element radius in pixels, giving
the distance for snapping links.
defaultLinkDefault properties for links. A jointjs_link class object.
validateConnectionA JavaScript function that validates if a connection between a specific source and target is allowed. It should return a logical value.
...Other options passed to the JointJS JavaScript library.
jointjs_paper$get_list()Coerce JointJS paper options to a named list.
jointjs_paper$get_list()
jointjs_paper$clone()The objects of this class are cloneable with this method.
jointjs_paper$clone(deep = FALSE)
deepWhether to make a deep clone.
Other root-classes:
jointjs_cell,
jointjs_graph
A vector of vertices connected by lines.
jointjs_cell -> jointjs_element -> jointjs_path
jointjs_cell$set_attrs()jointjs_element$get_list()jointjs_element$set_background()jointjs_element$set_body()jointjs_element$set_bodyText()jointjs_element$set_border()jointjs_element$set_header()jointjs_element$set_headerText()jointjs_element$set_image()jointjs_element$set_label()jointjs_element$set_line()jointjs_element$set_outline()jointjs_element$set_position()jointjs_element$set_shadow()jointjs_element$set_top()jointjs_element$set_wrapper()jointjs_path$new()Initialise the object
jointjs_path$new(refD, ...)
refDA character string that is used to set the
d attribute of an SVG path element.
...Arguments passed to parent class initialiser
jointjs_path$clone()The objects of this class are cloneable with this method.
jointjs_path$clone(deep = FALSE)
deepWhether to make a deep clone.
Other elements:
jointjs_circle,
jointjs_cylinder,
jointjs_element,
jointjs_ellipse,
jointjs_headeredRectangle,
jointjs_image,
jointjs_inscribedImage,
jointjs_polygon,
jointjs_polyline,
jointjs_rectangle,
jointjs_textBlock
jointjs_path$new('M 0 5 10 0 C 20 0 20 20 10 20 L 0 15 Z')jointjs_path$new('M 0 5 10 0 C 20 0 20 20 10 20 L 0 15 Z')
A vector of vertices connected as a polygon.
jointjs_cell -> jointjs_element -> jointjs_polygon
jointjs_cell$set_attrs()jointjs_element$get_list()jointjs_element$set_background()jointjs_element$set_body()jointjs_element$set_bodyText()jointjs_element$set_border()jointjs_element$set_header()jointjs_element$set_headerText()jointjs_element$set_image()jointjs_element$set_label()jointjs_element$set_line()jointjs_element$set_outline()jointjs_element$set_position()jointjs_element$set_shadow()jointjs_element$set_top()jointjs_element$set_wrapper()jointjs_polygon$new()Initialise the object
jointjs_polygon$new(refPoints, ...)
refPointsA character string of
coordinates that is used to set the SVG points attribute
of polygon or polyline elements.
...Arguments passed to parent class initialiser
jointjs_polygon$clone()The objects of this class are cloneable with this method.
jointjs_polygon$clone(deep = FALSE)
deepWhether to make a deep clone.
Other elements:
jointjs_circle,
jointjs_cylinder,
jointjs_element,
jointjs_ellipse,
jointjs_headeredRectangle,
jointjs_image,
jointjs_inscribedImage,
jointjs_path,
jointjs_polyline,
jointjs_rectangle,
jointjs_textBlock
jointjs_polygon$new("10,10 30,10 30,30")jointjs_polygon$new("10,10 30,10 30,30")
A polyline with a label.
jointjs_cell -> jointjs_element -> jointjs_polyline
jointjs_cell$set_attrs()jointjs_element$get_list()jointjs_element$set_background()jointjs_element$set_body()jointjs_element$set_bodyText()jointjs_element$set_border()jointjs_element$set_header()jointjs_element$set_headerText()jointjs_element$set_image()jointjs_element$set_label()jointjs_element$set_line()jointjs_element$set_outline()jointjs_element$set_position()jointjs_element$set_shadow()jointjs_element$set_top()jointjs_element$set_wrapper()jointjs_polyline$new()Initialise the object
jointjs_polyline$new(refPoints, ...)
refPointsA character string of
coordinates that is used to set the SVG points attribute
of polygon or polyline elements.
...Arguments passed to parent class initialiser
jointjs_polyline$clone()The objects of this class are cloneable with this method.
jointjs_polyline$clone(deep = FALSE)
deepWhether to make a deep clone.
Other elements:
jointjs_circle,
jointjs_cylinder,
jointjs_element,
jointjs_ellipse,
jointjs_headeredRectangle,
jointjs_image,
jointjs_inscribedImage,
jointjs_path,
jointjs_polygon,
jointjs_rectangle,
jointjs_textBlock
jointjs_polyline$new("10,10 30,10 30,30")jointjs_polyline$new("10,10 30,10 30,30")
A Rectangle shape.
jointjs_cell -> jointjs_element -> jointjs_rectangle
jointjs_cell$set_attrs()jointjs_element$get_list()jointjs_element$set_background()jointjs_element$set_body()jointjs_element$set_bodyText()jointjs_element$set_border()jointjs_element$set_header()jointjs_element$set_headerText()jointjs_element$set_image()jointjs_element$set_label()jointjs_element$set_line()jointjs_element$set_outline()jointjs_element$set_position()jointjs_element$set_shadow()jointjs_element$set_top()jointjs_element$set_wrapper()jointjs_rectangle$new()Initialise the object
jointjs_rectangle$new(...)
...Arguments passed to parent class initialiser
jointjs_rectangle$clone()The objects of this class are cloneable with this method.
jointjs_rectangle$clone(deep = FALSE)
deepWhether to make a deep clone.
Other elements:
jointjs_circle,
jointjs_cylinder,
jointjs_element,
jointjs_ellipse,
jointjs_headeredRectangle,
jointjs_image,
jointjs_inscribedImage,
jointjs_path,
jointjs_polygon,
jointjs_polyline,
jointjs_textBlock
Create a thicker line link with shadow between a source and target element or location in a JointJS diagram.
jointjs_cell -> jointjs_link -> jointjs_shadowLink
jointjs_shadowLink$new()The link initialiser.
jointjs_shadowLink$new(source, target, vertices, ...)
source, targetsource and target indicate
the route the link should take. It can be a point (a list with
an x and y coordinate), or a list containing an id of
the element that should be linked. You can also provide a port
value to that list if you wish to connect to a specific port
on the element.
verticesA list of coordinates where the link should
pass through. The list is unnamed and each element should
be a list of and x and y value.
...Arguments passed to parent class initialiser.
jointjs_shadowLink$clone()The objects of this class are cloneable with this method.
jointjs_shadowLink$clone(deep = FALSE)
deepWhether to make a deep clone.
Other link:
jointjs_doubleLink,
jointjs_link
A rectangle shape with text.
jointjs_cell -> jointjs_element -> jointjs_textBlock
jointjs_cell$set_attrs()jointjs_element$get_list()jointjs_element$set_background()jointjs_element$set_body()jointjs_element$set_bodyText()jointjs_element$set_border()jointjs_element$set_header()jointjs_element$set_headerText()jointjs_element$set_image()jointjs_element$set_label()jointjs_element$set_line()jointjs_element$set_outline()jointjs_element$set_position()jointjs_element$set_shadow()jointjs_element$set_top()jointjs_element$set_wrapper()jointjs_textBlock$new()Initialise the object
jointjs_textBlock$new(text, ...)
textA character string to be displayed.
...Arguments passed to parent class initialiser
jointjs_textBlock$clone()The objects of this class are cloneable with this method.
jointjs_textBlock$clone(deep = FALSE)
deepWhether to make a deep clone.
Other elements:
jointjs_circle,
jointjs_cylinder,
jointjs_element,
jointjs_ellipse,
jointjs_headeredRectangle,
jointjs_image,
jointjs_inscribedImage,
jointjs_path,
jointjs_polygon,
jointjs_polyline,
jointjs_rectangle
Output and render functions for using jointjs within Shiny applications and interactive Rmd documents.
jointjsOutput(outputId, width = "100%", height = "400px") renderJointjs(expr, env = parent.frame(), quoted = FALSE)jointjsOutput(outputId, width = "100%", height = "400px") renderJointjs(expr, env = parent.frame(), quoted = FALSE)
outputId |
output variable to read from |
width, height
|
Must be a valid CSS unit (like |
expr |
An expression that generates a jointjs |
env |
The environment in which to evaluate |
quoted |
Is |
Other widgets:
jointjs()