andreaferretti / paths-js

Generate SVG paths for geometric shapes :bar_chart:
http://andreaferretti.github.io/paths-js-react-demo/
Apache License 2.0
1.72k stars 84 forks source link

Path: transformations for vline and hline commands fail #55

Closed rkalapuc closed 5 years ago

rkalapuc commented 5 years ago

Steps to reproduce:

var path = Path()
  .moveto(10, 20)
  .vlineto(30, 50)
  .hlineto(25, 28)
  .qcurveto(27, 30, 32, 27)
  .translate(10, 10)
  .closepath();

Exception:

      x: point.x * matrix[0] + point.y * matrix[2] + matrix[4],
                         ^

TypeError: Cannot read property '0' of undefined
    at C:\dev\sandbox\paths-js\dist\node\geom.js:73:26
andreaferretti commented 5 years ago

vlineto and hlineto take a single coordinate as input, since the other one is fixed. So you example should read

var path = Path()
  .moveto(10, 20)
  .vlineto(30)
  .hlineto(25)
  .qcurveto(27, 30, 32, 27)
  .translate(10, 10)
  .closepath();
rkalapuc commented 5 years ago

Thanks for a reply.

Nevertheless it will fail anyway if you try to apply transformation. The root cause is here and here - matrix is not passed to matrixTransform

andreaferretti commented 5 years ago

Good catch! There was also another mistake in that function, now it should be fine. Going to release 0.4.8