jsplumb / community-edition

The community edition of jsPlumb, versions 1.x - 6.x
https://jsplumbtoolkit.com
Other
237 stars 22 forks source link

Overlap between arrows and connectors #7

Open jimrandomh opened 11 years ago

jimrandomh commented 11 years ago

I want to make a bezier connector with an arrow on the end, with the point of the arrow touching the target window and a relatively thick line. This is a fairly common thing in box-and-arrow figures.

Currently, the connector line goes all the way to the edge of the window it's connected to, which means that it's visible underneath the tip of the arrow, where it's narrower than the line. What should happen instead, is that the connector's line stops somewhere underneath the thick section of the arrow, giving it a sharp point.

The flowchart connector type has a "gap" option which almost (but doesn't quite) solve this problem. (It would if the overlay ignored the gap, but it doesn't). Currently there's no similar option for bezier. So one fix would be to add a similar option that only affects the paint style, like "drawGap", to both connector types. A solution that's slightly more confusing, but which would save people from having to override those defaults, would be to make it a property of the overlay: when location is 0 or 1, it adds a gap to that side.

Discussions of this issue on the mailing list: https://groups.google.com/forum/?fromgroups#!topic/jsplumb/PiEyVbqUwRc https://groups.google.com/forum/?fromgroups#!topic/jsplumb/gpPI2plnZKw

sporritt commented 11 years ago

yes so as i probably said in that discussion, the reason this occurs is that overlays and connectors are independent. but it's definitely a problem. i quite like the idea of an overlay at location 0 or 1 ignoring the connector's gap, although it still leaves a little manual work for the user to do. In the ideal world the connector would figure out where it needed to stop in order to not mess with the arrow overlay. But since overlays can be of any form, in theory any code that attempted to do this calculation would have to take the shape of the overlay into account, which sounds like a lot of maths and probably not awesome for performance.

how about i make overlays ignore the gap if their location is 1 or 0, and then add an ignoreGap property to overlays, whose default value is true? would that work for you? it seems to me this would probably mean that the most common case was also the one that required the least configuration, which is kind of what a good API should offer, really...

adding a gap property to Bezier is something I plan to do but haven't got around to it yet.

pandalion commented 10 years ago

@sporritt Have you got any further on this issue?

I am trying to replicate a design with quite a thick line and small PlainArrow, like this

image

As you can see it really appears ugly with there being no gap between the line and arrow head. Do you know of any way I can fix this for now? Thanks!

sporritt commented 10 years ago

sorry, no, i haven't looked at this recently.

pandalion commented 10 years ago

@sporritt do you know if there's some way around it that I can do myself in the meantime?

sporritt commented 10 years ago

no, sorry. i think the discussions have a few suggestions but ultimately the guy who was asking for it decided it couldn't be done. i haven't got the time to look at this right now.

4leem commented 6 years ago

@sporritt Is the gap property to Bezier available now ? or any workaround for it?

sporritt commented 6 years ago

no i dont think that ever made it in.

promiseMIMI commented 2 years ago

Is there a solution now?

garmin21 commented 6 months ago

Is there a solution now?

garmin21 commented 6 months ago

@sporritt您知道有什么方法可以解决吗?

I have the same problem. Have you solved it?