diff --git a/frame.js b/frame.js
index 369f4b1b..49448c08 100644
--- a/frame.js
+++ b/frame.js
@@ -299,9 +299,11 @@ var can = Volcanos("chat", {
                 }), value
             },
             Status: function(event, value, key) {var cb = output.onstatus[key];
-                typeof cb == "function"? cb(event, output, value, key, can.page.Select(can, status, "div."+key)[0]||{}): false && output.run(event, ["status", key, value], function(msg) {
-                    output.Export(event, msg, key)
-                }, true)
+                typeof cb == "function" && cb(event, output, value, key, can.page.Select(can, status, "span."+key, function(item) {
+                    value? can.page.ClassList.del(can, item.previousSibling, "hidden"):
+                        can.page.ClassList.add(can, item.previousSibling, "hidden")
+                    return item
+                })[0]||{})
             },
             Export: function(event, value, key, index) {var cb = output.onexport[key];
                 return typeof cb == "function"? cb(event, output, value, key, target): can.Report(event, value, key, index)
diff --git a/lib/page.js b/lib/page.js
index 70426d60..e7bb1300 100644
--- a/lib/page.js
+++ b/lib/page.js
@@ -295,9 +295,9 @@ Volcanos("page", {help: "网页模块",
                 }]}: line]}
         }))
     }),
-    AppendStatus: shy("添加控件", function(can, status, list, cb) {
+    AppendStatus: shy("添加控件", function(can, status, list, meta) {meta = meta || {}
         can.page.Append(can, status, can.core.List(list, function(line) {
-            return {view: [line]}
+            return {view: "item " + line, list: [{text: [line+": ", "span", meta[line]? "": "hidden"]}, {text: [meta[line]||"", "span", line]}]}
         }))
     }),
 
diff --git a/plugin/story/trend.js b/plugin/story/trend.js
index 8d79d3f9..387969b9 100644
--- a/plugin/story/trend.js
+++ b/plugin/story/trend.js
@@ -1,65 +1,81 @@
 Volcanos("onimport", {help: "导入数据", list: [],
     init: function(can, meta, cb, target, action, option) {target.innerHTML = ""
         if (can.msg.Option("_display") == "table") {
+            // 文件目录
             can.page.AppendTable(can, target, can.msg, can.msg.append, function(event, value, key, index, tr, td) {
                 can.Export(event, value, key)
             })
             return
         }
 
-        can.data = can.msg.Table()
-        can.ui = can.page.Append(can, target, [{view: "action"}, {view: "output"}, {view: "total"}, {view: "status"}])
+        can.ui = can.page.Append(can, target, [{view: "action"}, {view: "output"}, {view: "status"}, {view: "total"}, {
+            view: "display", style: {position: "absolute", "white-space": "pre", color: "yellow"}, onclick: function(event) {
+                can.page.ClassList.add(can, can.ui.display, "hidden")
+            },
+        }])
         can.ui.table = can.page.AppendTable(can, target, can.msg, can.msg.append)
         can.ui.table.style.clear = "both"
+        can.data = can.msg.Table()
+        can.page.ClassList.add(can, can.ui.total, "status")
+
         can.sub = can.Output(can, {}, "/plugin/wiki/draw", can.Event({}), function() {
-            can.onaction["编辑"]({}, can)
             can.onaction["表格"]({}, can)
+            can.onaction["编辑"]({}, can)
             can.onaction["股价图"]({}, can)
         }, can.ui.output, can.ui.action, option, can.ui.status)
     },
 })
-
-Volcanos("onaction", {help: "组件菜单", list: ["股价图", "趋势", "比例", "表格", "编辑"],
-    "表格": function(event, can, value, cmd, target) {var sub = can.sub, data = can.data;
-        can.page.ClassList.neg(can, can.ui.table, "hidden")
+Volcanos("onaction", {help: "组件菜单", list: ["编辑", "清空", "股价图", "趋势", "比例", ["width", "200", "400", "600", "800", "1000"], ["height", "200", "400", "600"], "表格"],
+    "编辑": function(event, can, value, cmd, target) {
+        can.page.ClassList.neg(can, can.ui.action, "hidden")
+        can.page.ClassList.neg(can, can.ui.status, "hidden")
+    },
+    "清空": function(event, can, value, cmd, target) {
+        can.sub.svg.innerHTML = ""
     },
     "股价图": function(event, can, value, cmd, target) {var sub = can.sub, data = can.data;
         if (!can.list) {
-            var add = 0, del = 0, count = 0, max = 0
-            can.total = 0, can.list = can.core.List(data, function(value, index) {
+            var count = 0, add = 0, del = 0, max = 0
+            can.max = 0, can.rest = 0, can.list = can.core.List(data, function(value, index) {
                 var line = {};
                 line.note = value[can.msg.append[4]]
                 line.date = value[can.msg.append[0]]
                 line.add = parseInt(value[can.msg.append[1]])
                 line.del = parseInt(value[can.msg.append[2]])
 
-                line.begin = can.total
-                line.max = can.total + line.add
-                line.min = can.total - line.del
-                line.close = can.total = can.total + line.add - line.del
+                line.begin = can.rest
+                line.max = can.rest + line.add
+                line.min = can.rest - line.del
+                line.close = can.rest = can.rest + line.add - line.del
+
+                count++
                 add += line.add
                 del += line.del
                 if (line.max - line.min > max) {
                     max = line.max - line.min
                 }
-                count++
+                if (line.max > can.max) {
+                    can.max = line.max
+                }
                 return line
             })
+
             var begin = new Date(data[0].date)
             var end = new Date(data[data.length-1].date)
             var avg = parseInt((add + del) / (end - begin) * 1000 * 3600 * 24)
-            can.ui.total.innerHTML = can.base.Duration(end-begin) + " count: " + count + " add: " + add + " del: " + del
-                + " max: " + max + " avg: " + avg + " rest: " + can.total
+            can.page.AppendStatus(can, can.ui.total, ["count", "avg", "max", "add", "del", "rest"], {
+                count: count,
+                avg: avg,
+                max: max,
+                del: del,
+                rest: can.rest,
+            })
         }
 
-        var step = 20
-        var view = 200
         var space = 10
-        var max = 600
-
-        if (can.list.length * space > max) {
-            step = parseInt(max / can.list.length)||2
-        }
+        var view = parseInt(can.Action("height"))
+        var max = parseInt(can.Action("width"))
+        var step = parseInt(max / can.list.length)||2
 
         var width = can.list.length * step + space * 2
         sub.svg.Val("width", width)
@@ -67,72 +83,117 @@ Volcanos("onaction", {help: "组件菜单", list: ["股价图", "趋势", "比
         var height  = view + space * 2
         sub.svg.Val("height", height)
 
-
-        var display = can.page.Append(can, can.target, [{view: ["display"], style: {position: "absolute", "white-space": "pre"}, onclick: function() {
-            can.page.ClassList.add(can, display, "hidden")
-        }}]).first
-
         can.core.List(can.list, function(line, index) {
             sub.onimport.draw({}, sub, {
                 shape: "line", point: [
-                    {x: space/2+step*index+step/4, y: space/2+view-line.min/can.total*view},
-                    {x: space/2+step*index+step/4, y: space/2+view-line.max/can.total*view},
-                ], style: {
+                    {x: space/2+step*index+step/4, y: space/2+view-line.min/can.max*view},
+                    {x: space/2+step*index+step/4, y: space/2+view-line.max/can.max*view},
+                ], style: line.begin < line.close? {
+                    "stroke-width": 1, "stroke": "white",
+                }: {
+                    "stroke-width": 1, "stroke": "black",
                 },
             })
+
             var one = line.begin < line.close? sub.onimport.draw({}, sub, {
                 shape: "rect", point: [
-                    {x: space/2+step*index, y: space/2+view-line.begin/can.total*view},
-                    {x: space/2+step*index+step/2, y: space/2+view-line.close/can.total*view},
+                    {x: space/2+step*index, y: space/2+view-line.begin/can.max*view},
+                    {x: space/2+step*index+step/2, y: space/2+view-line.close/can.max*view},
                 ], style: {
                     "rx": 0, "ry": 0,
-                    "stroke-width": 1,
-                    "fill": "white",
+                    "stroke-width": 1, "stroke": "white", "fill": "white",
                 },
             }): sub.onimport.draw({}, sub, {
                 shape: "rect", point: [
-                    {x: space/2+step*index, y: space/2+view-line.close/can.total*view},
-                    {x: space/2+step*index+step/2, y: space/2+view-line.begin/can.total*view},
+                    {x: space/2+step*index, y: space/2+view-line.close/can.max*view},
+                    {x: space/2+step*index+step/2, y: space/2+view-line.begin/can.max*view},
                 ], style: {
                     "rx": 0, "ry": 0,
-                    "stroke-width": 1,
-                    "fill": "black",
+                    "stroke-width": 1, "stroke": "black", "fill": "black",
                 },
             })
 
             one.onmouseover = function(event) {
-                can.page.ClassList.del(can, display, "hidden")
-                display.style.left = event.clientX+space/2+"px"
-                display.style.top = event.clientY+space/2+"px"
-                display.innerHTML =
-                      "date:  "+line.date+"\n"
-                    + "note:  "+line.note+"\n"
-                    + "begin: "+line.begin+"\n"
-                    + "add:   "+line.add+"\n"
-                    + "del:   "+line.del+"\n"
-                    + "close: "+line.close+"\n"
+                can.page.ClassList.del(can, can.ui.display, "hidden")
+                can.ui.display.style.left = event.clientX+space/2+"px"
+                can.ui.display.style.top = event.clientY+space/2+"px"
+
+                var msg = can.Event(event);
+                msg.Push(line, ["date", "note", "begin", "add", "del", "close"], "detail")
+                can.ui.display.innerHTML = ""
+                can.page.AppendTable(can, can.ui.display, msg, msg.append)
             }
         })
     },
     "趋势": function(event, can, value, cmd, target) {var sub = can.sub, data = can.data;
-        var width = data.length * 20 + 10
+        var space = 10
+        var view = parseInt(can.Action("height"))
+        var max = parseInt(can.Action("width"))
+        var step = parseInt(max / can.list.length)||2
+
+        var width = can.list.length * step + space * 2
         sub.svg.Val("width", width)
 
-        var height  = can.msg.append.length * 100 + 10
-        sub.svg.Val("height", height)
+        var height = 0
+        var max = {};
+        can.core.List(can.msg.append, function(key, which) {
+            height += view + space * 2
+            max[key] = 0;
+            can.core.List(data, function(value, index) {
+                if ((parseInt(value[key])||0) > max[key]) {
+                    max[key] = parseInt(value[key])||0
+                }
+            })
+        })
+
+        sub.svg.Val("height", height+space*2)
 
         can.core.List(can.msg.append, function(key, which) {
+            var y = (space*2+view)*(which+1)
+            sub.onimport.draw({}, sub, {
+                shape: "text", point: [
+                    {x: width/2, y: y+space},
+                ],
+                style: {
+                    "font-size": 20,
+                    "stroke-width": 0,
+                    "fill": "red",
+                    inner: key, 
+                },
+            })
+
             can.core.List(data, function(value, index) {
-                sub.onimport.draw({}, sub, {
+                var one = sub.onimport.draw({}, sub, {
                     shape: "rect",
-                    point: [{x: 10+20*index, y: 100*(which+1)}, {x: 20*index+20, y: 100*(which+1)-parseInt(value[key])}],
+                    point: [
+                        {x: space+step*index, y: y},
+                        {x: space+step*index+step/4, y: y-parseInt(value[key])/(max[key]||1)*view}
+                    ],
+                    style: {
+                        "rx": 0, "ry": 0,
+                        "stroke-width": 1, "stroke": "white", "fill": "white",
+                    },
                 })
+
+                one.onmouseover = function(event) {
+                    can.page.ClassList.del(can, can.ui.display, "hidden")
+                    can.ui.display.style.left = event.clientX+space/2+"px"
+                    can.ui.display.style.top = event.clientY+space/2+"px"
+
+                    var msg = can.Event(event);
+                    msg.Push(value, can.core.Item(value, function(key) {
+                        return msg[key] = [], key
+                    }), "detail")
+                    can.ui.display.innerHTML = ""
+                    can.page.AppendTable(can, can.ui.display, msg, msg.append)
+                }
             })
         })
     },
-    "编辑": function(event, can, value, cmd, target) {
-        can.page.ClassList.neg(can, can.ui.action, "hidden")
-        can.page.ClassList.neg(can, can.ui.status, "hidden")
+    "表格": function(event, can, value, cmd, target) {var sub = can.sub, data = can.data;
+        can.page.ClassList.neg(can, can.ui.table, "hidden")
     },
 })
+Volcanos("onchoice", {help: "组件交互", list: []})
+Volcanos("ondetail", {help: "组件详情", list: []})
 Volcanos("onexport", {help: "导出数据", list: []})
diff --git a/plugin/wiki/draw.js b/plugin/wiki/draw.js
index 655c1385..6bdaa226 100644
--- a/plugin/wiki/draw.js
+++ b/plugin/wiki/draw.js
@@ -3,45 +3,55 @@ Volcanos("onimport", {help: "导入数据", list: [],
     _start: function(can) {
         var def = {
             "font-size": "24",
-            "fill": "purple",
-            "stroke": "yellow",
             "stroke-width": 2,
+            "stroke": "yellow",
+            "fill": "purple",
             "grid": "10",
         }
+        // 默认参数
         can.core.Item(def, function(key, value) {
-            can.svg && can.svg.Value(key, can.Action(key, can.svg.Value(key)||value))
+            can.svg.Value(key, can.Action(key, can.svg.Value(key)||value))
         })
         can.Action("mode", "select")
     },
     init: function(can, msg, cb, output, action, option) {output.innerHTML = "";
-        can.page.AppendTable(can, output, msg, msg.append, function(event, value, key, index, tr, td) {
+        // 文件目录
+        msg.Option("_display") == "table" && can.page.AppendTable(can, output, msg, msg.append, function(event, value, key, index, tr, td) {
             can.Export(event, value, key)
         });
 
+        // 用户操作
+        can.point = [], can.keys = []
+        can.current = null, can.temp = null
+        can.group = null, can.svg = null
+
+        // 加载绘图
         var code = can.page.Append(can, output, [{view: ["code", "div", msg.Result()||can.Export(event, null, "file")]}]).code;
         can.page.Select(can, output, "svg", function(svg) {
-            can.group = can.svg = svg;
+            // 画布
             can.onaction.init(event, can, msg, "init", svg);
+            can.group = can.svg = svg;
 
             var list = can.core.List(can.onaction.list, function(item, index) {if (item[0] == "group") {
+                // 清空分组
                 return can.onaction.list[index] = ["group", "svg"]
             }})[0]
 
-            // 分组
             can.page.Select(can, svg, "*", function(item, index) {
+                // 元素
                 can.onaction.init(event, can, msg, index, item);
-
-                switch (item.tagName) {
-                    case "g":
-                        list.push(item.Value("class"));
-                        break
-                }
+                item.tagName == "g" && list.push(item.Value("class"));
             })
         })
-        can.point = [];
-        can.keys = [];
+
         return typeof cb == "function" && cb(msg);
     },
+    draw: function(event, can, value) {
+        var figure = can.onfigure[value.shape]
+        var data = figure.draw(event, can, value.point, value.style)
+        can.core.Item(value.style, function(key, value) {data[key] = value})
+        return can.onaction.push(event, can, data, value.shape, can.group||can.svg)
+    },
     keydown: function(event, can, value, cmd, target) {
         can.keys.push(value)
 
@@ -107,17 +117,12 @@ Volcanos("onimport", {help: "导入数据", list: [],
         call(prefix.concat(list.list))
         return can.keys = [], can.Status(event, can.keys, "keys")
     },
-    draw: function(event, can, value) {
-        var figure = can.onfigure[value.shape]
-        var data = figure.draw(event, can, value.point, value.style)
-        return can.onaction.push(event, can, data, value.shape, can.group||can.svg)
-    },
 }, ["/plugin/wiki/draw.css"])
 Volcanos("onfigure", {help: "图形绘制", list: [],
     svg: {
         data: {
-            size: {x: "x", y: "y"},
-        },
+            size: {},
+        }, // <svg font-size="24" stroke="yellow" stroke-width="2" fill="purple" grid="10"/>
         show: function(event, can, value, target) {
             return can.svg.Val("width") +","+ can.svg.Val("width")
         },
@@ -127,8 +132,8 @@ Volcanos("onfigure", {help: "图形绘制", list: [],
             rx: 4, ry: 4,
             size: {x: "x", y: "y"},
             copy: ["width", "height", "rx", "ry"],
-        }, // <rect x="60" y="10" rx="10" ry="10" width="30" height="30"/>
-        draw: function(event, can, point, style) {if (point.length < 2) {return}
+        }, // <rect x="60" y="10" rx="10" ry="10" width="30" height="30" rx="4" ry="4"/>
+        draw: function(event, can, point) {if (point.length < 2) {return}
             var p0 = point[0], p1 = point[1];
             var data = {
                 "x": p0.x > p1.x? p1.x: p0.x,
@@ -138,28 +143,16 @@ Volcanos("onfigure", {help: "图形绘制", list: [],
                 "rx": this.data.rx,
                 "ry": this.data.ry,
             }
-            can.core.Item(style, function(key, value) {data[key] = value})
-            can.Status(event, data, "width");
             return event.type == "click" && point.length == 2 && (can.point = []), data;
         },
-        space: function(event, can) {
-            can.user.prompt("width", function(width) {
-                can.user.prompt("height", function(height) {
-                    can.temp && can.page.Remove(can, can.temp) && delete(can.temp)
-                    can.onaction.push(event, can, can.onfigure.rect.draw(event, can, [can.point[0], [can.point[0]+width, can.point[1]+height]]), "rect", can.group||can.svg)
-                    can.point = []
-                })
-            })
-        },
         text: function(event, can, data, target) {
-            data.x = target.x.baseVal.value+target.width.baseVal.value/2
-            data.y = target.y.baseVal.value+target.height.baseVal.value/2
+            data.x = target.Val("x")+target.Val("width")/2
+            data.y = target.Val("y")+target.Val("height")/2
             return data
         },
         show: function(event, can, value, target) {
-            return value.parentNode.Value("class") + " " + value.tagName
-                + ": (" + value.x.baseVal.value + "," + value.y.baseVal.value+ ")"
-                + " + (" + value.width.baseVal.value + "," + value.height.baseVal.value+ ")"
+            return ": (" + value.Val("x") + "," + value.Val("y") + ")"
+                + " + (" + value.Val("width") + "," + value.Val("height") + ")"
         },
     },
     circle: {
@@ -167,75 +160,69 @@ Volcanos("onfigure", {help: "图形绘制", list: [],
             size: {x: "cx", y: "cy", width: "r", height: "r"},
             copy: ["r"],
         }, // <circle cx="25" cy="75" r="20"/>
-        draw: function(event, can, point) {
-            if (point.length == 1) {return}
+        draw: function(event, can, point) {if (point.length < 2) {return}
             var p0 = point[0], p1 = point[1];
             var data = {
                 "cx": p0.x, "cy": p0.y,
                 "r": Math.sqrt(Math.pow(p0.x-p1.x, 2)+Math.pow(p0.y-p1.y, 2)),
             }
-            event.type == "click" && point.length == 2 && (can.point = [])
-            return data;
+            return event.type == "click" && point.length == 2 && (can.point = []), data;
         },
         text: function(event, can, data, target) {
-            data.x = target.cx.baseVal.value
-            data.y = target.cy.baseVal.value
+            data.x = target.Val("cx")
+            data.y = target.Val("cy")
             return data
         },
         show: function(event, can, value, target) {
-            return value.parentNode.Value("class") + " " + value.tagName
-                + ": (" + value.cx.baseVal.value + "," + value.cy.baseVal.value+ ")"
-                + " > (" + parseInt(value.r.baseVal.value) + ")"
+            return ": (" + value.Val("cx") + "," + value.Val("cy") + ")"
+                + " > (" + parseInt(value.Val("r")) + ")"
         },
     },
     ellipse: {
         data: {
             size: {x: "cx", y: "cy", width: "rx", height: "ry"},
+            copy: ["rx", "ry"],
         }, // <ellipse cx="75" cy="75" rx="20" ry="5"/>
-        draw: function(event, can, point) {
+        draw: function(event, can, point) {if (point.length < 2) {return}
             var p0 = point[0], p1 = point[1];
             var data = {
                 "cx": p0.x, "cy": p0.y,
                 "rx": Math.abs(p0.x - p1.x), "ry": Math.abs(p0.y - p1.y),
             }
-            event.type == "click" && point.length == 2 && (can.point = [])
-            return data;
+            return event.type == "click" && point.length == 2 && (can.point = []), data;
         },
         text: function(event, can, data, target) {
-            data.x = target.cx.baseVal.value
-            data.y = target.cy.baseVal.value
+            data.x = target.Val("cx")
+            data.y = target.Val("cy")
             return data
         },
         show: function(event, can, value, target) {
-            return value.tagName
-                + ": (" + value.cx.baseVal.value + "," + value.cy.baseVal.value+ ")"
-                + " > (" + parseInt(value.rx.baseVal.value) + parseInt(value.ry.baseVal.value) + ")"
+            return ": (" + value.Val("cx") + "," + value.Val("cy") + ")"
+                + " > (" + value.Val("rx") + value.Val("ry") + ")"
         },
     },
     text: {
         data: {
             size: {x: "x", y: "y"},
         }, // <text x="60" y="10">hi<text>
-        draw: function(event, can, point) {if (point.length < 1) {return}
+        draw: function(event, can, point, style) {if (point.length < 1) {return}
             var p0 = point[0];
             var data = {
                 "x": p0.x, "y": p0.y,
-                "inner": can.user.prompt("text"),
+                "inner": style.inner||can.user.prompt("text"),
             }
             return can.point = [], data;
         },
         show: function(event, can, value, target) {
-            return value.parentNode.Value("class") + " " + value.tagName
-                + ": (" + target.Val("x") + "," + target.Val("y")+ ")"
+            return ": (" + target.Val("x") + "," + target.Val("y")+ ")"
         }
     },
     line: {
         data: {
-            size: {x: "x1", y: "y1", x2: "x2", y: "y2"},
+            size: {x: "x1", y: "y1"},
             copy: ["x1", "y1", "x2", "y2"],
-        },  // <line x1="10" x2="50" y1="110" y2="150"/>
-        draw: function(event, can, point) {
-            if (point.length < 2) {return}
+        },  // <line x1="10" y1="50" x2="110" y2="150"/>
+        draw: function(event, can, point) {if (point.length < 2) {return}
             var p0 = point[0], p1 = point[1];
             var data = {
                 "x1": p0.x, "y1": p0.y,
@@ -244,14 +231,13 @@ Volcanos("onfigure", {help: "图形绘制", list: [],
             return event.type == "click" && point.length == 2 && (can.point = []), data;
         },
         text: function(event, can, data, target) {
-            data.x = (target.x1.baseVal.value + target.x2.baseVal.value) / 2
-            data.y = (target.y1.baseVal.value + target.y2.baseVal.value) / 2
+            data.x = (target.Val("x1") + target.Val("x2")) / 2
+            data.y = (target.Val("y1") + target.Val("y2")) / 2
             return data
         },
         show: function(event, can, value, target) {
-            return value.tagName
-                + ": (" + value.x1.baseVal.value + "," + value.y1.baseVal.value+ ")"
-                + " - (" + value.x2.baseVal.value + "," + value.y2.baseVal.value+ ")"
+            return ": (" + value.Val("x1") + "," + value.Val("y1") + ")"
+                + " - (" + value.Val("x2") + "," + value.Val("y2") + ")"
         },
     },
 
@@ -323,7 +309,7 @@ Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除",
         ["stroke-width", 1, 2, 3, 4, 5],
         {text: "c"}, ["stroke", "red", "yellow", "green", "purple", "blue", "cyan", "white", "black"],
         {text: "f"}, ["fill", "red", "yellow", "green", "purple", "blue", "cyan", "white", "black", "#0000"],
-        {text: "a"}, ["mode", "draw", "move", "resize", "select", "scale", "delete"],
+        {text: "a"}, ["mode", "scale", "draw", "move", "resize", "select", "delete"],
         {text: "s"}, ["shape", "rect", "circle", "ellipse", "text", "line", "path", "polyline", "polygon"],
         ["grid", 1, 2, 3, 4, 5, 10, 20],
     ],
@@ -333,10 +319,8 @@ Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除",
         }, true)
     },
     "清空": function(event, can, msg, cmd, target) {can.svg.innerHTML = ""},
-    "删除": function(event, can, msg, cmd, target) {
-        if (can.group == can.svg) {return}
-        can.page.Remove(can, can.group)
-        can.page.Select(can, can.action, "option[value="+can.group.Value("class")+"]", function(item) {
+    "删除": function(event, can, msg, cmd, target) {if (can.group == can.svg) {return}
+        can.page.Remove(can, can.group), can.page.Select(can, can.action, "option[value="+can.group.Value("class")+"]", function(item) {
             can.page.Remove(can, item)
         })
         can.Action("group", "svg")
@@ -370,11 +354,12 @@ Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除",
         })
         return can.group
     },
-    "font-size": function(event, can, value, cmd, target) {can.group.Value(value, cmd)},
-    "stroke-width": function(event, can, value, cmd, target) {can.group.Value(value, cmd)},
+    "font-size": function(event, can, value, cmd, target) {can.Action(value, can.group.Value(value, cmd))},
+    "stroke-width": function(event, can, value, cmd, target) {can.Action(value, can.group.Value(value, cmd))},
     stroke: function(event, can, value, cmd, target) {can.Action(value, can.group.Value(value, cmd))},
     fill: function(event, can, value, cmd, target) {can.Action(value, can.group.Value(value, cmd))},
     shape: function(event, can, value, cmd, target) {cmd && can.Action(value, cmd)},
+    mode: function(event, can, value, cmd, target) {cmd && can.Action(value, cmd)},
     grid: function(event, can, value, cmd, target) {cmd && can.Action(value, cmd)},
 
     init: function(event, can, msg, cmd, item) {
@@ -387,8 +372,7 @@ Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除",
         item.Val = function(key, value) {
             return parseInt(item.Value(key, value == undefined? value: parseInt(value)||0));
         }
-        item.Group = function() {
-            var target = item
+        item.Group = function() {var target = item
             while (target) {
                 if (["svg", "g"].indexOf(target.tagName) > -1) {
                     return target;
@@ -399,21 +383,15 @@ Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除",
         }
         return item;
     },
-    push: function(event, can, msg, cmd, target) {cmd = {select: "rect"}[cmd] || cmd
+    push: function(event, can, msg, cmd, target) {
         var rect = document.createElementNS("http://www.w3.org/2000/svg", cmd);
         target.appendChild(can.onaction.init(event, can, msg, cmd, rect));
         can.core.Item(msg, function(key, value) {
-            if (key == "inner") {
-                rect.innerHTML =  value
-                return
-            }
+            if (key == "inner") {return rect.innerHTML = value}
             rect.Value(key, value)
         });
         return rect;
     },
-    mode: function(event, can, value, cmd) {
-        cmd && can.Action("mode", cmd)
-    },
     _draw: function(event, can, point) {
         can.Status(event, null, "width");
         can.Status(event, null, "begin");
@@ -426,12 +404,11 @@ Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除",
     },
     _move: function(event, can, point) {
         if (point.length == 1) {if (event.type != "click") {return}
-            // 记录图形
             can.onaction._select(event, can, point)
             can.point = point, can.current = {target: can.group}
         } else if (point.length == 2) {
             if (event.type == "click") {
-                can.point = [], delete(can.current); return
+                return can.point = [], delete(can.current)
             }
         }
 
@@ -441,8 +418,7 @@ Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除",
             target.style.cursor = "move"
             can.current.pos = 5, can.current.begin = can.page.Select(can, target, "*", function(item) {
                 if (item.tagName == "g") {return}
-                target.style.cursor = "move"
-                return {
+                return target.style.cursor = "move", {
                     target: item,
                     x: item.Val("x"),
                     y: item.Val("y"),
@@ -450,19 +426,19 @@ Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除",
                     height: item.Val("height"),
                 }
             })
-        } else {
-            can.core.List(can.current.begin, function(item) {
-                can.page.Resizes(event, item.target, item, point[0], point[1], can.current.pos)
-            })
+            return
         }
+
+        can.core.List(can.current.begin, function(item) {
+            can.page.Resizes(event, item.target, item, point[0], point[1], can.current.pos)
+        })
     },
     _resize: function(event, can, point) {
         if (point.length == 1) {if (event.type != "click") {return}
-            // 记录图形
             can.current = {target: event.target}
         } else if (point.length == 2) {
             if (event.type == "click") {
-                can.point = [], delete(can.current); return
+                return can.point = [], delete(can.current)
             }
         }
 
@@ -476,14 +452,12 @@ Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除",
                 width: target.Val("width"),
                 height: target.Val("height"),
             }
-        } else {
-            can.page.Resizes(event, target, can.current.begin, point[0], point[1], can.current.pos)
-        }
-    },
-    _scale: function(event, can, point) {
-        if (point.length < 2) {
             return
         }
+
+        can.page.Resizes(event, target, can.current.begin, point[0], point[1], can.current.pos)
+    },
+    _scale: function(event, can, point) {if (point.length < 2) {return}
         if (point.length == 2) {
             can.last && can.page.Remove(can, can.last)
             var figure = can.onfigure["line"];
@@ -508,11 +482,9 @@ Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除",
         can.group.Value("transform", "scale("+(point[2].x-point[0].x)/(point[1].x-point[0].x)+","+(point[2].y-point[0].y)/(point[1].y-point[0].y)+")")
     },
     _delete: function(event, can, point) {
-        event.target != can.svg && can.page.Remove(can, event.target)
-        can.point = []
+        can.point = [], event.target != can.svg && can.page.Remove(can, event.target)
     },
-    _select: function(event, can, point) {
-        var target = event.target
+    _select: function(event, can, point) {var target = event.target
         while (target) {
             if (target.tagName == "g") {
                 can.Action("group", target.Value("class"))
@@ -529,11 +501,6 @@ Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除",
         can.point = []
     },
 
-    space: function(event, can) {
-        if (!can.current) {return}
-        var figure = can.onfigure[can.current.tagName]
-        figure && figure.space(event, can)
-    },
     oncontextmenu: function(event, can) {var target = event.target
         var figure = can.onfigure[event.target.tagName]||{data: {}}
 
@@ -546,8 +513,8 @@ Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除",
         var point = {x: event.clientX-p.x, y: event.clientY-p.y};
         point.x = point.x - point.x % parseInt(can.Action("grid"));
         point.y = point.y - point.y % parseInt(can.Action("grid"));
-
         can.point = (can.point || []).concat([point]);
+
         can.temp && can.page.Remove(can, can.temp) && delete(can.temp);
         can.onaction["_"+can.Action("mode")](event, can, can.point);
     },
@@ -559,19 +526,18 @@ Volcanos("onaction", {help: "组件菜单", list: ["保存", "清空", "删除",
             can.current || can.page.Prepos(event, event.target)
         }
 
-        if (!can.svg || can.point.length == 0) {return}
         var p = can.svg.getBoundingClientRect()
         var point = {x: event.clientX-p.x, y: event.clientY-p.y}
         point.x = point.x - point.x % parseInt(can.Action("grid"));
         point.y = point.y - point.y % parseInt(can.Action("grid"));
+        can.Status(event, point, "point")
 
+        if (!can.svg || can.point.length == 0) {return}
         can.temp && can.page.Remove(can, can.temp) && delete(can.temp)
         can.temp = can.onaction["_"+can.Action("mode")](event, can, can.point.concat(point))
-
-        can.Status(event, point, "point")
     },
 })
-Volcanos("onchoice", {help: "组件交互", list: ["保存", "清空"]})
+Volcanos("onchoice", {help: "组件交互", list: ["保存", "添加", "删除"]})
 Volcanos("ondetail", {help: "组件详情", list: ["编辑", "复制", "删除"],
     "编辑": function(event, can, value, cmd, target) {
         can.user.prompt("文字", function(text) {
@@ -591,27 +557,30 @@ Volcanos("ondetail", {help: "组件详情", list: ["编辑", "复制", "删除"]
     "复制": function(event, can, value, cmd, target) {
         var figure = can.onfigure[target.tagName].data
         var data = {}
-        data[figure.move.x] = parseInt(target.Value(figure.move.x))+20;
-        data[figure.move.y] = parseInt(target.Value(figure.move.y))+20;
+        data[figure.size.x||"x"] = parseInt(target.Value(figure.size.x||"x"))+20;
+        data[figure.size.y||"y"] = parseInt(target.Value(figure.size.y||"y"))+20;
         can.core.List(figure.copy, function(item) {data[item] = target.Value(item)});
         return data && can.onaction.push(event, can, data, target.tagName, can.group||can.svg)
     },
     "删除": function(event, can, value, key, cmd, target) {can.page.Remove(can, target)},
 })
-Volcanos("onstatus", {help: "组件状态", list: ["begin", "width", "point", "which", "keys"],
-    "begin": function(event, can, value, cmd, target) {target.innerHTML = value? value.x+","+value.y: ""},
-    "width": function(event, can, value, cmd, target) {target.innerHTML = value? value.width+","+value.height: ""},
-    "point": function(event, can, value, cmd, target) {target.innerHTML = value.x+","+value.y},
-    "which": function(event, can, value, cmd, target) {var figure = can.onfigure[value.tagName];
-        target.innerHTML = figure? figure.show(event, can, value, value): value.tagName;
+Volcanos("onstatus", {help: "组件状态", list: ["which", "point", "begin", "width", "keys"],
+    "which": function(event, can, value, cmd, target) {
+        var figure = can.onfigure[value.tagName];
+        target.innerHTML = (value.Group && value.Group().Value("class") || "") + " " + value.tagName + " " + (
+            figure? figure.show(event, can, value, value): "")
     },
+    "point": function(event, can, value, cmd, target) {target.innerHTML = value.x+","+value.y},
+    "begin": function(event, can, value, cmd, target) {target.innerHTML = value? value.x+","+value.y: ""},
+    "width": function(event, can, value, cmd, target) {target.innerHTML = value? value.Val("width")+","+value.Val("height"): ""},
     "keys": function(event, can, value, cmd, target) {target.innerHTML = value},
 })
 Volcanos("onexport", {help: "导出数据", list: [],
     file: function(event, can, svg, cmd, target) {
-        return ['<svg vertion="1.1" xmlns="https://www.w3.org/2000/svg" text-anchor="middle" dominant-baseline="middle"'].concat(svg? can.core.List(["width", "height", "stroke", "fill", "stroke-width"], function(item) {
-            return svg.Value(item)? ' ' + item + '="' + svg.Value(item) + '"': ""
-        }): []).concat(['>', svg?svg.innerHTML:"", "</svg>"]).join("")
+        return ['<svg vertion="1.1" xmlns="https://www.w3.org/2000/svg" text-anchor="middle" dominant-baseline="middle"'].concat(
+            svg? can.core.List(["width", "height", "font-size", "stroke-width", "stroke", "fill"], function(item) {
+                return svg.Value(item)? ' ' + item + '="' + svg.Value(item) + '"': ""
+            }): []).concat(['>', svg? svg.innerHTML: "", "</svg>"]).join("")
     },
 })
 
diff --git a/proto.js b/proto.js
index 340ec0cf..ea4564b6 100644
--- a/proto.js
+++ b/proto.js
@@ -134,12 +134,12 @@ function Volcanos(name, can, libs, cb, msg) { // 封装模块
                     }).length > 0 || msg.option.push(key)
                     msg[key] = can.core.List(arguments).slice(1)
                 },
-                Push: function(key, value) {msg.append = msg.append || []
+                Push: function(key, value, detail) {msg.append = msg.append || []
                     if (typeof key == "object") {
-                        value? can.core.List(value, function(item) {
-                            msg.Push(item, key[item]||"")
-                        }): can.core.Item(key, function(key, value) {
-                            msg.Push(key, value||"")
+                        value = value || can.core.Item(key)
+                        can.core.List(value, function(item) {
+                            detail? msg.Push("key", item).Push("value", key[item]||""):
+                                msg.Push(item, key[item]||"")
                         })
                         return
                     }
@@ -151,7 +151,8 @@ function Volcanos(name, can, libs, cb, msg) { // 封装模块
                     }
                     if (i >= msg.append.length) {msg.append.push(key)}
                     msg[key] = msg[key] || []
-                    msg[key].push(""+value)
+                    msg[key].push(""+value+"")
+                    return msg
                 },
                 Echo: shy("输出响应", function(res) {msg.result = msg.result || []
                     msg._hand = true
diff --git a/style.css b/style.css
index c7b4da50..a76a7154 100644
--- a/style.css
+++ b/style.css
@@ -94,6 +94,14 @@ fieldset div.output>div.item:hover {
     background-color:red;
     border:ridge 2px yellow;
 }
+fieldset div.status {
+    clear:both;
+}
+
+fieldset div.status>div.item {
+    margin:0 2px;
+    float:left;
+}
 
 fieldset.dialog {
     padding:10px;
@@ -156,7 +164,7 @@ fieldset div.code {
     color:white;
     font-size:14px;
     font-family:monospace;
-    background-color:#272822;
+    background-color:#343a34f2;
     white-space:pre;
     padding:10px;
     overflow:auto;