从画布中删除随机拉斐尔元素答案

【问题标题】：Removing random raphael elements from canvas从画布中删除随机拉斐尔元素
【发布时间】：2015-06-22 09:33:01
【问题描述】：

我正在使用 raphaeljs 和 socketIO 进行实时数据演示。我的画布上有代表节点的圆圈，它们以nodeStatus[id].obj 的形式存储在nodeStatus 对象中，其中“id”可以是“101”、“102”等，我正在尝试实现一个随机删除的函数客户端浏览器画布中先前绘制的圆圈（节点）。

用于发送 nodeID 和 obj 的服务器端脚本是这样的：socket.emit("randomNode",randomNode,nodes[randomNode]);。 randomNode 包含我要删除的圆圈的 ID。 nodes[randomNode] 是存储该节点信息的对象。

这是我的客户端 html 中的相关部分。（nodeID 是我想要（从我的画布/纸上）移除的圆（节点）的 id，obj 是相应的对象）

socket.on("randomNode",function (nodeID, obj){
    nodes[nodeID] = obj;
    console.log(nodeID,obj);
    updateNodeStatus(nodeID);
    console.log(nodeStatus[nodeID]);
    nodeStatus[nodeID].obj.remove();
    nodeStatus[nodeID].idText.remove();
 });

nodeStatus[nodeID].obj.remove(); 产生“TypeError: nodeStatus[id].obj is undefined”错误。

console.log(nodeID); 打印“101”、“102”等预期值，而nodeStatus[102].obj.remove(); 从画布中删除“id=101 的 raphael 对象”。但是nodeStatus[nodeID].obj.remove(); 不能正常工作。有人可以指出我在哪里做错了吗？

【问题讨论】：

任何机会你都能以某种方式在 jsfiddle 上获得一个测试示例，或者至少在 nodeStatus 构建时获得更多代码。特别是做一个 console.log( nodeStatus[nodeID] );你的代码中有这个，但实际上不是它输出的内容。
无法在 jsfiddle 上获取我的代码，因为它具有用于 socket.io 的服务器端“.js”、服务器端“config.js”和客户端“.html”。不过，我让它工作了。谢谢。

标签： javascript html socket.io raphael

【解决方案1】：

socket.on("randomNode",function (nodeID, obj){
    nodeStatus[nodeID].obj.remove();
    nodeStatus[nodeID].idText.remove();    
    nodes[nodeID] = obj;
    console.log(nodeID,obj);
    updateNodeStatus(nodeID);
    console.log(nodeStatus[nodeID]);
 });

事实证明，必须首先删除 raphael 对象（保存在 nodeStatus obj 中）。 updateNodeStatus(nodeID) 仅更新某个节点（id = nodeID 的节点）上的信息，因此 nodeStatus[nodeID].obj 或 nodeStatus[nodeID].idText 未定义。

【讨论】：