开发者

RaphaelJS: changing variable attributes if found from page hash

Say I have var mycircle = paper.circle(0, 0, 20).attr({stroke: "#ff0000"});

Now by default when someone goes to my page at www.url.com/index.html they get this circle with the red stroke.

However, what if I wanted the circle stroke to change if a #hash was defined when browsing, e.g. a selection was made and you wanted to link it to someone. Say someone browses to www.url.com/index.html#mycircle now.

With: var hash = window.location.hash.substr(1) I can make the variable hash return "mycircle".

However, by doing hash.attr({stroke: "#0000ff"}); the stroke colour wont change to blue! Is there a way around this so I could change the stroke of the circle like so?

// EDIT

I have set up my circles like so:

var name1 = paper.circle(....);
name1.node.id = "name1";
name1.node.name = "Name";

var name2 = paper.circle(....);
name2.node.id = "name2";
name2.node.name = "Another Name";

And so on. Then I have combined them into a set:

nodes = paper.set();
nodes.push(name1, name2, name3, name4....);

I then use nodes.hover(function() { }); and nodes.click(function() { }); to define actions. The name.node.id is used for loading the right info page into a div while the name.node.name appears above the node when the user hovers over it.

I tried reorganizing my nodes as suggested:

var mapObjects = {};

mapObjects['name1'] = paper.circle(....);
mapObjects['name1'].node.id = "name1";
mapObjects['name1'].node.name = "Name";

mapObjects['name2'] = paper.circle(....);
mapObjects['name2'].node.id = "name1";
mapObjects['name2'].node.name = "Another Name";

I then tried to use the functions like I did before by simply changing nodes into mapObjects mapObjects.hover(function() { }); same with click. These didn't w开发者_如何学编程ork anymore! The hash technique worked tho so that's a step to the right direction. How do I get my hover and click functions working now?


The eval would help, but it would be very vulnerable. The better way is to remember the circle in associative array:

var objects = {};
objects['mycircle'] = paper.circle(0, 0, 20).attr({stroke: "#ff0000"});
objects[hash].attr({stroke: "#0000ff"});
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜