[Bug] Using ending on a curved path draws it incorrectly #625
Description
Describe the bug
Using ending on a curved path does not work. The below image shows a straight path (on left) and a curved one (on the right), with different ending percents (1, 0.75, 0.5, 0.25).
To Reproduce
Steps to reproduce the behavior:
This is the code for the above image:
import Two from 'https://cdn.skypack.dev/two.js@latest';
var two = new Two({
type: Two.Types.svg,
fullscreen: true,
autostart: true
}).appendTo(document.body);
const pathLine = new Two.Path([new Two.Anchor(50, 50), new Two.Anchor(150, 50), new Two.Anchor(150, 100)])
pathLine.noFill()
pathLine.closed = false
two.add(pathLine)
const pathLine1 = pathLine.clone()
pathLine1.position = new Two.Vector(0, 100)
pathLine1.ending = 0.75
two.add(pathLine1)
const pathLine2 = pathLine.clone()
pathLine2.position = new Two.Vector(0, 200)
pathLine2.ending = 0.5
two.add(pathLine2)
const pathLine3 = pathLine.clone()
pathLine3.position = new Two.Vector(0, 300)
pathLine3.ending = 0.25
two.add(pathLine3)
const pathCurved = pathLine.clone()
pathCurved.position = new Two.Vector(200, 0)
pathCurved.curved = true
two.add(pathCurved)
const pathCurved1 = pathCurved.clone()
pathCurved1.position = new Two.Vector(200, 100)
pathCurved1.ending = 0.75
two.add(pathCurved1)
const pathCurved2 = pathCurved.clone()
pathCurved2.position = new Two.Vector(200, 200)
pathCurved2.ending = 0.5
two.add(pathCurved2)
const pathCurved3 = pathCurved.clone()
pathCurved3.position = new Two.Vector(200, 300)
pathCurved3.ending = 0.25
two.add(pathCurved3)Expected behavior
The drawing should show a part of the curved line.
Screenshots
See above
Environment (please select one):
- Code executes in browser (e.g: using script tag to load library)
- Packaged software (e.g: ES6 imports, react, angular, vue.js)
- Running headless (usually Node.js)
Desktop (please complete the following information):
- iOS
- Chrome
- version 0.8.5
Smartphone (please complete the following information):
n/a
Additional context
Probably a workaround, by subdividing the path, seems to be working ok.
path.subdivide(5)