Add custom svg base 64 image for the dropped Pallate Element

[vikashsingh009]

I have able to integrate Custom Element shape on Pallate using https://github.com/bpmn-io/bpmn-js-examples/tree/master/custom-elements

i have changed .icon-custom-triangle background url from other svg shape,its show correct on pallate but when i have dropped that element it always dropped Traingle Element on convas .

so, how its possible to dropped same element which is in Pallate to convas

here is the attached screens

[philippfromme]

Just to be clear: The element on the palette and the element on the canvas are two different things. On the palette it can be anything that you can achieve using CSS (e.g. image, text). On the canvas the element is a SVG that is rendered by bpmn-js. In order to be able to render your custom element you need to specify how this element is supposed to be rendered. In the example project there is a custom renderer that knows how to render the triangle so every time a triangle is to be rendered it will take care of it.

[vikashsingh009]

Thanks @philippfromme, yes it works fine for 2 default element on diagram above

traingle and circle ,but when i am dropping 3rd custome element its showing un-known type

[vikashsingh009]

i have also add query-trigger type on below javascript file CustomContextPadProvider.js,CustomElementFactory.js,CustomRenderer.js,but still having same issue

[philippfromme]

Same problem as described in the other thread:

How to add custom Icon drop

In bpmn-js every shape and connection has a businessObject property which is the actual model element with all the business logic. The error occurs because bpmn-js is trying to create a business object for your custom element but it doesn’t know how this is supposed to look like. In the custom elements example there is a custom element factory which makes sure that for custom elements like the triangle and the circle no business objects are created. If you’d want to do that you’d have to add the…