autoPlace.append with multiple shape(expanded subProcess)


I use bpmn js and I have a question.

Can I create multiple shapes like an Expanded SubProcess through AutoPlace.append and link sequences? If yes, what is the method?

Currently, an attempt is made to append Expanded SubProcess to contextPadProvider.js through custom methode, but startEvent is not generated on the canvas.

  function appendSubAction(type, className, title, options){
    var subProcess = elementFactory.createShape({
      type: 'bpmn:SubProcess',
      x: 0,
      y: 0,
      isExpanded: true
    var startEvent = elementFactory.createShape({
      type: 'bpmn:StartEvent',
      x: 40,
      y: 82,
      parent: subProcess
    function appendStart(event, element){
      create.start(event, [subProcess, startEvent], {
        source: element,
    var append = autoPlace ? function(event, element){
      var shape = find([subProcess, startEvent], function(element) {
        return !isConnection(element);
      function isConnection(element) {
        return !!element.waypoints;
      autoPlace.append(element, shape);
    } : appendStart;

    return {
      group: 'activity',
      className: className,
      title: title,
        dragstart : appendStart,
        click: append

append Expanded Subprocess

Hi @JJangJin, welcome! In general, your shared code snippet looks good.

For further assistance, please share a CodeSandbox that reproduces your issue in a way that we can inspect it.