[webkit-gtk] rendering a webpage to SVG

[Ivan Klimek]

Hi Carlos,

thanks for your fast reply

not sure if this helps or if your question was addressed to me - from my
*very* limited understanding - how its done its done in Qt - they have the
qt_svg module that implements methods that directly write vectorized SVG
elements:

void drawEllipse(const QRectF &r) override;
void drawPath(const QPainterPath &path) override;
void drawPixmap(const QRectF &r, const QPixmap &pm, const QRectF &sr)
override;
void drawPolygon(const QPointF *points, int pointCount, PolygonDrawMode
mode) override;
void drawRects(const QRectF *rects, int rectCount) override;
void drawTextItem(const QPointF &pt, const QTextItem &item) override;
void drawImage(const QRectF &r, const QImage &pm, const QRectF &sr,
Qt::ImageConversionFlags flags = Qt::AutoColor) override;

see here: https://github.com/qt/qtsvg/blob/dev/src/svg/qsvggenerator.cpp

from code its used like this:

    QWebFrame *frame = m_page.mainFrame();
    QPainter painter;
    QSvgGenerator svg;

    svg.setFileName(fileName);
    svg.setSize(resolution);

    painter.begin(&svg);

    frame->render(&painter);

and that's all - output is vector SVG - every text / formatting etc all
vector

cairo is able to draw to SVG vectorized too, but the surface types need to
be set correctly when drawing, I took a very light look at webkit-gtk cairo
usage and cairo surface types are image types / aka bitmap so it draws
stuff already to bitmap, and once in bitmap there is no way back :( but
maybe I am reading this wrong, not sure

*I do not know why this is done the way it is done in webkit-gtk, maybe it
would be possible to just internally use svg surfaces?*

would be epic if webkit-gtk could do something like that as Qt Webkit is
dead and there are so many projects using this ...

Thanks
Ivan


On Fri, Aug 21, 2020 at 1:57 AM Carlos Alberto Lopez Perez <
clopez at igalia.com> wrote:

> On 20/08/2020 12:24, Ivan Klimek wrote:
> > Dear webkit-gtk developers,
> >
> > I am trying to render a webpage to SVG, I am successful in doing so
> > using Qt webkit - but as you all know Qt webkit has been discontinued
> > thus I am trying to migrate my code to webkit GTK
> >
> > the problem I am facing is that the generated SVG is only a wrapped PNG
> > image of the rendered webpage, on Qt the webpage is rendered "all
> > vector" texts etc all is "vectorized" an example of using this approach
> > are apps like: http://cutycapt.sourceforge.net/ or
> https://wkhtmltopdf.org/
> >
> > my code is as follows (parts omitted for brevity):
> >
> > g_signal_connect(main_window, "damage-event", G_CALLBACK(capture),
> > main_window);
> >
> > static gboolean capture(GtkWidget *widget, GdkEvent *event, gpointer
> > user_data)
> > {
> >
> >   fprintf(stderr, "damage event callback called..\n");
> >
> >   cairo_surface_t *surface =
> > gtk_offscreen_window_get_surface(GTK_OFFSCREEN_WINDOW(user_data));
> >
>
> Instead of getting the cairo surface from GTK, you can use the WebKitGTK
> API directly with the functions webkit_web_view_get_snapshot*
>
> Years ago I wrote a simple program that generates a png image from a
> webpage with that. Check it here: https://github.com/clopez/wksnap
>
> I tried now to use your example code to generate a svg image instead of
> a png one [1], but I'm getting the same issue you comment of it
> generating a svg image that is embedding a png one.
>
> I'm unsure how to fix that. My limited understanding is that once you
> get the cairo surface from webkit, that surface is already a bitmap
> surface.. so I'm unsure if is possible to convert that back to a vector
> surface. I wonder how QtWebKit did this??
>
>
> Hope this helps.
> Regards
>
>
> [1] test patch to apply over wksnap: http://ix.io/2uLb
>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-gtk/attachments/20200821/3a121db0/attachment.htm>