0

我正在尝试使笔划线具有圆形连接。为什么下面的代码不起作用？

请参阅此 JSFiddle。

$('body').svg({onLoad: function(svg){
    var path = svg.createPath();
    svg.path(
        path.move( 50, 50 )
        .line( 300, 0, true )
        .line( 0, 300, true )
        .line( -300, 0, true )
        .close(),
        {
            fill: 'none', 
            stroke: '#888', 
            strokeWidth: 30,
            strokeLinejoin: 'round'
        }
    );  
}});

根据这个 OReilly 文档，我需要的样式属性和值是stroke-linejoinand round。并根据 JQuery-SVG 文档：

在 SVG 中包含破折号 (-) 的附加设置应以驼峰式书写，不带破折号

所以我不明白为什么它不起作用。

谢谢

更新：我在这里分叉了 JSFiddle，似乎在输出 SVG XML 时，它没有将驼峰式属性转换为带有破折号的属性。现在只是想弄清楚如何纠正它。它输出的 SVG XML 是：

<svg version="1.1" width="400" height="400">
    <path d="M50,50l300,0l0,300l-300,0z" fill="none" stroke="#888" stroke-width="30"
         strokeLinejoin="round"></path>
</svg>
4

1 回答 1

0

我不得不改变：

strokeLinejoin: 'round'

至：

strokeLineJoin: 'round'
于 2013-02-27T06:29:59.217 回答