我正在使用 Raphaël满足我的 SVG 渲染需求。但我发现 Path 语法有点低级。
那么有没有人知道一个不错的 Javascript 包装器/库允许这样的事情:
var pathStr = move (10, 10).draw (5, 5)
var path = paper.path(pathStr)
最佳答案
强烈推荐d3.js .
创建代表六边形 的路径并将其沿每个方向移动 10px 就这么简单:
var svg = d3.select('body')
.append('svg:svg')
.attr('width', 1000)
.attr('height', 1000);
svg.append('svg:path')
.attr('d', 'M' + [
[850, 75], [958, 137.5], [958, 262.5],
[850, 325], [742, 262.6], [742, 137.5]
].join('L') + 'Z')
.attr('transform', 'translate(10, 10)');
它使用的选择器与 jQuery 中的选择器密切相关。
引用作者的话:
D3 does not provide a new graphical representation—unlike Processing, Raphaël, or Protovis, there is no new vocabulary of marks to learn. Instead, you build directly on standards such as CSS3, HTML5 and SVG.
关于javascript - 使用 Javascript 生成 SVG 路径的库?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4441451/