Why my path is getting cropped?

[ariona]

I have created a path, copied the SVG code from sketch, but when registering it to custom shape, the path is getting cropped. Am i missing something here?

class Alpha extends mojs.CustomShape {
  getShape () { return '<path d="M74.1971056,148.028719 C115.066177,148.028719 148.197106,114.89779 148.197106,74.0287188 C148.197106,33.1596473 115.066177,0.02871875 74.1971056,0.02871875 C33.3280341,0.02871875 0.197105598,33.1596473 0.197105598,74.0287188 C0.197105598,114.89779 33.3280341,148.028719 74.1971056,148.028719 Z M38,82.088 C38,75.1759654 39.1759882,68.816029 41.528,63.008 C43.8800118,57.199971 47.1679789,52.2320206 51.392,48.104 C55.6160211,43.9759794 60.6559707,40.7600115 66.512,38.456 C72.3680293,36.1519885 78.7519654,35 85.664,35 C91.3280283,35 96.2959786,35.5759942 100.568,36.728 C104.840021,37.8800058 108.367986,39.0319942 111.152,40.184 L102.08,91.304 C101.984,91.7840024 101.912,92.3359969 101.864,92.96 C101.816,93.5840031 101.792,94.2319966 101.792,94.904 C101.792,97.5920134 102.559992,99.4879945 104.096,100.592 C105.632008,101.696006 107.647988,102.248 110.144,102.248 L105.68,112.328 C100.495974,112.328 96.5360137,111.080012 93.8,108.584 C91.0639863,106.087988 89.696,102.104027 89.696,96.632 C87.0079866,101.240023 83.6240204,105.175984 79.544,108.44 C75.4639796,111.704016 70.6880274,113.336 65.216,113.336 C61.6639822,113.336 58.2560163,112.616007 54.992,111.176 C51.7279837,109.735993 48.8240127,107.672013 46.28,104.984 C43.7359873,102.295987 41.7200074,99.0080194 40.232,95.12 C38.7439926,91.2319806 38,86.888024 38,82.088 Z M96.896,47.816 C95.0719909,47.2399971 93.1760098,46.7840017 91.208,46.448 C89.2399902,46.1119983 86.8640139,45.944 84.08,45.944 C79.087975,45.944 74.5760202,46.8079914 70.544,48.536 C66.5119798,50.2640086 63.0560144,52.6639846 60.176,55.736 C57.2959856,58.8080154 55.0880077,62.4559789 53.552,66.68 C52.0159923,70.9040211 51.248,75.511975 51.248,80.504 C51.248,83.9600173 51.751995,87.0079868 52.76,89.648 C53.768005,92.2880132 55.0879918,94.5199909 56.72,96.344 C58.3520082,98.1680091 60.1999897,99.5359954 62.264,100.448 C64.3280103,101.360005 66.463989,101.816 68.672,101.816 C71.5520144,101.816 74.3119868,101.048008 76.952,99.512 C79.5920132,97.9759923 81.9679894,95.7920142 84.08,92.96 C86.1920106,90.1279858 88.0159923,86.7680194 89.552,82.88 C91.0880077,78.9919806 92.2399962,74.744023 93.008,70.136 L96.896,47.816 Z"></path>'; }
}

mojs.addShape( 'alpha', Alpha );
new mojs.Shape({ 
	shape: 'alpha',
	fill: 'none',
	stroke: 'rebeccapurple',
	strokeWidth: 5,
}).play();

And below is the result

[legomushroom]

Hi Rian!

Thanks for the issue, your shape should be inscribed in 100x100 rectangle, seems like your shape exceeds the bounds.

[ariona]

Oh, i see that's way my shape is cropped..
By the way, Is there an option for adjusting the size when defining the shape?

[legomushroom]

Sorry, forgot to attach the demo.

Nope there is no option currently probably we can have it with a low price, so I'll mark this issue as enhancement.

[ariona]

Thanks @legomushroom, it's working perfectly... demo

[legomushroom]

Oh wow, looks neat!