arnehilmann / markdeck

presentations as code - author cool slide decks, text-only, offline-ready, collaborative
https://arnehilmann.github.io/markdeck/
MIT License
1.25k stars 38 forks source link

a2sketch node limit #12

Closed gerald1248 closed 5 years ago

gerald1248 commented 5 years ago

The number of lines in a2sketch drawings seems to hit a limit in Chrome and thus the PDF output. (See sample slides.md at end.)

If the issue is the number of SVG nodes permitted in a single document - could the number of lines be configurable? If the precision value is increased, one or two lines for each edge might be enough for some drawings? If that's not possible - much though I prefer SVG, a PNG output might solve the problem?

I'm not sure BTW that this issue is about the number of nodes. I just know it's reproducible and means my decks only work in Firefox at the moment - and not in PDF.

In the following file, the fourth a2sketch drawing is the first that lacks arrow tips (although they are of course present in the rendered image).

Apologies for overlong sample document...



title: mytitle pdf: myfile.pdf slideNumber: true controls: false transition: slide backgroundTransition: fade

A2SKETCH

#--------------------.           #---------------------.
|                    |           |                     |
| Git                |   Push    | Docker build        |
|                    +---------->+                     |
|                    |           |                     |
|                    |           |                     |
'--------------------#           '----------+----------#
                                            ^
                                            | watch
                                 #----------+----------.
                                 |                     |
                                 | Flux                |
                                 |                     |
                                 |                     |
                                 |                     |
                                 '----------+----------#
                                            |
                                            v trigger
                                 #----------+----------.            #-----------------.
                                 |                     |            |                 |
                                 | Helm                | deploy     | Service         |
                                 |                     +----------->+                 |
                                 |                     |            |                 |
                                 |                     |            |                 |
                                 '---------------------#            '-----------------#

A2SKETCH 2nd

#--------------------.           #---------------------.
|                    |           |                     |
| Git                |   Push    | Docker build        |
|                    +---------->+                     |
|                    |           |                     |
|                    |           |                     |
'--------------------#           '----------+----------#
                                            ^
                                            | watch
                                 #----------+----------.
                                 |                     |
                                 | Flux                |
                                 |                     |
                                 |                     |
                                 |                     |
                                 '----------+----------#
                                            |
                                            v trigger
                                 #----------+----------.            #-----------------.
                                 |                     |            |                 |
                                 | Helm                | deploy     | Service         |
                                 |                     +----------->+                 |
                                 |                     |            |                 |
                                 |                     |            |                 |
                                 '---------------------#            '-----------------#

A2SKETCH 3rd

#--------------------.           #---------------------.
|                    |           |                     |
| Git                |   Push    | Docker build        |
|                    +---------->+                     |
|                    |           |                     |
|                    |           |                     |
'--------------------#           '----------+----------#
                                            ^
                                            | watch
                                 #----------+----------.
                                 |                     |
                                 | Flux                |
                                 |                     |
                                 |                     |
                                 |                     |
                                 '----------+----------#
                                            |
                                            v trigger
                                 #----------+----------.            #-----------------.
                                 |                     |            |                 |
                                 | Helm                | deploy     | Service         |
                                 |                     +----------->+                 |
                                 |                     |            |                 |
                                 |                     |            |                 |
                                 '---------------------#            '-----------------#

A2SKETCH 4th

#--------------------.           #---------------------.
|                    |           |                     |
| Git                |   Push    | Docker build        |
|                    +---------->+                     |
|                    |           |                     |
|                    |           |                     |
'--------------------#           '----------+----------#
                                            ^
                                            | watch
                                 #----------+----------.
                                 |                     |
                                 | Flux                |
                                 |                     |
                                 |                     |
                                 |                     |
                                 '----------+----------#
                                            |
                                            v trigger
                                 #----------+----------.            #-----------------.
                                 |                     |            |                 |
                                 | Helm                | deploy     | Service         |
                                 |                     +----------->+                 |
                                 |                     |            |                 |
                                 |                     |            |                 |
                                 '---------------------#            '-----------------#
arnehilmann commented 5 years ago

Now this gets interesting... to make sure that we are all on the same page (deck?), I added all my test files to this gist.

My findings so far:

  1. chrome "forgets" the arrows on slide 5 and 6, both live and when rendering the pdf
  2. with safari, rendering works as expected
  3. when referencing the svg directly via html tag (slide six), the arrows get displayed in all tested scenarios. 3a. unfortunately the xkcd font does not work, because the svg is no longer part of the main document and thus cannot access its font declarations.

Possible solutions: a. do not inline svgs a.1 caveat 1: a2sketch needs another parameter specifying the font file to use. a.2 caveat 2: one cannot style svgs with css. b. increase memory limit for chrome (Until now, I couldn't find one similar report about such svg issues anywhere)

solution a) seems more promising, but has some drawbacks... perhaps someone else finds some hints for solution b), too?!

arnehilmann commented 5 years ago

I just found out, that there might be a problem wit duplicate ids in the generated html: every a2sketch image has id for nearly every g, text, ... element, for example "id=Pointer". When changing this id to "id=Pointer1" and reference it in the line part of the svg, the arrow suddenly gets plotted.

So, solution b) is not an option, I thing... but there is another possible solution: c. a2sketch converts ids of svg elements in unique ids (somehow)

gerald1248 commented 5 years ago

Yes the IDs are the most likely reason this is happening (and also why the arrows in particular seem to be affected). It's great news too, because a low, hard limit on SVG paths would be a much harder nut to crack...

On Sun, 20 Jan 2019, 15:32 Arne Hilmann <notifications@github.com wrote:

I just found out, that there might be a problem wit duplicate ids in the generated html: every a2sketch image has id for nearly every g, text, ... element, for example "id=Pointer". When changing this id to "id=Pointer1" and reference it in the line part of the svg, the arrow suddenly gets plotted.

So, solution b) is not an option, I thing... but there is another possible solution: c. a2sketch converts ids of svg elements in unique ids (somehow)

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/arnehilmann/markdeck/issues/12#issuecomment-455875978, or mute the thread https://github.com/notifications/unsubscribe-auth/AAtiwA42QE26O2x8j96-u3HRkGwFfKL7ks5vFIwBgaJpZM4aIb-y .

arnehilmann commented 5 years ago

Please give a2sketch:0.12 a try...

gerald1248 commented 5 years ago

YES it works perfectly, thanks! Pointer-pqup7rit43 was just the way to fix it.

arnehilmann commented 5 years ago

Snap: the new id-rewrite mechanism in 0:12 works when including different svgs, but it still results in same ids when including the exactly same graphics again and again (like in your showcase).

how likely is it to include the same graphics multiple times?

gerald1248 commented 5 years ago

Never - that's an edge case you shouldn't have to support :)

On Tue, 22 Jan 2019, 10:33 Arne Hilmann <notifications@github.com wrote:

Snap: the new id-rewrite mechanism in 0:12 works when including different svgs, but it still results in same ids when including the exactly same graphics again and again (like in your showcase).

how likely is it to include the same graphics multiple times?

— You are receiving this because you modified the open/close state. Reply to this email directly, view it on GitHub https://github.com/arnehilmann/markdeck/issues/12#issuecomment-456350708, or mute the thread https://github.com/notifications/unsubscribe-auth/AAtiwGKpSmW2GAJo7QS-iLQcLe3PTDqIks5vFuj8gaJpZM4aIb-y .