SVG使用部分边框/描边

Question

3

我正在使用SVG / D3创建由'rect'元素组成的图表。

如何为每个矩形添加一个特定的边框/描边（仅在矩形的顶部）是最佳方法？

谢谢

- OriWei

你是指类似于dasharray属性吗？ - undefined

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- nrabinowitz · Accepted Answer

我认为SVG不支持仅描边矩形或路径的部分区域-描边不像CSS边框。你可以选择一些其他选项，但需要额外的工作：

描边整个rect并应用clipPath来移除另外的三条边缘-最好让矩形比实际需要的大。
对每个rect应用线性渐变填充，使用渐变定义在形状顶部显示一个“边框”。
添加单独的line元素作为每个rect的边框。
使用stroke-dasharray属性 (文档) 设置破折号定义，其中“虚线”仅覆盖rect的顶部。这可能有些棘手，但我认为它不太难，因为描边可能从形状的左上角开始。