Modeler colors XML example

Hi! Could you please provide an example of colored diagram with XML is setted like in this tutorial:

var bpmnModeler = …;
var modeling = bpmnModeler.get(‘modeling’);

var elementsToColor = [ element1, element2 ];

modeling.setColor(elementsToColor, {
stroke: ‘green’,
fill: ‘yellow’
});

https://bpmn.io/blog/posts/2016-colors-bpmn-js.html

Аctually there is an example of diagram in this article, but I haven’t found existing code in the source of it.

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

There’s no need of sharing any code I’d say, I’m just looking for an example of XML with colors has been set globally as in the link mention above.

Did you see that there was an example diagram attached to the blog post you mention? https://bpmn.io/assets/attachments/blog/2016/colors.bpmn

It includes the XML representation of the used diagram. You’ll also find the coloring information inside the DI part (cf. bioc:stroke and bioc:fill properties), e.g.

<bpmndi:BPMNShape id="Task_0swze92_di" bpmnElement="Task_0swze92" bioc:stroke="#1E88E5" bioc:fill="#BBDEFB">
   <dc:Bounds x="182" y="43" width="100" height="80" />
</bpmndi:BPMNShape>

Yes I saw the example and I’ve already uded bioc:stroke and bioc:fill properties to change certain elements color, but now I’m trying to set default elements colors without changing bioc properties, in order to get needed color just after placing an element from elements panel.

The goal in general is to get for example these colors as default, right after modeler has been launched.

Dear @Niklas_Kiefer is that possible somehow? Thanks.

You’re probably looking for this: https://bpmn.io/blog/posts/2018-bpmn-js-2-1-0.html

Yea, thanks philippfromme! Could you please give a cue, is it possible to implement these options in Modeler without deploying bpmn-js?

What do you mean by that?

Silly question, but is there any way to use bpmJs.get('modeling') for Viewer?

No, modeling is a module which the Modeler is using, not the Viewer.