Edit this page

wrap

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

Parameters

elements Array

An array with the drawing elements that should be wrapped.

rect kendo.geometry.Rect

The rectangle in which the elements should be wrapped.

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

Example

<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>
Is this article helpful? Yes / No
Thank you for your feedback!

Give article feedback

Tell us how we can improve this article

close
Dummy