Segment linkTool handle customization in JJ

[MaxAng1285]

Introduction

I am using Segment linktool and I would like to customize handles's shape using circle or rect, but I am not able to modify it.

Any help with this?

Steps to reproduce

No response

Restrictions & Constraints

No response

Does your question relate to JointJS or JointJS+. Select both if applicable.

JointJS

[kumilingus]

It's similar to #2559 (reply in thread). Instead of VertexHandle you need to override the SegmentHandle.

[MaxAng1285]

Thanks, but I have some issue to get it working.

At the end, I had to use the folowing approach and it works (I can customize handle as I like):

      const segmentsTool = new joint.linkTools.Segments({
        handleClass: joint.linkTools.Segments.SegmentHandle.extend({
          tagName: 'g',
          children: [
            {
              tagName: 'line',
              selector: 'line',
              attributes: {
                stroke: '#33334F',
                'stroke-width': 2,
                fill: 'none',
                'pointer-events': 'none',
              },
            },
            {
              tagName: 'circle',
              selector: 'handle',
              attributes: {
                r: 5,
                fill: '#ffffff',
                stroke: '#000',
                'stroke-width': 1,
              },
            },
          ],
        }),

[kumilingus]

This looks good.