i want to align multiple draggable elements inside a div. How can i do when i initiate it.

HTML:

<div class="drag-parent" style="height: 400px; width: 400px; background: #fff; border: 1px solid #eee;">
       <div class="drag-1" id="drag1"> Draggable Element 1 </div>
        <div class="drag-2" id="drag2"> Draggable Element  2</div>
</div>

I am trying following things:

const drag1 = interact('.drag-1');
const drag2 = interact('.drag-2');

drag1.draggable({});
drag2.draggable({});

I want to place above elements lets say drag-1 to x:10 y:10 and drag-2 to x:100, y:100.

Please guide. Thanks!