ericabouaf / wireit

A javascript wiring library to create web wirable interfaces for dataflow applications, visual programming languages or graphical modeling.
http://neyric.github.io/wireit/docs/
Other
520 stars 90 forks source link

Improvement: don't draw twice #57

Closed ntoniazzi closed 12 years ago

ntoniazzi commented 13 years ago

When drawing a wire, it seems that you don't need to create the path twice (once for the border, the second for the inner content). You can just build the path, and then draw it, change the brush and draw it again as mush as you want :

// Build the path
ctxt.beginPath();
ctxt.moveTo([...]);
ctxt.bezierCurveTo([...]);

// Draw the border
ctxt.lineCap = this.options.bordercap;
ctxt.strokeStyle = this.options.bordercolor;
ctxt.lineWidth = this.options.width+this.options.borderwidth*2;
ctxt.stroke();

// Draw the inner curve
ctxt.lineCap = this.options.cap;
ctxt.strokeStyle = this.options.color;
ctxt.lineWidth = this.options.width;
ctxt.stroke();