Question

我想使用KineticJS制作路径，但我有一个问题。这是我的代码：

    var trail10 = new Kinetic.Path({
    x: 372,
    y: 218,
    stroke: 'red',
    data: 'm 1075.3372,222.72294 c 1.8761,1.54857 3.7371,4.02875 4.8404,6.93557 1.1033,2.90681 1.449,6.24026 0.2945,9.49534 -2.5903,7.30343 -1.2364,8.84378 0.4803,10.17292 1.7167,1.32913 3.7961,2.44706 2.6568,8.90567 -0.8579,4.86386 3.8676,5.46515 7.1173,8.32606 0.8124,0.71523 1.5326,1.57168 2.0502,2.67127 0.5177,1.09959 0.8328,2.44231 0.8351,4.13008 0,1.68777 -2.9933,3.21714 -5.0695,5.44519 -2.0761,2.22805 -3.233,5.15477 0.4467,9.63722 3.6162,4.40502 8.7494,4.61048 -2.0639,13.92744 -7.5383,6.49517 15.042,10.55784 7.8783,17.51621 -7.8043,7.30074 -11.0829,8.12632 0.1939,14.27623 5.9293,7 -11.057,7.00788 -5.2282,12.36387 3.9955,3.34625 10.6939,6.35464 8.055,10.53019 l -2.4058,4.31991 c -15.7303,14.0028 20.5938,10.72628 1.3989,25.67643 -7.8499,7.65593 25.499,11.82405 3.3562,23.28387'
})

不幸的道路不能使用这些数据，尽管它可以与其他人合作：M12.582,9.551C3.251,16.237,0.921,29.021,7.08,38.564l-2.36,1.689l4.893,2.262l4.893,2.262l-0.568-5.36l-0.567-5.359l-2.365,1.694c-4.657-7.375-2.83-17.185,4.352-22.33c7.451-5.338,17.817-3.625,23.156,3.824c5.337,7.449,3.625,17.813-3.821,23.152l2.857,3.988c9.617-6.893,11.827-20.277,4.935-29.896C35.591,4.87,22.204,2.658,12.582,9.551z

我不知道出了什么问题。 SVG数据字符串是使用InkScape创建的。

Answer 1

代码中显示的数据看起来不正确。

在InkScape中，打开XML编辑器并复制＆lt; svg：path＆gt;的“d”值。这为您提供了看起来像工作的数据。

这对我有用。希望这会有所帮助。

Kinetic.Path（）中的SVG数据问题

1 个答案: