Some elements always display in top left corner


I have been using the online modeler (at, and notice the following unusual behavior consistently whenever an existing BPMN file is opened.

Certain elements of a BPMN process diagram (start and end elements, timers, gateways, etc.) are always displayed at the top left corner, disconnected from the rest of the diagram (which is otherwise correctly rendered). The paths leading to and from these elements are also positioned correctly - leaving just enough space for the missing element.

The same behavior is seen when the online modeler is used to (1) create a new BPMN diagram, then (2) download it, and finally to (3) reopen the saved file. Example views of a newly created process, and a saved and subsequently reopened process are attached below.

What am I missing?

Thank you for any help or hints.

Newly Created and Downloaded Process

Reopened BPMN File


You’re using Chrome?

If that is the case, this issue is related to bpmn-io/bpmn-js#671. Chrome broke the SVG rendering with version 57. We work around this with a patch release of bpmn-js.

Should work in a bit once the demo is updated.


Yes, I am using Chrome.

Thank you for your mail and the link to the earlier report.