Fabric.js: How to add border for Group Object

[MonchiLin]

Version

2.2.4

[asturur]

Group is just a container and it does not support stroke or fill.
You have to insert in the group a rect as big as the group.

[MonchiLin]

Thank you @asturur

[MonchiLin]

Do you plan to add this feature?

[asturur]

i do not think so.
Group is a container.
In We should find way to make things easier for who wants to add objects
in the group and simulate a border.
I m not sure drawing a border in groups is a good idea

Something should be discussed. What a group does and should do.

I'm pretty much full right now and this is lower priority

2018-05-18 16:03 GMT+02:00 kk [e-mail]:

Do you plan to add this feature?

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/fabricjs/fabric.js/issues/4978#issuecomment-390217466,
or mute the thread
https://github.com/notifications/unsubscribe-auth/ABI4QONihNoLT-ZJK731ydK4XBamPU80ks5tztS3gaJpZM4UEbIE
.

[MonchiLin]

@asturur Thank you for your work

[milahu]

// fabricjs group - always show border
fabric.Group.prototype.initialize = (function (initialize) {
    return function () {
        initialize.apply(this, arguments)
        // prepend rect before=behind group objects
        this._objects = [
        new fabric.Rect({
            // position from group center
            left: -0.5*this.width,
            top: -0.5*this.height,
            width: this.width,
            height: this.height,

            stroke: '#00f',
            strokeWidth: 2,
            fill: false,
        })]
        .concat(this._objects)

        // TODO repaint border on group resize event

        // TODO remove border on group destroy
    };
})(fabric.Group.prototype.initialize);