'Snap-to-grid' functionality

5 posts, 0 answers
  1. John
    John  avatar
    15 posts
    Member since:
    May 2014

    Posted 25 Mar 2015 Link to this post

    Hello,

    I need to organize my diagram in a way that each time I drop a shape or draw a connection, it is lined up properly.
    Also is there a way to increase the movement's step of a given shape in order to make the dropped shapes organized in a better way?

    Thanks in advance.
  2. Daniel
    Admin
    Daniel avatar
    2118 posts

    Posted 27 Mar 2015 Link to this post

    Hello John,

    There is a snap.size option that can be used to change the step but it seems that it is missing from the documentation. We will document it as soon as possible. 
    Snap to grid functionality is not currently available although it is partially incorporated in the code and could be implemented by using approach similar to the one in this example.

    Regards,
    Daniel
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. Adrian
    Adrian avatar
    3 posts
    Member since:
    Nov 2014

    Posted 18 May 2015 in reply to Daniel Link to this post

    Hello Daniel,

     We are trying this approach and it works but, there is an issue with editable diagrams.......shapeDefaults: {editable: {tools: ['edit', 'delete']}}

    For the user issue is:  they select one element and if he deletes it,he will see another one disappearing.

    Why?

    By adding a drawings group at index 0, Kendo seems to lose the index for all other groups (diagram shapes) so when you attempt to delete one the immediate before is actually erased. 

    Any suggestions to fix this?

    Will really appreciate it Daniel

    Regards

  5. Daniel
    Admin
    Daniel avatar
    2118 posts

    Posted 20 May 2015 Link to this post

    Hello Adrian,

    Indeed, you are right. The elements are removed by index and an incorrect element will be removed when when inserting an additional element to the shapes group. You can avoid the problem by inserting the grid in root group:
    diagram.canvas.drawingElement.insertAt(grid, 0);
    In this case you will also need to scale the grid when the diagram is zoomed e.g.
    zoomEnd: function(e) {                  
        this.canvas.drawingElement.children[0].transform(kendo.geometry.transform().scale(e.zoom));
    }


    Regards,
    Daniel
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  6. Adrian
    Adrian avatar
    3 posts
    Member since:
    Nov 2014

    Posted 20 May 2015 in reply to Daniel Link to this post

    Hey Daniel, 

    this works great!

    thank you man 

    Adrian

Back to Top
Kendo UI is VS 2017 Ready