今 - svgDraw.jsを書き直してる

svgDraw.jsを書き直してる。
前のver 0.1.1では、タグを入れ子にすることすらできなかった。
↓（前回）↓

svgDraw.jsをちょっと作る
　http://d.hatena.ne.jp/Kureduki_Maari/20081216/1229424827

ちょっと直すつもりが、ちょっと変えたら動かなくなったので、ほっぽりだし（当時）。今頃になって引っ張り出す。発想が変わってて、書き直し……。
versionは0.2.1になるみこみ。

ちなみに。
ver0.1.2は未公開だったので。以下。

/*
 * c4se project
 * svgDraw.js 0.1.2 - 20081214
 *
 * project name: poeml - poems in electrocity
 * project page: http://c4se.sakura.ne.jp/bi_laboratory/poeml/poeml.html
 * project leader: Siki Asai
 *                   lunatic_faily@yahoo.co.jp
 *                   http://c4se.sakura.ne.jp/si_index.html
 * script author: Nemu Inoue
 *                  utakata.c4se@gmsil.com
 *                  http://c4se.sakura.ne.jp/ne_index.html
 *
 * ==License
 * <NYSL Version 0.9982>
 * http://www.kmonos.net/nysl/readme.html
 * ----------------------------------------
 * A. 本ソフトウェアは Everyone'sWare です。このソフトを手にした一人一人が、
 *    ご自分の作ったものを扱うのと同じように、自由に利用することが出来ます。
 *   A-1. フリーウェアです。作者からは使用料等を要求しません。
 *   A-2. 有料無料や媒体の如何を問わず、自由に転載・再配布できます。
 *   A-3. いかなる種類の 改変・他プログラムでの利用 を行っても構いません。
 *   A-4. 変更したものや部分的に使用したものは、あなたのものになります。
 *        公開する場合は、あなたの名前の下で行って下さい。
 * B. このソフトを利用することによって生じた損害等について、作者は
 *    責任を負わないものとします。各自の責任においてご利用下さい。
 * C. 著作者人格権は ○○○○ に帰属します。著作権は放棄します。
 * D. 以上の３項は、ソース・実行バイナリの双方に適用されます。
 *
 * ==What's this?
 * You can draw easyly SVG by JavaScript by this 'svgDraw.js'.
 * Those graphics are drawn without using Microsoft VML, Adobe Flash, Sun Java, JavaScript canvas.
 */

(function(){

var svgDraw = window.svgDraw = function(node){
  return svgDraw.fn.make(node);
};

svgDraw.fn = svgDraw.prototype = {
  _className: "svgDraw",
  ns: "http://www.w3.org/2000/svg",
  xlinkns: "http://www.w3.org/1999/xlink",
  svg: document.createElementNS(this.ns, "svg"),
  style: {
    fill:"#000", opacity:1.0,
    stroke:"#000", "stroke-width":1, "stroke-opacity":1.0
  },
  make: function(node){
    node.appendChild(document.createElementNS(this.ns, "svg"));
    this.svg = node.lastChild;
    return this;
  },
  createTagNS: function(ns, elem, attrHash){
    var tag = document.createElementNS(ns, elem);
    for(var prop in attrHash)
      tag.setAttribute(prop, attrHash[prop]);
    return tag;
  },
  width: function(num){
    this.svg.setAttribute("width", num);
    return this;
  },
  height: function(num){
    this.svg.setAttribute("height", num);
    return this;
  },
  viewBox: function(nums){
    this.svg.setAttribute("viewBox", nums);
    return this;
  },
  /*layerids: [],
  layer: function(name){
    var g = createElementNS(this.ns, "g");
    g.setAttribute("class", "layer");
    g.setAttribute("id", "ylayer_"+name);
    layerids.push(name);
    
  },*/
  fill: function(color){
    this.style.fill = color;
    return this;
  },
  opacity: function(num){
    this.style.opacity = num;
    return this;
  },
  stroke: function(color){
    this.style.stroke = color;
    return this;
  },
  stroke_width: function(num){
    this.style["stroke-width"] = num;
    return this;
  },
  stroke_opacity: function(num){
    this.style["stroke-opacity"] = num;
    return this;
  },
  rect: function(hash){
    var style = c4sey.mixin({x:0, y:0, width:10, height:10, rx:0, ry:0}, hash);
    style = c4sey.mixin(style, this.style);
    this.svg.appendChild(this.createTagNS(this.ns, "rect", style));
    return this;
  },
  circle: function(hash){
    var style = c4sey.mixin({cx:10, cy:10, r:10}, hash);
    style = c4sey.mixin(style, this.style);
    this.svg.appendChild(this.createTagNS(this.ns, "circle", style));
    return this;
  },
  ellipse: function(hash){
    var style = c4sey.mixin({cx:20, cy:10, rx:20, ry:10}, hash);
    style = c4sey.mixin(style, this.style);
    this.svg.appendChild(this.createTagNS(this.ns, "ellipse", style));
    return this;
  },
  line: function(hash){
    var style = c4sey.mixin({x1:0, y1:0, x2:"100%", y2:"100%"}, hash);
    style = c4sey.mixin(style, this.style);
    this.svg.appendChild(this.createTagNS(this.ns, "line", style));
    return this;
  },
  polyline: function(hash){
    var style = c4sey.mixin({points:"0,0 100%,0 100%,100%"}, hash);
    style = c4sey.mixin(style, this.style);
    this.svg.appendChild(this.createTagNS(this.ns, "polyline", style));
    return this;
  },
  poligon: function(hash){
    var style = c4sey.mixin({points:"0,0 100%,0 100%,100%, 0,100%"}, hash);
    style = c4sey.mixin(style, this.style);
    this.svg.appendChild(this.createTagNS(this.ns, "poligon", style));
    return this;
  },
  text: function(str, hash){
    var style = c4sey.mixin({x:0, y:0, "font-size":"12pt", "font-family":"serif", "font-weight":"normal", "font-style":"normal", "font-decoration":"none", "word-spacing":"1em", "letter-spacing":1, "text-anchor":"start"}, hash);
    style = c4sey.mixin(style, this.style);
    var text = this.createTagNS(this.ns, "text", style);
    text.appendChild(document.createTextNode(str));
    this.svg.appendChild(text);
    return this;
  },
  path: function(hash){
    var style = c4sey.mixin({d: ""}, hash);
    style = c4sey.mixin(style, this.style);
    this.svg.appendChild(this.createTagNS(this.ns, "path", style));
    return this;
  }
};

})();

// ========== end <svgDraw.js> ==========

try{
  c4sey;
}catch(e){
  c4sey = {};
}
c4sey.mixin = function(hash1, hash2){
  for(var prop in hash2)
    hash1[prop] = hash2[prop];
  return hash1;
};

0.1.1からは、機能を増やしただけ。この段階ではまだ動くはずである。
ちょっとしたSVGなら充分実用的、かも、しれない。