fix: arrow bugs
This commit is contained in:
parent
e6a1c30410
commit
196299db50
60
src/arrow.js
60
src/arrow.js
@ -21,64 +21,73 @@ export default class Arrow {
|
||||
while (condition()) {
|
||||
start_x -= 10;
|
||||
}
|
||||
start_x -= 10;
|
||||
|
||||
const start_y =
|
||||
let start_y =
|
||||
this.gantt.config.header_height +
|
||||
this.gantt.options.bar_height +
|
||||
(this.gantt.options.padding + this.gantt.options.bar_height) *
|
||||
this.from_task.task._index +
|
||||
this.gantt.options.padding;
|
||||
this.gantt.options.padding / 2;
|
||||
|
||||
const end_x =
|
||||
this.to_task.$bar.getX() - this.gantt.options.padding / 2 - 7;
|
||||
const end_y =
|
||||
let end_x = this.to_task.$bar.getX() - 13;
|
||||
let end_y =
|
||||
this.gantt.config.header_height +
|
||||
this.gantt.options.bar_height / 2 +
|
||||
(this.gantt.options.padding + this.gantt.options.bar_height) *
|
||||
this.to_task.task._index +
|
||||
this.gantt.options.padding;
|
||||
this.gantt.options.padding / 2;
|
||||
|
||||
const from_is_below_to =
|
||||
this.from_task.task._index > this.to_task.task._index;
|
||||
const curve = this.gantt.options.arrow_curve;
|
||||
const clockwise = from_is_below_to ? 1 : 0;
|
||||
const curve_y = from_is_below_to ? -curve : curve;
|
||||
const offset = from_is_below_to
|
||||
? end_y + this.gantt.options.arrow_curve
|
||||
: end_y - this.gantt.options.arrow_curve;
|
||||
|
||||
this.path = `
|
||||
M ${start_x} ${start_y}
|
||||
V ${offset}
|
||||
a ${curve} ${curve} 0 0 ${clockwise} ${curve} ${curve_y}
|
||||
L ${end_x} ${end_y}
|
||||
m -5 -5
|
||||
l 5 5
|
||||
l -5 5`;
|
||||
let curve = this.gantt.options.arrow_curve;
|
||||
const clockwise = from_is_below_to ? 1 : 0;
|
||||
let curve_y = from_is_below_to ? -curve : curve;
|
||||
|
||||
if (
|
||||
this.to_task.$bar.getX() <
|
||||
this.to_task.$bar.getX() <=
|
||||
this.from_task.$bar.getX() + this.gantt.options.padding
|
||||
) {
|
||||
const down_1 = this.gantt.options.padding / 2 - curve;
|
||||
let down_1 = this.gantt.options.padding / 2 - curve;
|
||||
if (down_1 < 0) {
|
||||
down_1 = 0;
|
||||
curve = this.gantt.options.padding / 2;
|
||||
curve_y = from_is_below_to ? -curve : curve;
|
||||
}
|
||||
const down_2 =
|
||||
this.to_task.$bar.getY() +
|
||||
this.to_task.$bar.getHeight() / 2 -
|
||||
curve_y;
|
||||
const left = this.to_task.$bar.getX() - this.gantt.options.padding;
|
||||
|
||||
this.path = `
|
||||
M ${start_x} ${start_y}
|
||||
v ${down_1}
|
||||
a ${curve} ${curve} 0 0 1 -${curve} ${curve}
|
||||
a ${curve} ${curve} 0 0 1 ${-curve} ${curve}
|
||||
H ${left}
|
||||
a ${curve} ${curve} 0 0 ${clockwise} -${curve} ${curve_y}
|
||||
a ${curve} ${curve} 0 0 ${clockwise} ${-curve} ${curve_y}
|
||||
V ${down_2}
|
||||
a ${curve} ${curve} 0 0 ${clockwise} ${curve} ${curve_y}
|
||||
L ${end_x} ${end_y}
|
||||
m -5 -5
|
||||
l 5 5
|
||||
l -5 5`;
|
||||
|
||||
console.log(down_1, down_2, curve);
|
||||
console.log(this.path);
|
||||
} else {
|
||||
if (end_x < start_x + curve) curve = end_x - start_x;
|
||||
|
||||
let offset = from_is_below_to ? end_y + curve : end_y - curve;
|
||||
|
||||
this.path = `
|
||||
M ${start_x} ${start_y}
|
||||
V ${offset}
|
||||
a ${curve} ${curve} 0 0 ${clockwise} ${curve} ${curve}
|
||||
L ${end_x} ${end_y}
|
||||
m -5 -5
|
||||
l 5 5
|
||||
l -5 5`;
|
||||
}
|
||||
}
|
||||
|
||||
@ -88,7 +97,6 @@ export default class Arrow {
|
||||
'data-from': this.from_task.task.id,
|
||||
'data-to': this.to_task.task.id,
|
||||
});
|
||||
console.log(this.element);
|
||||
}
|
||||
|
||||
update() {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user