Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Arrows not shown in BPMN diagrams #165

Closed
janwesterkamp opened this issue Jun 11, 2024 · 6 comments
Closed

Arrows not shown in BPMN diagrams #165

janwesterkamp opened this issue Jun 11, 2024 · 6 comments

Comments

@janwesterkamp
Copy link

BPMN drawings do not show arrows in their connections, only lines are visible in PDF version, where prawn-svg is used for this task.

The SVGs generated from Asciidoctor(J) Diagram shows the arrows and so the simultaneously created HTML version shows them in the correct way too, as tooling like the Camunda Modeler or Eclipse IDE does.

BPMN source example:
bpmn-example.bpmn.zip

SVG generated:
bpmn-example

PDF generated with error:
BPMN error.pdf

Environment:

macOS Intel 14.5 (23F79)
Java SE 21.0.3
JRuby 9.4.7.0
Maven 3.9.7
Asciidoctor Maven Plugin 3.0.0
AsciidoctorJ 2.5.13
AsciidoctorJ Diagram 2.3.0
AsciidoctorJ PDF 2.3.17
bmnn-js 10.2.1
bpmn-js-cmd 0.4.0

This issue was created originally in asciidoctor/asciidoctorj-pdf (asciidoctor/asciidoctorj-pdf#105) and then analysed in asciidoctor/asciidoctor-pdf (asciidoctor/asciidoctor-pdf#2526) too, where it turned out, that the root cause is here in prawn-svg.

It looks like the SVG marker type is not handled correctly in this use case. Can you confirm and fix it, please?

@janwesterkamp
Copy link
Author

janwesterkamp commented Jun 12, 2024

My further analysis of this issue shows some differences in the SVG elements being used as output of in different diagram types with asciidoctor(j)-diagram, where the arrows are shown correctly:

PlantUML:
plantuml-example

ditaa:
ditaa-example

In ditaa arrows are shown, but shadows are missing in the prawn-svg rendering.
The PlantUML rendering is shown correctly. When looking in the SVG source, these two do not make use of marker-elements and it looks like a url is part of the shadow definition in the ditaa example. The BPMN example makes use of the marker-element instead, including a url.
So it looks like the arrows from the SVG get rendered only, when low-level functionality like polygon-elements are used instead of higher level ones like marker (may be in combination with a url).

So may be this error is linked to the currently unsupported hyperlink feature?
If yes, should I open a separate feature request for this then?

@mogest
Copy link
Owner

mogest commented Jun 15, 2024

Hi @janwesterkamp. I've isolated what I believe the problem is down to this SVG file here:

marker2

This renders without the marker in prawn-svg.

Looking at the source, there is a problem parsing the url():

marker-end: url('#sequenceflow-end-white-black-545bkfytrdsikj6wxvup3ieim');

prawn-svg is not expecting the apostrophe (') in that url string. If you take it out, it works fine. I'll add support for quoting which I hope will fix the issue.

As a tip for writing future issues, isolating the offending problem by providing the smallest possible SVG file that demonstrates the issue is greatly appreciated!

@mogest mogest closed this as completed in 6bd9870 Jun 16, 2024
@mogest
Copy link
Owner

mogest commented Jun 16, 2024

I've pushed a fix for parsing the url() which handles quoting now, and it is rendering the first SVG you posted with arrows at the end of each line. Let me know if you find any other problems with it.

@janwesterkamp
Copy link
Author

Hi @mogest, thank you very much for your fix of this!

Regarding the other problems, there are only two little things left, that might belong to new, separate issues to be created:

I recognized that hyperlinks (with the a-element at least) are supported, but the README.md file still says they are not supported (at all):

prawn-svg does not support hyperlinks, patterns, masks or filters.

Should I create a separate issue for this documentation fix (including a small example)?

The 2nd cosmetic thing is, that other SVG resources (generated by asciidoctor(j)-diagram from PlantUML and ditaa) showing shadows that are not shown in prawn-svg renderings, which might be a result of the unsupported filter-element.
Should I create a feature request for this (with low priority)?

When you have released the new version of prawn-svg, I will ping the upstream projects asciidoctor-pdf and asciidoctorj-pdf to update their dependencies.
Again, many thanks!
Best, Jan

@mogest
Copy link
Owner

mogest commented Jun 22, 2024

Hi @janwesterkamp, hyperlinks are definitely not supported anywhere in the codebase. I just did a double check... unless it's hiding somewhere!

I don't think I will be implementing filter or any other major elements—everything remaining would be a very large project. Of course others are always welcome to contribute. It's documented that it's not supported so I don't think a new issue would be particularly useful.

I've just released a new gem now so you should be good to go!

@janwesterkamp
Copy link
Author

Hi @mogest,

here is a small example which, when rendered with asciidoctorj-pdf, asciidoctor-pdf, prawn and prawn-svg results in a working link in the resulting PDF:

07_node

It just uses a a-element and works fine - I don't know where this implemented exactly, may be it's working out of the box because it is using a standard tag for linking.
But I am very happy with the result, as this makes it possible to maintain these links inside the deployment diagrams of the software architecture documentation, which improves use and acceptance of this doc a lot.

Yes, I expected supporting filter-elements is a mayor change and it's only a cosmetic feature (as opposed to hyperlinks or missing arrows) - I can live with that limitation. :-)

Thanks a lot for the release, I will ping the upstream projects now!
Best, Jan

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants