将ID添加到Raphael对象 [英] adding ID's to raphael objects

查看:97
本文介绍了将ID添加到Raphael对象的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个相当大的地图,其中包含Raphael路径,这些路径试图让某些要填充的jquery ajax脚本访问.我试图添加一个ID或其他任何东西,以使其能够以有组织的方式从jquery进行访问.

I have a fairly large map consisting of Raphael paths which im trying to make accessible to some jquery ajax scripts to be populated. I've tried to add an ID or anything to make it accessible from jquery in an organized fashion.

作为Raphael的新手,我无法找到实现此目标的好方法. 我尝试使用.data()为每个点添加一个ID,例如"seat_1","seat_2"等,但到目前为止都没有成功.

As im new to Raphael I cant figure out a good way of achieving this. I've tried using .data() to add an ID for each dot with say "seat_1","seat_2" and so on but been unsuccessful so far.

我将如何组织这段代码,以便可以通过循环操作它? 我意识到这是一个相当开放的问题,但是任何建议都值得赞赏

how would I go about organizing this code so I could manipulate it by looping? I realize that its a fairly open ended question but any suggestion is much appreciated

此处演示: http://www.sam-sys. in/demo/pushparaj/ticketreservation/?page_id = 203

var path_gs = rsr.path("M5.834,698.336c-3.217,0-5.833,2.615-5.833,5.831 c0,3.215,2.616,5.833,5.833,5.833c3.219,0,5.835-2.618,5.835-5.833C11.669,700.951,9.053,698.336,5.834,698.336"); 
path_gs.attr({"clip-path": 'url(#SVGID_2_)',fill: '#777675',parent: 'group_a','stroke-width': '0','stroke-opacity': '1'}).data('id', 'path_gs');

生成

<path style="stroke-opacity: 1; " fill="#008000" stroke="#000000" d="M5.834,698.336C2.6169999999999995,698.336,0.0009999999999994458,700.951,0.0009999999999994458,704.167C0.0009999999999994458,707.3820000000001,2.6169999999999995,710,5.834,710C9.052999999999999,710,11.669,707.382,11.669,704.167C11.669,700.951,9.053,698.336,5.834,698.336" stroke-width="0" stroke-opacity="1"></path>

推荐答案

好,下面是我的方法.首先,我将所有路径写到一个对象中,例如:

Well, the way I'm doing this is the following. First I write all the paths in an object, for example:

var paths = {
    path1: 'the paths coordinates',
    path2: 'the paths coordinates',
    path3: 'the paths coordinates',
}

然后,您只需遍历所有路径,为每个路径设置坐标并为其指定一个ID(这是内部Raphael的ID):

Then you just loop trough all the paths, seting the coordinates for each path and giving them an ID (this is an internal Raphael's ID):

for(path in paths){
   var newpath = paper.path(paths[path]);
   newpath.attr({options})
   newpath.id = path;
}

现在,如果您想获得其中一个元素,则可以使用下一个Raphael功能:

Now, if you want to get one of this elements you can use the next Raphael feature:

var thisPath = paper.getById('path1');

这样,您可以在任何Raphael方法上使用路径.因此,如果需要将节点放入圆顶中,则可以执行以下操作:

This way you can use the path on any of the Raphael methods. So, if you need to get the node in the dome you can do the following:

var node = thisPath.node

但是,如果您需要为路径设置动画,则最好使用Raphael的动画方法,或者如果您需要更改属性attr方法.

But if you need to animate the path, you better use the Raphael's animate method, or if you need to change attibutes the attr method.

thisPath.animate(.....)

如果您需要对所有路径进行一些更改,则可以使用:

If you need to apply some change to all the paths, you can use:

paper.forEach(function(thisArg))

您需要传递函数以在每个元素上运行,并且thisArg在每次迭代中都引用该元素

you need to pass the function to run on each element and thisArg reference the element on each iteration

也许您想看看Raphael的集合对于在元素组上使用方法很有用.如果您需要使用此功能的任何帮助,请告诉我,我会尽力帮助您.再见!

And maybe you want to take a look to the Raphael's sets wich can be useful for use methods on groups of elements. If you need any help using this features just let me know and I'll do my best to help you out. Bye!

这篇关于将ID添加到Raphael对象的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆