Custom shape doesnot have x,y,width and height property

Custom shape doesnot have there properties in xml file, like this:
<omgdc:Bounds />

<omgdc:Bounds x=“582” y=“82” width=“36” height=“36” />

I checked the object and find they have different businessObject structure.
normal element’s bussinessObject:
“$type”: “bpmn:BusinessRuleTask”,
“id”: “BusinessRuleTask_2”,
“name”: “审核失败”,
“di”: {
“$type”: “bpmndi:BPMNShape”,
“bounds”: {
“$type”: “dc:Bounds”,
“x”: 350,
“y”: 260,
“width”: 100,
“height”: 80
“id”: “BusinessRuleTask_2_di”,
“x”: 350

custom element’s bussnessObject is:
“type”: “custom:button”,
“id”: “Flow_00c7khr-CustomButton”,
“x”: 450,
“y”: 300,
“width”: 30,
“height”: 30,
“name”: “+”,
“di”: {
“$type”: “bpmndi:BPMNShape”,
“bounds”: {
“$type”: “dc:Bounds”
“id”: “Flow_00c7khr-CustomButton_di”,

CustomModeler.prototype.addCustomShape = function(customElement) {


const canvas = this.get('canvas');

const elementFactory = this.get('elementFactory');

const customAttrs = assign({businessObject: customElement}, customElement);

const customShape = elementFactory.create('shape', customAttrs);

return canvas.addShape(customShape);


how to fixed this?

The code snippet you posted is not formatted correctly. To share code examples that illustrate your problem, please adhere to the following rules:

  • Do not post screenshots of your code
  • Focus your snippets on the few lines that matter for the topic at hand
  • Format your code

Please update your post according to these rules. We may not be able to help you otherwise. In extreme cases we may also close your topic if we regard it as spam.

Hint: To share complete setups, create and link a CodeSandbox. This way, we can inspect the problem at hand in action and, thus, can help you in a timely and more effective manner.

Thanks :heart: