Closed 1001ruchka closed 5 months ago
I took a closer look. The arrows are not displayed backwards, they are simply not parallel to the line, and since the arrow is triangular there is an illusion that it is directed in the opposite direction. For straight lines, the direction of the arrow must be parallel to the route line.
In the plugin https://github.com/michaellw/Obsidian-Canvas-Style-Menu the arrow part of the code is implemented as follows:
if (propertyValue === "cs-line-straight") {
const displayPath = this.lineGroupEl.querySelector(".canvas-display-path");
const interactionPath = this.lineGroupEl.querySelector(".canvas-interaction-path");
displayPath.setAttribute("d", linePath);
interactionPath.setAttribute("d", linePath);
if (this.toLineEnd && !this.fromLineEnd) {
const toNewTransform = this.toLineEnd.el.style.transform.replace(/rotate\([-\d]+deg\)/, `rotate(${toRotateAngle}deg)`);
this.toLineEnd.el.style.transform = toNewTransform;
}
if (this.fromLineEnd) {
const fromNewTransform = this.fromLineEnd.el.style.transform.replace(/rotate\([-\d]+deg\)/, `rotate(${fromRotateAngle}deg)`);
const toNewTransform = this.toLineEnd.el.style.transform.replace(/rotate\([-\d]+deg\)/, `rotate(${toRotateAngle}deg)`);
this.fromLineEnd.el.style.transform = fromNewTransform;
this.toLineEnd.el.style.transform = toNewTransform;
}
}
Added an option to rotate the arrows in version 3.0.0
(currently pre-release)
The arrows are displayed backwards in direct edge path route.
Other edge path route do not have this problem.