Making an SVG DOM JavaScript class
- by CryptoQuick
I'm unsatisfied with other JavaScript libraries and frameworks like jQuery, MooTools, and Raphael, because of their inability to support SVG grouping. You'd think it'd be a very simple thing for them to implement.
Anyway, I'm trying to make a JavaScript class (using John Resig's class.js script) like this:
var El = Class.extend({
el: null,
svgNS: "http://www.w3.org/2000/svg",
init: function (type) {
this.el = document.createElementNS(this.svgNS, type);
},
set: function (name, attr) {
this.el.setAttributeNS(null, name, attr);
},
get: function (el, name) {
var attr = this.el.getAttributeNS(null, name);
return attr;
},
add: function (targEl) {
targEl.el.appendChild(this.el);
},
remove: function (targEl) {
targEl.el.removeChild(this.el);
},
setEl: function (docId) {
this.el = document.getElementById(docId);
}
});
I can add elements to the DOM using these statements outside of the class, but storing the element inside the class becomes problematic. Anyone have any creative ideas?
