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
Uh oh!
There was an error while loading. Please reload this page.
-
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