KineticJs one image with multi stroke

Question

I know how to apply a stroke in one image.

Is it possible use multi-stroke in one image?

Maybe like this results.

Or how could I do it.

Answer 1

The simplest way is just draw several Kinetic.Rect nodes on top of your image with required stroke AND transparent background (you can skip fill property or set it to rgba(0,0,0,0)).

var rect = new Kinetic.Rect({
  x: 0, y: 0,
  width: 100, height: 50,
  stroke: 'red'
})