Altering or Changing the Icon for My Custom Task

For an Example if I have one Cutom Task ( Print Task )


I used custom rederer to render this type of Task.
My code for the same is

export default function CustomRenderer(
    config, eventBus, styles,
    pathMap, canvas, textRenderer) {

    pathMapData = pathMap
    // debugger;
        config, eventBus, styles,
        pathMap, canvas, textRenderer,

    var computeStyle = styles.computeStyle;

    this.drawPrintTask = function (p, d, attrs) {
        attrs = computeStyle(attrs, ['no-fill'], {
            strokeWidth: 2,
            stroke: 'black'
        // return p.path(d).attr(attrs);

        let path = svgCreate('circle');
        // svgAttr(path, { d: d });
        // svgAttr(path, attrs);

        svgAppend(p, path);

        return path;

inherits(CustomRenderer, BpmnRenderer);

CustomRenderer.prototype.canRender = function (element) {
    return /^bpmnCustom:/.test(element.type);

CustomRenderer.prototype.drawShape = function (p, element) {
    let type = element.type;

    if (type === 'bpmnCustom:PrintTask') {
        element.type = 'bpmn:Task'
        const shape = this.drawBpmnShape(p, element);

        let pathData = pathMapData.getScaledPath('TASK_TYPE_SEND', {
            xScaleFactor: 1,
            yScaleFactor: 1,
            containerWidth: 21324,
            containerHeight: 1454,
            position: {
              mx: 3.28544,
              my: 1.357

        this.drawPrintTask(p, pathData, {
            strokeWidth: 1,
            fill: 'red'


        return shape;


I tried altering draw Print Task by many ways but I am not able to get any icon over there and I end up getting simple Task effect like this

I checked these links but nothing helped.

Could you please let me know what’s the issue and what I need to update to make it work.

No one? :thinking:
I am not able to make it work properly.

Hi @yganatra ,
How do you create a custom task type like that? do you have an example?