Replies: 2 comments
-
I tried to add pathSvgEl.addEventListener('pointerdown', listener); to |
Beta Was this translation helpful? Give feedback.
0 replies
-
I suggest this solution: <g data-templ="path">
<circle r="13" stroke="#1c1c1c" stroke-width="0.1" />
<path
d="M0 0"
stroke="#cecece"
stroke-width="1.8"
fill="none"
style="pointer-events: none"
></path>
</g> and update the circle location in svg-path.js. And I attach an onclick event on the _update(positionStart = this._start.position, positionEnd = this._end.position) {
const value = SvgPath._calcDAttr(10, this._start, this._end)
const path = this.svgEl.getElementsByTagName('path')[0] as SVGPathElement
path.setAttribute('d', value)
const circle = this.svgEl.getElementsByTagName('circle')[0] as SVGCircleElement
const x = Math.abs(positionStart.x - positionEnd.x) / 2 + Math.min(positionStart.x, positionEnd.x)
circle.setAttribute('cx', `${x}px`)
const y = Math.abs(positionStart.y - positionEnd.y) / 2 + Math.min(positionStart.y, positionEnd.y)
circle.setAttribute('cy', `${y}px`)
this.svgEl.onclick = (e) => {
e.preventDefault();
console.log(e)
}
} |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Is there a way to catch an event when the user click on a connector? (the line between 2 shapes)
Beta Was this translation helpful? Give feedback.
All reactions