mirror of
https://github.com/RGBCube/serenity
synced 2025-07-25 05:47:35 +00:00
LibWeb: Apply SVG transform to path when painting (SVG) elements
This also combines the viewbox mapping into the same transform and reuses some code by using Path::copy_transformed() rather than manually mapping each segment of the path.
This commit is contained in:
parent
3484db0dc1
commit
cf23a2b82d
3 changed files with 27 additions and 67 deletions
|
@ -17,27 +17,6 @@ SVGGeometryBox::SVGGeometryBox(DOM::Document& document, SVG::SVGGeometryElement&
|
|||
{
|
||||
}
|
||||
|
||||
float SVGGeometryBox::viewbox_scaling() const
|
||||
{
|
||||
auto* svg_box = dom_node().first_ancestor_of_type<SVG::SVGSVGElement>();
|
||||
|
||||
if (!svg_box || !svg_box->view_box().has_value())
|
||||
return 1;
|
||||
|
||||
auto view_box = svg_box->view_box().value();
|
||||
|
||||
bool has_specified_width = svg_box->has_attribute(HTML::AttributeNames::width);
|
||||
auto specified_width = paint_box()->content_width().value();
|
||||
|
||||
bool has_specified_height = svg_box->has_attribute(HTML::AttributeNames::height);
|
||||
auto specified_height = paint_box()->content_height().value();
|
||||
|
||||
auto scale_width = has_specified_width ? specified_width / view_box.width : 1;
|
||||
auto scale_height = has_specified_height ? specified_height / view_box.height : 1;
|
||||
|
||||
return min(scale_width, scale_height);
|
||||
}
|
||||
|
||||
CSSPixelPoint SVGGeometryBox::viewbox_origin() const
|
||||
{
|
||||
auto* svg_box = dom_node().first_ancestor_of_type<SVG::SVGSVGElement>();
|
||||
|
@ -46,6 +25,28 @@ CSSPixelPoint SVGGeometryBox::viewbox_origin() const
|
|||
return { svg_box->view_box().value().min_x, svg_box->view_box().value().min_y };
|
||||
}
|
||||
|
||||
Gfx::AffineTransform SVGGeometryBox::layout_transform() const
|
||||
{
|
||||
auto& geometry_element = dom_node();
|
||||
auto transform = geometry_element.get_transform();
|
||||
auto* svg_box = geometry_element.first_ancestor_of_type<SVG::SVGSVGElement>();
|
||||
float scaling = 1;
|
||||
auto origin = viewbox_origin().to_type<float>();
|
||||
Gfx::FloatPoint paint_offset = {};
|
||||
if (svg_box && svg_box->view_box().has_value()) {
|
||||
// Note: SVGFormattingContext has already done the scaling based on the viewbox,
|
||||
// we now have to derive what it was from the original bounding box size.
|
||||
// FIXME: It would be nice if we could store the transform from layout somewhere, so we don't have to solve for it here.
|
||||
auto scaled_width = paint_box()->content_width().value();
|
||||
auto scaled_height = paint_box()->content_height().value();
|
||||
auto original_bounding_box = Gfx::AffineTransform {}.translate(-origin).multiply(transform).map(const_cast<SVG::SVGGeometryElement&>(geometry_element).get_path().bounding_box());
|
||||
scaling = min(scaled_width / original_bounding_box.width(), scaled_height / original_bounding_box.height());
|
||||
auto scaled_bounding_box = original_bounding_box.scaled(scaling, scaling);
|
||||
paint_offset = (paint_box()->absolute_rect().location() - svg_box->paint_box()->absolute_rect().location()).to_type<float>() - scaled_bounding_box.location();
|
||||
}
|
||||
return Gfx::AffineTransform {}.translate(paint_offset).scale(scaling, scaling).translate(-origin).multiply(transform);
|
||||
}
|
||||
|
||||
JS::GCPtr<Painting::Paintable> SVGGeometryBox::create_paintable() const
|
||||
{
|
||||
return Painting::SVGGeometryPaintable::create(*this);
|
||||
|
|
|
@ -21,12 +21,13 @@ public:
|
|||
SVG::SVGGeometryElement& dom_node() { return static_cast<SVG::SVGGeometryElement&>(SVGGraphicsBox::dom_node()); }
|
||||
SVG::SVGGeometryElement const& dom_node() const { return static_cast<SVG::SVGGeometryElement const&>(SVGGraphicsBox::dom_node()); }
|
||||
|
||||
float viewbox_scaling() const;
|
||||
CSSPixelPoint viewbox_origin() const;
|
||||
Gfx::AffineTransform layout_transform() const;
|
||||
|
||||
virtual JS::GCPtr<Painting::Paintable> create_paintable() const override;
|
||||
|
||||
private:
|
||||
CSSPixelPoint viewbox_origin() const;
|
||||
|
||||
virtual bool is_svg_geometry_box() const final { return true; }
|
||||
};
|
||||
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
/*
|
||||
* Copyright (c) 2018-2022, Andreas Kling <kling@serenityos.org>
|
||||
* Copyright (c) 2023, MacDue <macdue@dueutil.tech>
|
||||
*
|
||||
* SPDX-License-Identifier: BSD-2-Clause
|
||||
*/
|
||||
|
@ -49,50 +50,7 @@ void SVGGeometryPaintable::paint(PaintContext& context, PaintPhase phase) const
|
|||
|
||||
context.painter().add_clip_rect(context.enclosing_device_rect(absolute_rect()).to_type<int>());
|
||||
|
||||
Gfx::Path path = const_cast<SVG::SVGGeometryElement&>(geometry_element).get_path();
|
||||
|
||||
if (maybe_view_box.has_value()) {
|
||||
Gfx::Path new_path;
|
||||
auto scaling = layout_box().viewbox_scaling();
|
||||
auto origin = layout_box().viewbox_origin();
|
||||
|
||||
auto transform_point = [&scaling, &origin](Gfx::FloatPoint point) -> Gfx::FloatPoint {
|
||||
auto new_point = point;
|
||||
new_point.translate_by({ -origin.x(), -origin.y() });
|
||||
new_point.scale_by(scaling);
|
||||
return new_point;
|
||||
};
|
||||
|
||||
for (auto& segment : path.segments()) {
|
||||
switch (segment->type()) {
|
||||
case Gfx::Segment::Type::Invalid:
|
||||
break;
|
||||
case Gfx::Segment::Type::MoveTo:
|
||||
new_path.move_to(transform_point(segment->point()));
|
||||
break;
|
||||
case Gfx::Segment::Type::LineTo:
|
||||
new_path.line_to(transform_point(segment->point()));
|
||||
break;
|
||||
case Gfx::Segment::Type::QuadraticBezierCurveTo: {
|
||||
auto& quadratic_bezier_segment = static_cast<Gfx::QuadraticBezierCurveSegment const&>(*segment);
|
||||
new_path.quadratic_bezier_curve_to(transform_point(quadratic_bezier_segment.through()), transform_point(quadratic_bezier_segment.point()));
|
||||
break;
|
||||
}
|
||||
case Gfx::Segment::Type::CubicBezierCurveTo: {
|
||||
auto& cubic_bezier_segment = static_cast<Gfx::CubicBezierCurveSegment const&>(*segment);
|
||||
new_path.cubic_bezier_curve_to(transform_point(cubic_bezier_segment.through_0()), transform_point(cubic_bezier_segment.through_1()), transform_point(cubic_bezier_segment.point()));
|
||||
break;
|
||||
}
|
||||
case Gfx::Segment::Type::EllipticalArcTo: {
|
||||
auto& elliptical_arc_segment = static_cast<Gfx::EllipticalArcSegment const&>(*segment);
|
||||
new_path.elliptical_arc_to(transform_point(elliptical_arc_segment.point()), elliptical_arc_segment.radii().scaled_by(scaling, scaling), elliptical_arc_segment.x_axis_rotation(), elliptical_arc_segment.large_arc(), elliptical_arc_segment.sweep());
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
path = new_path;
|
||||
}
|
||||
Gfx::Path path = const_cast<SVG::SVGGeometryElement&>(geometry_element).get_path().copy_transformed(Gfx::AffineTransform {}.multiply(layout_box().layout_transform()));
|
||||
|
||||
if (auto fill_color = geometry_element.fill_color().value_or(svg_context.fill_color()); fill_color.alpha() > 0) {
|
||||
// We need to fill the path before applying the stroke, however the filled
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue