Canvas

class geometry.Canvas(width: Union[int, float], height: Union[int, float], scale: Union[int, float] = 1, **style: Any)

A Canvas that can hold different shapes or groups of shapes and display them as html.

>>> Canvas(100, 200).html()
'<div style="position: relative; width: 100px; height: 200px">...

You may pass a scale factor that will be applied to the canvas itself and all shapes that will be added

>>> Canvas(10, 20, scale=2).html()
'<div style="position: relative; width: 20px; height: 40px">...

You can use the user_data field for style and color information

>>> c = Canvas(100, 200)
>>> c.append(Rect[20, 40, 'red'])
>>> 'background: red' in c.html()
True

By default the shapes are displayed in black

>>> c = Canvas(100, 200)
>>> c.append(Rect[20, 40])
>>> 'background: black' in c.html()
True

The user_data may also be a dictionary of css attributes

>>> c = Canvas(100, 200)
>>> c.append(Rect[20, 40, {'background': 'none', 'border': '1px solid yellow'}])
>>> 'background: none' in c.html() and 'border: 1px solid yellow' in c.html()
True

Segments are rendered like rects with an additional line indicating the orientation

>>> from geometry import Point
>>> c = Canvas(100, 200)
>>> c.append(Segment.from_start_end(Point(0, 0), Point(0, 100), 2))
>>> 'height: 100%' in c.html()  # the vertical line
True

>>> c = Canvas(100, 200)
>>> c.append(Segment.from_start_end(Point(0, 0), Point(100, 0), 2))
>>> 'width: 100%' in c.html()  # the horizontal line
True

Groups are rendered as if the children were passed to the canvas individually

>>> rect = Rect[20, 40]
>>> segment = Segment.from_start_end(Point(0, 0), Point(10, 0), 2)
>>> group = Group([rect, segment])
>>> with_group = Canvas(100, 200)
>>> with_group.append(group)
>>> no_group = Canvas(100, 200)
>>> no_group.append(rect)
>>> no_group.append(segment)
>>> with_group.html() == no_group.html()
True

If you try to render anything else, an error is raised

>>> c = Canvas(100, 200)
>>> c.append("This is not allowed")
>>> c.html()
Traceback (most recent call last):
...
ValueError: cannot draw unknown shape of class <class 'str'>

property style_getter

The style_getter is a function that turns the user data of a shape into something that can be used as an html style.

The default style_getter just returns the user data as is.

>>> c = Canvas(100, 200)
>>> c.style_getter(Rect[2, 4, 'red'].user_data)
'red'

Two types of object are allowed to be returned by the style_getter: - str: this will be used as html color for the background - dict: this will be used as the complete css style of the element

>>> always_blue = lambda user_data: 'blue'
>>> c.style_getter = always_blue
>>> c.style_getter(Rect[2, 4].user_data)
'blue'

The style_getter may also be a dictionary that maps user_data to a style

>>> opposite = {'red': 'green', 'blue': 'yellow'}
>>> c.style_getter = opposite
>>> c.style_getter(Rect[2, 4, 'red'].user_data)
'green'

Anything else is not allowed

>>> c.style_getter = 'blue'
Traceback (most recent call last):
...
ValueError: style getter must be either dict or callable

append(shape: Union[geometry.rect.Rect, geometry.group.Group, geometry.path.Segment]) → None

Add one shape to the Canvas

>>> c = Canvas(100, 200)
>>> c.append(Rect[2, 4])
>>> len(c.shapes)
1

extend(items: Iterable[Item]) → None

Append items from an iterable to the collection.

>>> container.extend([1, 2, 3])

This is equivalent to

>>> for item in [1, 2, 3]:
...     container.append(item)

E.g. Groups support these methods

>>> from geometry import Group, Rect
>>> g = Group()
>>> g.extend([Rect[2, 4], Rect[4, 2]])
>>> g
{[-1:1, -2:2], [-2:2, -1:1]} ...

extend_star(*items: Item) → None

Append items from var args

>>> container.extend_star(1, 2, 3)

This is equivalent to

>>> for item in [1, 2, 3]:
...     container.append(item)

E.g. Groups support these methods

>>> from geometry import Group, Rect
>>> g = Group()
>>> g.extend_star(Rect[2, 4], Rect[4, 2])
>>> g
{[-1:1, -2:2], [-2:2, -1:1]} ...