search

retejs / connection-plugin

https://retejs.org
MIT License
15 stars 36 forks source link

I have a connection problem #11

Closed saalaus closed 5 years ago

saalaus commented 5 years ago

I have a connection problem. What caused this to happen?

I noticed that everything is fine in the browser Firefox, and in a browser Google Chrome like this: image

Ni55aN commented 5 years ago

What versions of rete and rete-connection-plugin are you using?

saalaus commented 5 years ago

Final version

Ni55aN commented 5 years ago

Cannot reproduce on https://codepen.io/Ni55aN/pen/xzgQYq Can you share an example on codesandbox/jsfiddle?

saalaus commented 5 years ago

if i use 0.2.1 version connection plugin,then everything is fine

Ni55aN commented 5 years ago

Does the

.connection {
 width: auto;
 height: auto;
}

fix it?

saalaus commented 5 years ago

yes, thanks

Ni55aN commented 5 years ago

It's quite strange behavior. The SVG container for each connection takes up some space and interferes with a click on comments (comment-plugin).

The solution was to reduce its sizes to 1px, but then on the webkit the internal paths were displayed incorrectly. The next solution is to increase the size to 12px, and then everything was displayed correctly.

Can you show what styles svg accepts for connections in devtools?

saalaus commented 5 years ago

image image

Ni55aN commented 5 years ago

Is there the same issue at https://codepen.io/Ni55aN/pen/xzgQYq from your side?

saalaus commented 5 years ago

No

Ni55aN commented 5 years ago

The next solution is to increase the size to 12px, and then everything was displayed correctly.

https://github.com/retejs/connection-plugin/commit/ce25976913c9fec679403cace4fddf6730f08cab

Ni55aN commented 5 years ago

Starting with v0.4.5 the issue with displaying and extra occupied area has been fixed:

  1. width and height of SVG are 1px, now it doesn't overlap other elements
  2. added a "magical" position: absolute that fixes a position of when SVG size is very small. Details