Default values for svg.js elements

Question

Is there any possibility to set default fill for all newly created elements? this is how i'm doing it now:

draw.circle(radius).fill(params);

params are always the same so do i need to pass them al the time?

Answer 1

I think you could pull it off with SVG.extend(). Check it out on the docs. Basically you add a method that would set default values.

SVG.extend(SVG.Circle , {
  setDefault: function() {
    return this.fill({ color: '#7FFFD4', opacity: 0.2 })
  }
}) 

Answer 2

Its old but hey: You can simply extend container elements with a new method which creates the circle you want. You also could invent a new shape and add methods for it as you like but thats maybe a bit overkill for your problem

SVG.extend(SVG.Container, {
  filledCircle: function(radius) {
    return this.circle(radius).fill({ color: 'red', opacity: 0.5 })
  }
})

// usage
draw.filledCircle(10).center(50,50)