New to Kendo UI for jQuery? Start a free 30-day trial

Wrap

methods

Stacks drawing elements horizontally. Multiple stacks will be used if the elements width exceeds the given rectangle width.

wrap

Parameters:elementsArray

An array with the drawing elements that should be wrapped.

rectkendo.geometry.Rect

The rectangle in which the elements should be wrapped.

Returns:Array

An array with the stacks. Each stack is an Array holding the stack drawing elements.

<div id="surface" style="height:300px;"></div>
<script>
  var draw = kendo.drawing;
  var Rect = kendo.geometry.Rect;
  var Path = draw.Path;
  var rect = new Rect([0, 0], [250, 250])
  var pathRect = new Rect([0, 0], [100, 100]);
  var group = new draw.Group();
  var pathA = Path.fromRect(pathRect);
  var pathB = Path.fromRect(pathRect);
  var pathC = Path.fromRect(pathRect);

  var stacks = draw.wrap([pathA, pathB, pathC], rect);
  for (var idx = 0; idx < stacks.length; idx++) {
    var stackGroup = new draw.Group();
    stackGroup.append.apply(stackGroup, stacks[idx]);
    group.append(stackGroup);
  }
  draw.vStack(group.children);

  group.append(Path.fromRect(rect));

  var surface = draw.Surface.create($("#surface"));
  surface.draw(group);
</script>