WebKit Bugzilla
New
Browse
Log In
×
Sign in with GitHub
or
Remember my login
Create Account
·
Forgot Password
Forgotten password account recovery
RESOLVED FIXED
241762
[LBSE] Add 'viewBox' support
https://bugs.webkit.org/show_bug.cgi?id=241762
Summary
[LBSE] Add 'viewBox' support
Nikolas Zimmermann
Reported
2022-06-19 14:31:43 PDT
LBSE doesn't handle the 'viewBox' attribute for outermost <svg> elements at present. Downstream LBSE handled this specifically via a few special cases in RenderLayer, that are quite intrusive. The reason for that is that the transformation matrix resulting from the 'viewBox' shall only be applied to _child_ elements of the <svg>, not the <svg> itself. Therefore one cannot simply map the 'viewBox' induced transformation as regular CSS transformation, as that would also be applied when rendering the <svg> element itself (background, border, ...). In the past few months (most noticeable after
webkit.org/b/211787
was solved) a new opportunity was opened to handle 'viewBox' for SVG without having to change RenderLayer at all, since CSS/HTML actually offers a similar feature: perspective transformations. Specifying 'perspective: 500px' / 'transform-style: preserve-3d' on a container <div> element does not change the rendering of the <div> in any way, only its children: an additional transformation is applied, that only affects the child elements. That's very similar to the needs for SVG 'viewBox'. As a test, I followed this approach to implement 'viewBox' as unintrusive as possible in the new upstream LBSE. Specifying 'viewBox' on an outermost <svg> element will require an additional compositing layer that carries a 'sublayerTransform' similar to how perspective transformations are handled. The benefit is that neither painting, layout, nor hit-testing require any changes: getTransformFromContainer() / RenderLayerBacking / RenderLayerCompositor already handle sublayer transformations. During development I expanded the scope of the RenderSVGRoot sublayer transformation: it also handles zooming & panning for the SVG subtree. We can implement all these features in a straight-forward way, without having to extend RenderLayer with additional concepts/branches to handle SVGs needs. Obviously the cost is an additional compositing layer, but panning is then really cheap: it can be handled completely via composition, not requiring any relayout or repainting, which is much faster than any previous approach. Zooming can also be handled without relayout, but needs additional repaints, which is still cheaper than previous attempts. In my WIP branch, viewBox handling works perfectly fine, except that the content looks blurry:
webkit.org/b/27684
strikes back once again. I will concentrate on fixing
bug 27684
, at least in such a way that I can use it for SVG viewBox. Stay tuned!
Attachments
Add attachment
proposed patch, testcase, etc.
Nikolas Zimmermann
Comment 1
2022-06-19 14:38:16 PDT
Pull request:
https://github.com/WebKit/WebKit/pull/1622
Nikolas Zimmermann
Comment 2
2022-06-19 14:47:57 PDT
Pull request:
https://github.com/WebKit/WebKit/pull/1623
Nikolas Zimmermann
Comment 3
2022-06-19 14:56:17 PDT
(In reply to Nikolas Zimmermann from
comment #1
)
> Pull request:
https://github.com/WebKit/WebKit/pull/1622
Please ignore that PR, 1623 is correct, I made a mistake with the branch naming convention before.
Radar WebKit Bug Importer
Comment 4
2022-06-26 14:32:12 PDT
<
rdar://problem/95941193
>
Nikolas Zimmermann
Comment 5
2022-07-16 09:21:12 PDT
NOTE: The original bug description is obsolete: compositing layers are no longer involved with viewBox/zoom/pan handling. It's just too wasteful, despite the good intentions... I'm now wrapping all children of the outermost <svg> in an anonymous RendrSVGViewportContainer that carries the viewBox/zoom/pan induced transformation as regular CSS transform: greatly simplifies the overall code, no special cases for SVG viewBox necessary (vs. LBSE downstream, that had hacked viewBox support into RenderLayer).
EWS
Comment 6
2022-07-20 02:03:53 PDT
Committed
252643@main
(c6915835241e): <
https://commits.webkit.org/252643@main
> Reviewed commits have been landed. Closing PR #1623 and removing active labels.
Note
You need to
log in
before you can comment on or make changes to this bug.
Top of Page
Format For Printing
XML
Clone This Bug