在RaphaelJS中,我如何移动路径中的单个节点
In RaphaelJS, how do I move around individual nodes in a path?
是否有一个数组包含这些?
另外,是否也可以在现有路径中添加节点?
您需要编辑路径。不,这里没有数组,只有路径字符串。当然,你可以编写更高级的代码来跟踪数组中的节点,并从中生成路径字符串。
一个简单的实现是:
function Polygon (nodes) {
if (nodes instanceof Array) this.nodes = nodes;
else this.nodes = [];
}
Polygon.prototype.draw = function () {
var path = "M" + this.nodes[0][0] + "," + this.nodes[0][1];
for (var i=1; i<this.nodes.length; i++) {
path += "L" + this.nodes[i][0] + "," + this.nodes[i][1];
}
path += "Z";
return path;
}
那么你可以这样做:
var p = new Polygon([[100,100],[100,200],[200,200],[200,100]]);
var pp = paper.path(p.draw());
// Modify node:
p.nodes[2] = [300,300];
pp.attr('path',p.draw());
// Add node:
p.nodes.push([250,150]);
pp.attr('path',p.draw());
当然你可以在你实现的API上更有创意。例如,polygon.draw()
可以自动更新链接的Raphael Element。上面的代码只是基本思想的一个简单示例。
相关文章:
- 计算从一个对象到另一个对象的路径并沿其移动
- jquery移动应用程序无法使用jquryMobile框架JS和css文件的相对路径
- 在移动设备上按路径或名称获取二进制图像(Ionic / Ng cordova 应用程序)
- 如何基于力沿弯曲路径移动图元
- 在 HTML5 画布中沿路径旋转移动对象
- 传单.js路径点击移动设备
- 在 Phaser.IO 中沿着预定义的路径移动精灵
- 将对象拖动到特定路径并在同级路径中移动
- 在 threejs 中沿路径或样条移动对象
- (HTML5 画布)填充样式 img 不会随我的地形路径移动
- Javascript 移动到没有 JS 库的 SVG 路径
- 无法让精灵在圆形路径中移动
- D3在鼠标上沿路径移动圆平移X轴上的直线时移动中断
- 钛移动的Commonjs资源路径
- raphaeljs-移动我从svg转换的路径
- Raphael JS:延迟后沿着路径移动图像
- 纯使用JavaScript在圆形路径中移动图像
- 当物体在地图上移动时绘制路径
- 通过svg路径滚动移动图像
- 在RaphaelJS中,我如何移动路径中的单个节点