RaphaelJS:如果从页面散列中找到变量属性，则更改其属性

RaphaelJS: changing variable attributes if found from page hash

本文关键字：属性 变量 如果 RaphaelJS      更新时间：2023-09-26

假设我有var mycircle = paper.circle(0, 0, 20).attr({stroke: "#ff0000"});

现在默认情况下，当有人访问我的www.url.com/index.html页面时，他们会得到这个带有红色笔画的圆圈。

然而，如果我想如果在浏览时定义了#hash，则要更改的圆圈笔画。你做了一个选择，想把它和某个人联系起来。说某人现在浏览到www.url.com/index.html#mycircle。

使用:var hash = window.location.hash.substr(1)我可以使变量哈希返回"mycircle"。

然而，通过做hash.attr({stroke: "#0000ff"});描边颜色不会变成蓝色!有没有办法让我像这样改变圆圈的描边?

//编辑

我已经这样设置了我的圆圈:

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";

以此类推。然后我将它们组合成一个集合:

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

然后我使用nodes.hover(function() { });和nodes.click(function() { });来定义动作。name.node.id用于将正确的信息页面加载到div中，而当用户将鼠标悬停在节点上时，name.node.name出现在节点上方。

我试着按照建议重新组织我的节点:

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";

然后，我尝试像以前一样使用函数，通过简单地将节点更改为mapObjects mapObjects.hover(function() { });与click相同。这些再也不起作用了!哈希技术成功了，所以这是向正确方向迈出的一步。我如何得到我的悬停和点击功能工作现在?

eval会有所帮助，但它会非常脆弱。更好的方法是记住关联数组中的圆:

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