Use bpmn.io with camunda api to display bpmn diagram

I’m looking at this example of how to use bpmn with angular:

I wanted to use a call to the camunda api to display the diagram, such as:

apiUrl/engine-rest/process-definition/key/{key}/diagram

Is this a supported way of retrieving the image diagram file with bpmn.io?

For example:

this.bpmnJS = apiurl/xml OR apiurl/diagram

Hey,

What exactly are you trying to achieve?

Hi @drobqlarant,

the REST Api you referred:

returns an image that has to be deployed together with the process diagram xml.

BPMN.io can render the XML, which available with this API call: https://docs.camunda.org/manual/7.13/reference/rest/process-definition/get-xml/.

Hope this helps, Ingo

1 Like

I was just trying to render the BPMN file that camunda has in a seperate custom tab outside of the camunda tasklist. So i was going to call to the api to get the data, using camunda xml file as the datasource, then render it with bpmn.io.

Thanks, do you have any examples of this?

I suggest you to ask this question to the Camunda Forum, to learn about how to retrieve the XML from the Camunda Engine. Once you accomplish this you can render it with bpmn-js with the importXML API.

This forum is dedicated to bpmn.io libraries.

Thanks, i understand how to get the xml from the API, i guess its just a matter of rendering it with the link you posted. Although i also now see how there is a state in addition to the xml based on Ingo’s post above.