SVG transform-origin ignored

[febdoctor]

The attribute "transform-origin" sets the reference point used in transformations set by the "transform" attribute. In the examples below, a rotation was used with the origin set to the center of the triangle. In WeasyPrint, the origin is ignored and the triangle is rotated relative to (0, 0). When the object is far from (0, 0), it can rotate far from it's intended location and far outside the viewport.

The following SVG reproduces the problem. The rotation is small in order to make the error more visible.

<svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 400 400">

<defs>
  <g id="triangle" transform="scale(0.6)">
    <path d="M 0,-20 l 23,40 l -46,0 Z" stroke="purple" fill="none" />
  </g>
</defs>


<use href="#triangle" x="10mm" y="10mm"/>
<use href="#triangle" x="10mm" y="10mm" transform-origin="10mm 10mm" transform="rotate(9)" />

</svg>

In Firefox, the triangle is rotated relative to the center of the triangle:

But WeasyPrint rotates it relative to (0, 0). It this example it looks slightly offset because the rotation is small.

Reference files:
svgtransformorigin-firefox.pdf
svgtransformorigin.pdf

[liZe]

Thanks for the bug report.

It is supported by browsers, but it’s not in the SVG specification, even in SVG2. It’s in this draft, overridden by this CSS module.

[liZe]

If anyone is interested in adding this feature, we need to update this function (and the utils.transform function it calls) to take care of transform-origin:

WeasyPrint/weasyprint/svg/__init__.py

Lines 748 to 755 in a5d8412

	def transform(self, transform_string, font_size):
	"""Apply a transformation string to the node."""
	if not transform_string:
	return
	matrix = transform(transform_string, font_size, self.inner_diagonal)
	if matrix.determinant:
	self.stream.transform(*matrix.values)