[Seaside] SVG design questions

Philippe Marschall philippe.marschall at gmail.com
Thu Apr 10 04:52:05 UTC 2008


2008/4/9, Holger Kleinsorgen <kleinsor at smallish.org>:
> Hello,
>
>  after the recent discussion I've played a bit with creating SVG  on the fly
> (tags, not pixels ;), and immediately stumbled on some design questions
> (surprise). Because I haven't very much Seaside experience, I'd be happy for
> some input/corrections/insights. Aas reward, I would be happy to publish the
> stuff once it's done and desired ;)
>
>  Canvas
>  ------
>  The first issue is the canvas. Subclassing the existing canvas seems to be
> a bad idea:
>  - SVG has an extensive set of tags. Combining this with the extensive set
> of HTML tags will end up in one large bulky mess
>  - the SVG anchor has the same tag as the HTML anchor, but requires the
> xlink namespace for the href attribute, so it requires a different anchor
> brush
>  - SVG and HTML cannot be freely mixed, so it's not necessary to combine the
> both in a single class.
>
>  Currently, I've subclassed WACanvas, not WARenderCanvas. Rendering inlined
> SVG will require switching the canvas. Currently I see no problems here, but
> maybe I'm wrong.
>
>  Inlining
>  --------
>  Another issue is inlining SVG vs. separate SVG documents. Quite often I've
> seen some caveats about inlining SVG (e.g. see
> http://wiki.svg.org/Inline_SVG). On the other hand, I see some disadvantages
>  - not part of the DOM, contents cannot be accessed by javascript functions
> of the HTML document
>  - rendering a separate SVG document within the context (session, callbacks,
> continuations) of the Seaside component is a bit tricky
>
>  Embedding with <object>
>  -----------------------
>  I've tried to implement rendering of external SVG documents that are
> included as <object> in the HTML document, and kind of succeeded:
>
>  http://www.smallish.org:7777/seaside/SVG/example
>
>  However, I'm pretty sure the hacks to make this possible will make seasoned
> Seasiders vomit ;) (if someone is interested in the gory details, I can
> write more about this).
>
>  I'm just a bit unsure if this effort is really necessary.
>
>  Drawing SVG in WAComponents
>  ---------------------------
>  Due to the decision to use separate Canvas classes, I've introduced
> separate rendering method, #drawWithContext: / #drawContentOn:, which
> correspond to #renderWithContext: / #renderContentOn:.
>
>  So a component can render HTML as usual, and somewhere in the rendering
> code call
>    "canvas renderExternalSVG: self"
>    (or #renderInlinedSVG:)
>
>  which will ultimately invoke #drawContentOn:.
>  #drawContentOn: receives an SVG canvas.
>
>
>  SomeSVGComponent>>renderContentOn: canvas
>    ...
>    canvas renderExternalSVG: self.
>    ...
>
>  SomeSVGComponent>>drawContentOn: svg
>    svg rect
>       width: 100;
>       height: 100;
>       fill: 'rgb(220,220,220)';
>       ....

Just a side note here. Wherever possible we tried to avoid the C-ish
names of html elements in Seaside and used full names instead. So
instead of #img we name #image. Here this would mean #rectangle
instead of #rect.

Cheers
Philippe


More information about the seaside mailing list