vendredi 5 février 2016

extending dom element - update/convert length units of SVGLength instance

intro:

  • I'm working with a collection of objects which are instance of SVGLength
  • the shape of the svg element changes as it's binded to certain events
  • the signal-events coming in don't specify the length unit
  • once updated position i need to convert back values to original unit format as it's binded to UI

Using SVGLength standard methods this is the basic process I came up with :

//store the unit values 
var xxx= obj.attrsLength.cx.baseVal.unitType

// set value with the unitless value
obj.cx.baseVal.newValueSpecifiedUnits(1, point.x)

//at the end I would reconvert it back to the correct unit
obj.cy.baseVal.convertToSpecifiedUnits(xxx)

So I decided to extend the SVGLength.prototype with a method that resembles this process and this is what I'm currently using:

    if(SVGLength.prototype && !SVGLength.prototype.updateConvertSVGLen)
    SVGLength.prototype.updateConvertSVGLen = function(v){
        this.oldVal = this.unitType;
        this.newValueSpecifiedUnits(1, v);
        this.convertToSpecifiedUnits(this.oldVal);
    }

I'm extending the SVGLength.prototype as-is in the example, is there a better way , what's considered the best practice in this case?

What are the pros and cons of extending a node element ?
I've read that the main issues one can hit with extending dom objects is cross browser support of interfaces ,is there a safer way ?

As a plus , the current process updates the value ( number unit) and then converts it , I can't seem to find the unit conversion table that the standard methods uses for converting in the specified unit, is there an interface for that ?

Aucun commentaire:

Enregistrer un commentaire